eValid™ -- The Web Quality Suite Browser-Based Client-Side Functional Testing and Validation Page Timing/Tuning Transaction Monitoring. WebSite Spidering & Analysis and Realistic Server Loading.

Overview
There is a relatively standard approach for handling playback synchronization in complex AJAX applications. As described in Manual Script Creation Process one uses specific Index/Motion [Structural] to effect playback synchronization that does not rely on wait times or other playback artifices.

General Process
There is no universal, fixed method for implementing AJAX pages, and therefore there is no 100% perfect algorithm to assuring wait-time-independent fully automatic playback. However, there are certain aspects to synchronization that are generalizable. Here is how the process can work in general as the eValid browser interacts with the web server in a typical AJAX application:

1. Confirm Page Is Present -- Make sure that you are starting in a known place, because loss of synchronization will ruin the test.
2. Find The Pivot Object -- Choose some place on the page that you know will be present and preferably unique on the page.
3. Move Up/Down To Action Element -- Move structurally to the desired action point.
4. Take Acton -- Apply the action (click, text input value, etc.)
5. Synchronize Completion Of Response -- Make sure you KEEP synchronized.
6. Repeat (Go Back to Step 1)

There are many DOM Technology Resources that can be used in the process of creating a reliable playback script.

Detailed Explanation
Here is a detailed explanation of these steps, with notes tied to the example shown below:

1. Confirm Page Is Present
   The pivot page is the one on which you are going to be taking an action. AJAX pages are dynamic, and it is crucial to confirm, before starting the structural command sequence, that the elements you are searching for (at an unknown location on the page) are indeed present.

   Notes on Script Sample Below

   • You don't want to start on the currently (just downloaded page) before making sure it is actually there.
   • Pick a propertyName and associated propertyValue that you KNOW are going to be on the page.
   • Use the PageMap to read the names and values you need to construct this command.
   • Next, now that you know you are on the right page, make SURE that the needed id and it's idValue are present.
   • Use the Synchronization on Visible Text command or choose one of the Playback Synchronization on DOM Element commands, among others.

2. Find The Pivot Object
   Use Index/Motion commands to find the object upon which you can always pivot the actual action you want to perform.

   Notes on Script Sample Below

   • You know you are on the right page and that the id = idValue is there, but you don't know WHERE it is.
   • You can use the IndexFindElement or the IndexFindElementEx command
   • It is OK to use the same id = idValue that was used for synchronization: more synchronization is always better than the alternative.
   • Start the search from the top (IndexSet 0) of the page.
   • Move DOWN the page (increasing element sourceIndex values) until you establish the value of sourceIndex.

3. Move Up/Down To Action Element
   Now the sourceIndex points at the pivot object, and you need to move UP or DOWN the page to the element at which you are going to apply an event or action.

   Notes on Script Sample Below

   • You know the page is in place and you have established the sourceIndex of the test's structural pivot point.
   • Use the PageMap to find where the actual target is RELATIVE to the sourceIndex you have just found as your pivot point.
   • Move up (or down) a fixed number of page element positions so that sourceIndex points at the object where you want to take an action.

4. Take Acton
   Knowing you are in the right place, you now take the required action.

   Notes on Script Sample Below

   • Now, sourceIndex points to the target of the action.
   • Issue the action (in this case a simple IndexElementClick).
   • Or, use a more complicated IndexElementEvent command for actions other than a simple left-click.

5. Synchronize Completion Of Response
   The AJAX application now interacts in detail with the web server, and you need to assure that the page that is commanded to be next is present and fully available.

   Notes on Script Sample Below

   • The AJAX application will respond to the action you just took, but before continuing you need to make sure that the page navigation and update have been completed.
   • Choose some visibleText that will signify completion of the page retrieval.

6. Repeat (Go Back to Step 1)
   You've achieved this result, but likely there is a needed next action, for which the treatment will be done similarly (but probably with different data).

   Notes on Script Sample Below

   • Now you have completed the action, have a stable delivered result page, and are ready to repeat.

Sample Script
Here is a sample script fragment that reflects the suggestions above. For clarity in the script the frame_path for each command is "", and the window id (wid) is zero (top window).

...
# Regular playback operations...

# (1) Confirm Page Is Present..
SyncOnElementProperty 0 "propertyName" "propertyValue" ""
SyncOnElementProperty 0 "id" "idValue" ""

# (2) Find the pivot object...
IndexSet 0
IndexFindElement 0 DOWN "id" "idValue" ""

# (3) Move up/down to the action element...
IndexMove +5

# (4) Take action...
IndexElementClick 0 ""

# (5) Synchronize completion of response...
SyncOnText 0 "visibleText" ""
Delay 1000

# (6) Repeat...
...