Your e-Business Quality Partner 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.

eValid -- Simple AJAX Synchronization Methodology
eValid Home

Overview
This page describes a relatively simple approach for assuring playback synchronization in complex AJAX applications. If this methodology is insufficient then the AJAX Synchronization Loop provides a more detailed method for making SURE that AJAX applications synchronize.

Methodology
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 is a relatively simple method for making a recording of an AJAX application that has a very high success rate.

Here is how the recording process with this methodology works:

  1. Take The Required Action -- Apply the action (click, text input value, etc.) and wait until your application settles down.

  2. Add the Visible Text Synchronization Command -- Pick some visible text on the stable screen, highlight it and then apply the SyncOnText option from the eValid GUI sequence:

         eValid: Record > Validate > & Synchronize > Text String

    This command results in a SyncOnText command being written into the script where, at playback time, it will hold back pending arrival of the selected text.

  3. Repeat -- For The Next Page or Exit the Recording.

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

  1. Record Normally, Take Acton
    Use eValid to browse forward to the page which will start an AJAX-dependent action, and then take the required action.

    Notes on Script Sample Below
    • Wherever you start it is a good idea to confirm that the page you expect to be taking an action upon is really there.
    • You can use the eValid: Record > Validate > & Synchronize > Text String or you can type the shortut Ctrl+Y.
    • For more complicated situations you may need one of the DOM-based synchronization commands such as SyncOnElementProperty.

  2. Synchronize Completion Of Response
    After you take the action the AJAX application interacts with the web server to deliver the next page. You need to assure that the page that is commanded to be next is really present and fully available to receive the next response. When recording, wait until the response page is fully processed. Then, pick a text passage on the page, highlight it, and use the eValid GUI sequence to add in the synchronization command:

         eValid: Record > Validate > & Synchronize > Text String"

    to add in the SyncOnText command.

    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 visible text that will signify completion of the page retrieval.
    • Generally, you should synchronize on visible text that is part of the the last-arriving material on the page.

  3. Repeat (Go Back to Step A)
    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 eValid 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). These may change depending on your AJAX application.

...
# Regular playback operations...
...

...
# (A) Stabilize (synchronize) and then take action...
SyncOnText 0 "Something in the page where you start..."
IndexElementClick 0 "" or FollowLink or ...
...

...
# (B) Synchronize completion of response...
SyncOnText 0 "visibleText" ""
...

...
# (C) Repeat or End...
...