Selenium Webdriver - Wait for an element to load

I am currently working on a project that uses a lot of AJAX and delayed loading of HTML elements. This means that when a page loads, the object that I am looking for might not necessarily have appeared yet. In many instances the element may only be added to the DOM after an amount of time by the use of some JavaScript.

At first, we decided to write our automated tests as normal using Selenium Webdriver - but we soon noticed that this would be a bit trickier if the elements that we needed to test only appeared after the page loaded. After a bit of research, I came across Explicit and Implicit Waits in Selenium. In Selenium, waiting is having the automated task execution elapse a certain amount of time before continuing with the next step. There are two different kinds of waits - Explicit and Implicit Waits. An explicit wait is code you define to wait for a certain condition to occur before proceeding further in the code. An implicit wait tells WebDriver to poll the DOM for a certain amount of time when trying to find an element or elements if they are not immediately available.

Let's run through a quick example using both waits. In this example I am going to run through the search functionality on the Bookatable.com homepage. This is a good example to use because the automplete functionality only appears after the user has typed in the text box. In this example we are going to test that the correct search results get returned when we enter certain keys.

In the code below we navigate to the Bookatable.com website. Then we find the element named "ddRestaurants", click the element and enter the letters "or" in the textbox.

Unfortunately the above code will fail with the following error:

OpenQA.Selenium.NoSuchElementException : Unable to locate element: {"method":"class name","selector":"ac-row-110457"}

This is because we expect to see the autocomplete pop-up element appearing instantly and because the Selenium code is executing faster than the Ajax takes to complete it won't be able to find the element and it will throw an error.

Explicit wait

This is where the explicit wait starts to become really useful. Instead of instantly looking for an element, we can tell Webdriver to wait for a certain amount of time before we continue with the next step. The example below runs through the usage of an explicit wait. In order to use the wait functionality in Selenium Webdriver, you will need to add a reference to the Webdriver.Support.dll, as well as the standard Webdriver.dll. You can either download this directly from the Selenium website, or I like to use the Nuget packages and add it directly from the Solution Explorer in VS2010.

If you run this test, you will notice that it passes successfully because we have explicitly told it to wait for a certain amount of time before continuing.

Implicit Wait

Another option that is available to use is the implicit wait. The difference with the implicit wait is that it will tell Webdriver to poll the DOM for a certain amount of time when trying to find an element or elements if they are not immediately available.

The example below runs through an implicit wait. Notice how it differs from an explicit wait.

One thing to keep in mind is that once the implicit wait is set - it will remain for the life of the WebDriver object instance. Personally I prefer to use the explicit wait because it only pauses before continuing, but you will need to decide on what suits your situation best. For more information on waits in Webdriver, please follow this link.

I have created a small sample with the tests used in this post. For more information - please download here.