Waits and Synchronization

Context:

Whenever we hit a URL in a browser, the request is submitted to the server and it returns back with resources (response object, headers, javascript etc.). Ultimately it is the browser engine that parses the response from server and displays the elements like text fields, buttons, links and so on. In other works as defined by W3C, the DOM (document object model) dictates how the content gets displayed on browser. Every time a user performs an operation on the browser, one of the following (not limited to) happens:

1) The request goes all the way to server and entire DOM is refreshed when response comes back
2) The request hits the server and only partial DOM gets refreshed (ajax requests or asynchronous javascript calls)
3) The request is processed on the client side itself by javascript functions

So if we think about the overall workflow, there needs a certain synchronization that happens between the client(aka. browser) and the server (the url)

Pre-requisites:

  1. You have completed the section “Set up Env” and have your environment ready with JDK, maven and Eclipse (+plugins)
  2. You have read and understood HTML DOM
  3. You were able to comprehend “Find Element Strategies” post
  4. You downloaded the project code base for class3 under – https://github.com/machzqcq/CucumberJVMExamples and imported into Eclipse and the structure should look as below

class4_project_structure

If you imported in intelliJ, free community edition [which I would recommend using over Eclipse], it should look as below

class4_intellij_project_structure

How is it related to Test Automation?

If we peruse a little deeper, the operations we do on browser has to be aligned with how the server or the web app responds. For example, if I hit a website and it takes 5 seconds for the website to respond, I would have to wait for at least 5 seconds in my script before doing further operations. So every operation is governed by a timeout after which I report a failure in my script and ultimately a defect is a possibility. So while writing my test Automation scripts, I have to have mechanisms to do “Waits” and define “timeouts”, not only at the page level, but also at the element level and sometimes.

But What am I really waiting for ?

The following will help explain each of the Wait scenarios and options available to us through Selenium Java Webdriver.

Page Load

Page load timeout as the name suggests is setting the max. time until which we will wait for the page to load. By default the page load is infinite

1
2
Timeouts timeouts = driver.manage().timeouts();
timeouts.pageLoadTimeout(10, TimeUnit.SECONDS);

Script Timeout

The script timeout is generally used with ajax waiting commands. For example as seen below, we are setting a max. timeout of 5 seconds for execute_script() method. That means, the webdriver will wait for a max. of 5 seconds for the script to execute and return. If the script execution takes more than 5 seconds, a TimeOut Error is thrown and the execution halts.

1
2
Timeouts timeouts = driver.manage().timeouts();
timeouts.setScriptTimeout(5, TimeUnit.SECONDS);

Implicit Wait

Implicit Wait is the max. wait time we want to wait for element to move forward with the operation on the element. Implicit timeout applies to all WebElements once set i.e. it is a global setting. It is advised NOT to mix up implict and explicit timeouts.

1
2
Timeouts timeouts = driver.manage().timeouts();
timeouts.implicitlyWait(5, TimeUnit.SECONDS);

Explicit Wait & Expected Conditions

Explicit waits are the best practice waits to be used in automation scripts especially since modern web apps have different timeouts on different parts of web page. Explicit timeouts are also a great set of functionality to help us get granular and wait for different elements for different waiting times. Explicit Waits are generally combined with ExpectedConditions object and there are many combinations available. An example below

1
2
3
4
5
Timeouts timeouts = driver.manage().timeouts();
timeouts.implicitlyWait(5, TimeUnit.SECONDS);
WebDriverWait waiter = new WebDriverWait(driver, 5);
WebElement element = waiter.until(ExpectedConditions.elementToBeClickable(By.id(“periodicElement”)));
System.out.println(“Expected condition found this element with HTML” + element.getAttribute(“outerHTML”));

1
2
3
4
5
6
WebDriverWait waiter1 = new WebDriverWait(driver, 6);
driver.findElement(By.id(“timingAlert”)).click();
Alert alert = waiter1.until(ExpectedConditions.alertIsPresent());
Thread.sleep(4000);
System.out.println(“Found alert”);
alert.accept();

FluentWait

FluentWait is similar to ExplicitWait , however it adds more options for us especially around waiting on predicates and non-predicates (functions). This is very useful for us in Ajax application waits. We will discuss in detail with all scenarios in training class as it is difficult to write every scenario, instead we would simulate and show you how it works effectively. An example below that combines FluentWait with a function

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
FluentWait<ChromeDriver> wait = new FluentWait<ChromeDriver>((ChromeDriver) driver);
wait.withTimeout(30, TimeUnit.SECONDS);
wait.pollingEvery(2, TimeUnit.SECONDS);
wait.ignoring(NoSuchElementException.class);
wait.ignoring(StaleElementReferenceException.class);
List<WebElement> targetElements = wait.until(new Function<ChromeDriver, List<WebElement>>()
{
public List<WebElement> apply(ChromeDriver driver) {
List<WebElement> elements = driver.findElements(By.id(“periodicElement”));
int length = elements.size();
System.out.println(“current Length is”+length);
if(length==5)
{
System.out.println(“Target Length is hit”+length);
return elements;
}
return null;
}
});

Below, we are going to write 6 cucumber scenarios, each covering an important concept. A brief description of each is as below

  1. First scenario sets the pageload timeout [This scenario is expected to fail]
  2. Second scenario sets the implicitwait timeout
  3. Third scenario sets script timeout – This is for when we execute javascript using selenium webdriver
  4. Fourth scenario uses explicit timeout and waits until the element becomes clickable
  5. Fifth scenario uses explicit timeout and waits until the alert becomes present
  6. Sixth scenario demonstrates how FluentWait works using google function()

Cucumber Waits Scenario

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
# is the focus of this training module. Cucumber gherkin has to focus on business acceptance criteria not get as technical as below
Feature: Demonstrate Waits
Scenario: Pageload timeout
When I open seleniumframework website
And I set pageload timeout
Scenario: Implicit Wait timeout
When I open seleniumframework website
And I set implicit timeout
Then I print the text for target element
Scenario: Script timeout
When I open seleniumframework website
And I set script timeout
Scenario: Explicit Wait and Expected Conditions clickable
When I open seleniumframework website
Then I set explicit wait block on target element until it becomes clickable
Scenario: Explicit Wait and Expected Conditions alert present
When I open seleniumframework website
Then I set explicit wait block on on alert present
Scenario: Fluent Wait demonstration
When I open seleniumframework website
Then I wait until I find five periodicElements

step_definitions/Waits.java

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
package step_definitions;
import java.util.List;
import java.util.concurrent.TimeUnit;
import org.openqa.selenium.Alert;
import org.openqa.selenium.By;
import org.openqa.selenium.JavascriptExecutor;
import org.openqa.selenium.NoSuchElementException;
import org.openqa.selenium.StaleElementReferenceException;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.WebDriver.Timeouts;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.chrome.ChromeDriver;
import org.openqa.selenium.support.ui.ExpectedConditions;
import org.openqa.selenium.support.ui.FluentWait;
import org.openqa.selenium.support.ui.WebDriverWait;
import com.google.common.base.Function;
import cucumber.api.java.en.Then;
import cucumber.api.java.en.When;
public class Waits {
public WebDriver driver;
public Waits()
{
driver = Hooks.driver;
}
@When(“^I open seleniumframework website$”)
public void i_open_seleniumframework_website() throws Throwable {
driver.get(“http://www.seleniumframework.com/Practiceform/”);
}
@When(“^I set pageload timeout$”)
public void i_set_pageload_timeout() throws Throwable {
Timeouts timeouts = driver.manage().timeouts();
//Here we look at pageloadTimeout. By default pageload is infinite
timeouts.pageLoadTimeout(10, TimeUnit.SECONDS);
// System.out.println(driver.getPageSource());
WebElement targetElement = driver.findElement(By.id(“periodicElement”));
System.out.println(targetElement.getText());
}
@When(“^I set implicit timeout$”)
public void i_set_implicit_timeout() throws Throwable {
Timeouts timeouts = driver.manage().timeouts();
//Implict waits apply to all Webelements i.e. once you set implictWait , driver would wait
// for that amount of max time on every element before throwing WaitTimeout Exception
// DO NOT mix up Implict and Explicit Timeouts
timeouts.implicitlyWait(5, TimeUnit.SECONDS);
}
@Then(“^I print the text for target element$”)
public void i_print_the_text_for_target_element() throws Throwable {
WebElement targetElement = driver.findElement(By.id(“periodicElement”));
System.out.println(targetElement.getText());
}
@When(“^I set script timeout$”)
public void i_set_script_timeout() throws Throwable {
Timeouts timeouts = driver.manage().timeouts();
//Script waits apply to Javascript executor , driver would wait
// for that amount of max time for the script to complete execution throwing WaitTimeout Exception
timeouts.setScriptTimeout(5, TimeUnit.SECONDS);
JavascriptExecutor js = (JavascriptExecutor)driver;
System.out.println(js.executeScript(“return window.onload=’myFunction()’;”));
}
@Then(“^I set explicit wait block on target element until it becomes clickable$”)
public void i_set_explicit_wait_block_on_target_element_using_exists() throws Throwable {
Timeouts timeouts = driver.manage().timeouts();
timeouts.implicitlyWait(5, TimeUnit.SECONDS);
//First create a WebDriverWait object and pass the driver and timeout as arguments
WebDriverWait waiter = new WebDriverWait(driver, 5);
//Specify the expectedcondition to become true until the timeout defined by wait.
// If condition becomes true before timeout, the the WebElement is returned
// If condition is not true, it results in TimeoutException
WebElement element = waiter.until(ExpectedConditions.elementToBeClickable(By.id(“periodicElement”)));
System.out.println(“Expected condition found this element with HTML” + element.getAttribute(“outerHTML”));
}
@Then(“^I set explicit wait block on on alert present$”)
public void i_set_explicit_wait_block_on_on_alert_present() throws Throwable {
WebDriverWait waiter1 = new WebDriverWait(driver, 6);
driver.findElement(By.id(“timingAlert”)).click();
Alert alert = waiter1.until(ExpectedConditions.alertIsPresent());
Thread.sleep(4000);
System.out.println(“Found alert”);
alert.accept();
}
@Then(“^I wait until I find five periodicElements$”)
public void i_wait_until_I_find_five_periodicElements() throws Throwable {
// Write code here that turns the phrase above into concrete actions
FluentWait<ChromeDriver> wait = new FluentWait<ChromeDriver>((ChromeDriver) driver);
wait.withTimeout(30, TimeUnit.SECONDS);
wait.pollingEvery(2, TimeUnit.SECONDS);
wait.ignoring(NoSuchElementException.class);
wait.ignoring(StaleElementReferenceException.class);
List<WebElement> periodicElements = wait.until(new Function<ChromeDriver, List<WebElement>>()
{
public List<WebElement> apply(ChromeDriver driver) {
List<WebElement> elements = driver.findElements(By.id(“periodicElement”));
int length = elements.size();
System.out.println(“current Length is”+length);
if(length==5)
{
System.out.println(“Target Length is hit”+length);
return elements;
}
return null;
}
});
}
}

Execution Output

IntelliJ Output (How to execute is explained in previous post)

class4_intellij_output

Eclipse output

If we execute it using cucumber eclipse plugin

class4_eclipse_output

 

Command line output (mvn test)

class5_cmd_output

CI Server

class5_ci_output

class5_ci_output1