Question

We’re using Selenium with the Java API and some Javascript user extensions. We use a lot of AJAX calls in our app. A lot of our tests fail randomly because sometimes the AJAX calls finish slower than other times so the page isn’t fully loaded. We fix that by waiting for specific elements or Thread.sleep. I was trying to find a way to instead just wait for the network traffic to finish. So that we could do this:

selenium.click("some JS button");
selenium.waitForNetwork();
assertTrue(something);

That way we can get rid of the thread sleep and have tests pass faster when the server responds faster and not have so many tests fail due to timing issues.

I haven’t been able to find a way to do this searching Google. Does anyone have any ideas how we can accomplish this? (Preferably either through Javascript or the Java API but all suggestions are welcome).

Note: the other variations of “waitFor” are not what I’m looking for. We’re already using those in clicks and other things. I’m looking for something that waits for the NETWORK TRAFFIC. Thanks for all the feedback, I’ll be trying out a couple of the suggestions, but I’m still open to other ideas.

Thanks.

Answer 1

Update: I use the same method (wrapRequest) in the same way with Selenium2 and it still works. The only difference is that I don’t use a user extension. I just execute javascript to query the code that is loaded by the JSP.

Here’s what we ended up doing.
(Note, there are easier ways of getting if an Ajax call is running if you are always using only a single framework like JQuery. We had to jimmy-rig this a bit more because we have a few pages that use JQuery and a bunch that use GWT)

I created a Javascript file that every page loads only if you’re testing. (I did this by including a snippet in our JSP’s template: if the testing querystring param is passed in as true, set a cookie. If that cookie is set, include the javascript file)
This javascript file essentially wraps the XMLHttpRequest object to keep count of all the send requests:

function wrapRequest(xmlRequest) {
    var oldSend = xmlRequest.prototype.send;
    xmlRequest.prototype.send = function() {
        var oldOnReady = this.onreadystatechange;
        oldOnReady = function() {
            oldOnReady.apply(this, arguments);
            // if call is complete, decrement counter.
        }
        // increment counter
        if(oldSend.apply)
            oldSend.apply(this, arguments);
        else if (oldOnReady.handleEvent) { //Firefox sometimes will need this
            oldOnReady.handleEvent.apply(this, arguments);
        }
    }
}

There’s a little more to it than that if async == false, but that should be easy enough to figure out.

Then I added a function to the selenium user-extensions.js that simply looks like this:

Selenium.prototype.getIsNetworkReady = function() {
    if(this.browserbot.topWindow.isNetworkReady) { //sometimes this method is called before the page has loaded the isNetworkReady function
        return this.browserbot.topWindow.isNetworkReady();
    }
    return false;
}

Also, notice the check on topWindow: this is because you get issues when an iframe is selected.

Also, you will have to call the wrapRequest method on the XMLHttpRequest object of every iFrame that gets loaded. I do that right now using: document.addEventListener("DOMNodeInserted", onElementAdded, true); and then in onElementAdded I just grab the iframe when it’s loaded and pass in the XMLHttpRequest object. but that doesn’t work in IE so I’m looking for an alternative. If anyone knows of a better way to do that so it works in both IE and FF I would love to hear it.

Anyway, that’s the gist of the implementation. Hope this helps anyone in the future.