Run massively scalable performance tests on web, mobile, and APIs

Request a Demo
Sep. 27th, 2018

5 Ways to Test AJAX Calls in Selenium WebDriver

AJAX stands for Asynchronous Javascript And XML. It is a technique for asynchronously sending a XMLHttpRequest from the web page to the server and sending/retrieving data to be used on the developed web page. The client-side browser communicates with the server via AJAX, which allows an operation to be performed without needing to actually refresh the page. This means an AJAX call has no visible output in page transition, so a user can still work on the page while a request is being preceded.  

 

AJAX Challenges When Testing with Selenium WebDriver

 

While AJAX calls improve efficiency and are valuable for users, they are challenging when testing with Selenium WebDriver. In AJAX, the code on the DOM page is generated after an action, without actually changing the page or even the DOM. This makes it very difficult to know the actual time when an AJAX call was completed and hence when a page is updated and with which values.

 

As a result, you may be spending a lot of time waiting after the integration of every page, which affects both the reliability and the speed of your system. Miscalculating your timing can also fail your test, if you wait too long.

 

Overcoming AJAX Call Challenges in Selenium WebDriver

 

But there is a solution: by waiting for the elements that will appear in the AJAX generated pages, you will know when the page loaded. Then, you can feel comfortable going forward in the test.

 

In this article we will explore several useful ways to actually handle and deal with these AJAX calls, by using Wait methods.

 

There are several Wait methods you can use to handle AJAX calls. You can add these pieces of code to your own AJAX testing code.

 

1. Explicit Waits

 

Setting a certain desired condition for the system in the code. Only after this condition occurs, the operation can proceed to the next step. 

 

Code:

webdriver driver = new firefoxdriver();
driver.get("http://somedomain/url_that_delays_loading");
webelement mydynamicelement = (new webdriverwait(driver, 10))
.until(expectedconditions.presenceofelementlocated(by.id("mydynamicelement")));

 

2. Implicit Waits

 

You can also go for Implicit Waits, where you can decide on a certain amount of time you require WebDriver to poll the DOM for. In this case your WebDriver will keep looking for an element(s), if it had been unavailable immediately. The default time is set as 0, which can be easily adjusted as you may prefer. In addition, this set wait time lasts as long as your browser is open, so the time to search for any element on the page will be the same.

 

Code:

webdriver driver = new firefoxdriver();
driver.manage().timeouts().implicitlywait(10, timeunit.seconds);
driver.get("http://somedomain/url_that_delays_loading");
webelement mydynamicelement = driver.findelement(by.id("mydynamicelement"));

 

3. Fluent Waits

 

In the previous wait methods, you had to manually set the desired time per unit. However, there are cases when an element still remains unavailable during this period. In this case you can use Fluent Waits. These allow you to configure the element polling mechanism. An example of code that is set for 5 second wait and poll of every 100 milliseconds is given below:

 

Code:

 
fluentwait<by> fluentwait = new fluentwait<by>(by.tagname("textarea"));  \\ define element for which you want to poll
        fluentwait.pollingevery(300, timeunit.milliseconds); \\ it will ping for every 5 sec
        fluentwait.withtimeout(1000, timeunit.milliseconds);  \\ max time out
        fluentwait.until(new predicate<by>() {
            public boolean apply(by by) {
                try {
                    return browser.findelement(by).isdisplayed();
                } catch (nosuchelementexception ex) {
                    return false;
                }
            }
        });
        browser.findelement(by.tagname("textarea")).sendkeys("text to enter");

 

4. WebDriverWait

 

Another approach of WebdriverWait (which we used in the Explicit Wait) can also be used. You can use a combination of ExpectedCondition and WebDriverWait strategies, and write a code which will let the system wait for the set amount of time until an element becomes available. What will happen is that the system will start checking the condition every second, and once the set criteria is met, it will proceed to following steps. 

 

Code:

 
public expectedcondition<webelement> visibilityofelementlocated(final by by) {
        return new expectedcondition<webelement>() {
          public webelement apply(webdriver driver) {
            webelement element = driver.findelement(by);
            return element.isdisplayed() ? element : null;
          }
        };
      }
      
      public void performsomeaction() {
        ..
        ..
        wait<webdriver> wait = new webdriverwait(driver, 20);
        webelement element = wait.until(visibilityofelementlocated(by.tagname("a")));
        ..        
      }

 

5. Thread.Sleep

 

In addition, when using JAVA for your Selenium tests, you can go for the most common method of Thread.Sleep (<time in ms>). However,  this method is not recommended when automating tests, so it is advised to use this method only in case you are not able to find another solution. The problem with this method is that the current thread is suspended for an initially specified amount of time, whereas in AJAX you can never know the exact wait time. Hence, your test faces the risk of failing if your elements fail to become available during the wait time.

 

Tracking AJAX Calls

 

These Wait conditions are helpful for dealing with AJAX calls. However, they don’t answer the problem of determining when a call finishes, and you will probably don’t want to carry on with your operation until it does. In addition, wait conditions are limited only to those AJAX calls that result in changes to the browser DOM, because those were the ones that created the element you tested.

 

To track AJAX calls, you can use jQuery, in addition to the previous methods. The jQuery system keeps the track of the number of active AJAX calls on the jquery.active variable. When JQuery executions are completed, you will have the initial jQuery.active == 0. You can use this in the Wait.Until method, and wait until the script returns as true.

 

By exploring and understanding the options you will have when testing AJAX calls, you will be able to improve your testing.

 

An easy way to create your Selenium testing code is by recording it in the free BlazeMeter Chrome extension recorder. Just start the recorder, play out your scenario and get your script. Get it here.

 

tracking ajac calls in selenium

Interested in writing for our Blog? Send us a pitch!