Wednesday, October 20, 2010

How the jQuery.active code works..

If you look online to find the best way to check if there are any active jQuery Ajax requests for Selenium, you may find the following line that can be invoked by your code:
browser.wait_for_condition("selenium.browserbot.getCurrentWindow().jQuery.active === 0;", '30000')
If you look inside the jQuery code, here is how the active flag works. Basically the global: flag is a default setting to enable global event handlers for ajaxStart and ajaxStop. If the jQuery.active counter is 0, then we fire ajaxStart. If the jQuery.active is equal to 0 after decrementing, then we fire the ajaxStop event:
ajaxSettings: {
        url: location.href,
        global: true,
        type: "GET",
        contentType: "application/x-www-form-urlencoded",
        processData: true,
        async: true,

    etag: {},

    ajax: function( origSettings ) {
        var s = jQuery.extend(true, {}, jQuery.ajaxSettings, origSettings);

      // Watch for a new set of requests                                                                                                      
        if ( s.global && ! jQuery.active++ ) {
            jQuery.event.trigger( "ajaxStart" );
        }

       // Handle the global AJAX counter                                                                                                   
            if ( s.global && ! --jQuery.active ) {
                jQuery.event.trigger( "ajaxStop" );
            }

Here is the documentation describes the global variable in http://api.jquery.com/jQuery.ajax/
globalBoolean
Default: true
Whether to trigger global Ajax event handlers for this request. The default is true. Set to false to prevent the global handlers like ajaxStart or ajaxStop from being triggered. This can be used to control various Ajax Events.
In other words, you still need to put JavaScript-based wait_for_condition() calls if you are doing things like waiting for dialog boxes to render. For instance, if you are using a JQuery UI dialog box, you could do something like the following:
selenium.wait_for_condition("selenium.browserbot.getCurrentWindow().document.getElementsByClassName('ui-dialog')[0].style.display != 'none'", 10000)
This function will wait for the presence of the dialog box. We rely on the display: style property of the overlay to determine if the dialog is rendered properly. We assume in the example for now there is only one ui-dialog class. Using the overlay that gets rendered is how JQuery hides/shows the dialog box.

No comments:

Post a Comment