How to develop your first Selenium WebDriver Test Automation Script
Firstly, if you are planning to Move From Manual to Automation Testing, you should have excellent Manual Testing Skills. Secondly, you should appreciate the fact that Automation Testing is progressively replacing Manual Testing in many ways. Most importantly, you need determination to get hands-on with various technicalities. So let's look at how to establish technical know-how through setting up essential test automation components. Further you will learn how to develop your first Selenium WebDriver Test Automation Script!
Let's Automate a Manual Test Case
Manual Test Case Design
Let's build a simple manual test case before we can automate it.
Web Application: Netflix
Test Scenario: Verify that when a user clicks "Try it Now" button without entering a valid email address, an appropriate warning message is prompted.
Test Case:
1. Open a browser
2. Navigate to the website
3. Click "Try it Now" button. Expected result: an appropriate warning message is prompted.
4. Close the browser
Now, let's look at how to translate this manual test case into an automated script using Selenium WebDriver. Read on..
What is Selenium?
Selenium is an open source software / a framework for testing web applications.
As per Selenium Dev, "Selenium automates browsers. That's it! What you do with that power is entirely up to you." So, it’s up to us to make the best out of Selenium. Many companies in the world have adopted Selenium for their browser-based testing as Selenium supports multiple browsers such as Firefox, Chrome, IE, Safari etc.
Selenium is a suite of automation tools. It comprises of Selenium IDE, Selenium RC, Selenium Webdriver, and Selenium Grid. Selenium RC is officially deprecated.
1. Selenium IDE – is a Chrome and Firefox add-on. This will do simple record-and-playback of user interactions with the browsers.
2. Selenium WebDriver – used to create robust, browser-based regression automation tests.
3. Selenium Grid – is used for distributing and running tests on several machines from a central point. Hence making it easy to run the tests in parallel against various combination of browsers & OS.
Selenium WebDriver is extensively used in the Testing Industry. Thus, we will particularly focus on it to develop your first Selenium WebDriver Test Automation Script.
Apparently, Selenium HQ is now rebranded as Selenium Dev. Find the Selenium documentation here.
How does Selenium Webdriver work internally?
Before we look into "What do you need before automating a Test Script?" from a test automation environment set-up perspective and even before we crack on with "how to develop your first Selenium WebDriver Test Automation Script", let's quickly look into the mechanics of Selenium WebDriver.
There are 3 key components essentially as part of the overall WebDriver architecture. You could download the 3 Bs - Browsers, Binaries and Bindings from the links below.
1. Browsers - Chrome, Firefox, IE
2. Binaries – exe (Chrome, Gecko, IE)
3. Bindings library - JAR
And we would need a Testing framework like Junit or TestNG to run the auto script.
When an automated test script is executed using Selenium WebDriver, the following actions are accomplished internally.
- For each Selenium command, WebDriver bindings generate an HTTP request
- The request is sent to the binaries that is the browser driver through HTTP server.
- HTTP Server performs actions on the browser.
- Browser responds with an execution status which is sent back to HTTP Server which is subsequently sent back to Selenium WebDriver.
Selenium WebDriver Architecture:
Selenium WebDriver accepts commands (sent via a Client API) and sends them to a browser.
This is implemented through a browser-specific browser driver, which sends commands to a browser and retrieves results. Most browser drivers actually launch and access a browser application (such as Firefox, Google Chrome, Internet Explorer, etc).
So, the communication is two way: WebDriver passes commands to the browser through the driver, and receives information back via the same route.
Technically, WebDriver uses JSON as a medium to communicate between client bindings libraries (Java, C# and so on) and binaries (Firefox Driver, Chrome Driver & IE Driver).
How to set up Selenium WebDriver components
Guidelines for setting up Selenium WebDriver components - drivers for various browsers.
Based on the video below -
- Include the language bindings libraries for JAVA.
- Install Chrome browser (if you do not have it on your PC)
- In addition, include WebDriver binary for Chrome browser we want to automate and run test on.
What do you need before automating a Test Script?
An IDE
First and foremost, you will have to setup Eclipse IDE. Watch the video below covered as part of Java setup and follow the instructions.
A Programming Language
Secondly, the key component required for test automation is a programming language, such as, Java, Python, C#, JavaScript, etc.
Java is the most common programming language used for test automation. Also, given that Java is free and open source, let's use Java to develop your first Selenium WebDriver Test Automation Script.
Setup Java/JDK
Set up JDK and configure Java by following the instructions in the video.
Learn the essential Fundamentals of Java for Test Automation, before moving onto the next component.
Setup Selenium WebDriver
- Include the language bindings libraries for JAVA.
- Install Chrome browser
- In addition, include WebDriver binaries for the Chrome browser we want to automate and run test on.
The above pointers are explained in detail in the subsequent sections, read on..
Testing Framework
Configure a test framework - TestNG or Junit. This is necessary for running automated tests, covered in detail in "How to run Selenium Automation test script?" section.
Set up TestNG testing framework by following the Instructions in the video. This covers - Installation of TestNG framework as a Plugin (on Eclipse), running TestNG Tests, TestNG Test Suite and Build.xml for TestNG. Besides, although not required for this exercise, this also covers Running TestNG Test using Ant and generation of Reports.
Setup Maven
Maven is a build automation tool used primarily for Java projects. We will use this for project and dependencies management.
Set up Maven with TestNG testing framework based on the video. This includes Creation of Maven Project, Maven Dependencies (for TestNG & Selenium), MVN Repository. Additionally, although not required for this exercise, video explains as how to run Maven tests using TestNG framework.
How to create a project for Selenium Automation
You can create a Maven project for Selenium Automation Testing using Eclipse IDE. This was explained earlier as part of Maven setup.
Installation of Selenium libraries for Java can be done using Maven. Add the selenium-java dependency in your project pom.xml and save the file. Likewise for TestNG dependency. JARs would be downloaded to the repository.
Your POM xml file should include the Maven dependencies like so -
(Note: at the time of creating this blog, stable version for Selenium WebDriver was 3.11.0)
How to Develop a basic Selenium Automation Test Script?
So we had built a simple manual test case before.
Web Application: Netflix
Test Scenario: Verify that when a user clicks "Try it Now" button without entering a valid email address, an appropriate warning message is prompted.
Test Case:
1. Open a browser
2. Navigate to the website
3. Click "Try it Now" button. Expected result: an appropriate warning message is prompted.
4. Close the browser
Let's translate this manual test case into an automated script using Selenium WebDriver commands. Most of the commands used in Selenium WebDriver are easy to implement.
Launch a browser:
Once the project has been created in Eclipse IDE, create a new Java class.
Include this line of code in order to set the Path to the executable binary.
System.setProperty("webdriver.chrome.driver", ".\\driver\\Chromdriver.exe");
Then, use the following WebDriver command
WebDriver driver = new ChromeDriver();
So this would launch Chrome browser as per the mechanics explained earlier!
Navigate to a website:
WebDriver Interface is the main interface to use for testing, which represents an idealised web browser. The methods in this interface fall into these key categories:
Control of the browser itself
Selection of WebElements
Copy this line of code to navigate to the website.
driver.get(“https://www.netflix.com/”);
And the follolwing sets the amount of time to wait for a page load to complete before throwing an error.
driver.manage().timeouts().pageLoadTimeout(5, TimeUnit.SECONDS);
And finally once the test has been run, we have to close the browser.
driver.close();
So these commands are sent across as HTTP requests to the binaries (drivers) and in turn the commands are fired across to the actual browser. HTTP verbs are used – POST, GET, etc. The WebDriver protocol is organised into commands. Each HTTP request with a method and template defined in this specification represents a single command, and therefore each command produces a single HTTP response.
Apparently, from the above test case, we have automated 3 test steps 1, 2 and 4. So, how do we automate Step 3? Read on..
Interact with the Web Elements:
Firstly, we will have to interact with web elements like button, link, etc. We shall use WebElement Interface, in order to perform an action on any web element. For example, click a button or a link, enter data into a test box, select a value from a drop down list, so on.
WebElement – is an interface and it represents an HTML element. Generally, all operations to do with interacting with a page will be performed through this interface. We can use findElement method to Find the first WebElement and returns first matching element.
Locators - There are various locators, we will use xpath as the locator strategy.
In layman terms, this represent the address of a WebElement.
For example, 'Try It Now' button on Netflix homepage is represented as follows
//*[text()='TRY IT NOW'])[1]
As we would like to verify that the warning message is shown to the user if the user hits try it bow button without entering email address, we need a locator for this Web element too.
Xpath for this element is -
//*[@class='inputError']
Waits
Selenium is superfast while executing the commands, we should instruct it to slow down a bit, until an element on a page has loaded completely. And to achieve this, we will go for WebDriverWait.
WebDriverWait – another interface extensively used to avoid intermittent issues that arise from use of Selenium and WebDriver are connected to race conditions that occur between the browser and the user’s instructions.
WebDriverWait(WebDriver driver, long timeOutInSeconds)
Parameters:
driver - The WebDriver instance to pass to the expected conditions
timeOutInSeconds - The timeout in seconds when an expectation is called
Explicit waits are available to Selenium clients which will allow our code to halt program execution, until the condition you pass it resolves. The condition is called with a certain frequency until the timeout of the wait is elapsed. This means that for as long as the condition returns a false value, it will keep trying and waiting.
WebDriverWait wait = new WebDriverWait(driver, 10); WebElement element = wait .until(ExpectedConditions.elementToBeClickable(By.xpath("(//*[text()='TRY IT NOW'])[1]")));
In this case we will wait until the 'Try it now' button is clickable, before actually clicking it - hence avoiding intermittent "NoSuchElementException" issue. Refer 'Handling Exceptions' section below for more details.
Now can click the Try it now' button, like so -
element.click();
Assertions
Use TestNG for including Assertions – they are basically validations in manual testing world – comparing expected and actual, or checking a condition is true/false.
In this exaple, we could check if the web element for 'warning message' is displayed or not on the web page as part of the automated script.
isDisplayed() method - checks if the element is displayed or not.
Returns: boolean - whether or not the element is displayed.
boolean displayed = driver.findElement(By.xpath("//*[@class='inputError']")).isDisplayed(); Assert.assertTrue(displayed, "Not displayed");
Test would pass if the element is displayed, if not the test fails.
Using Assertions, you can compare the expected and actual warning text message too.
Handling Exceptions
What is an Exception?
Exceptions are events due to which java program ends abruptly without giving expected output. Java provides a framework where a user can handle exceptions.
These are some of the common Selenium WebDriver exceptions encountered while automating a test:
NoSuchElementException - Thrown when element could not be found. Possble causes: Check your selector used; Element may not yet be on the screen at the time of the find operation, (webpage is still loading)
StaleElementReferenceException - Thrown when a reference to an element is now “stale”. Possible cause: You are no longer on the same page, or the page may have refreshed since the element was located
TimeoutException - Thrown when a command does not complete in enough time. Possible cause: Website performance. Sometimes the web page might not load completely before the next command is perfofmed as per test script. If WebDriver tries to find an element in the webpage before the page completely loads, then exception NoSuchElementException is thrown. To avoid this exception, Waits (as discussed before) commands are included. However, if the element do not load even after the wait, TimeoutException exception is thrown. To avoid this, we could manually check the average time for a page to load and adjust the wait. That said, JavaScriptExecutor is an efficient solution - where we could check the document.readyState is 'complete', meaning the webpage has completely loaded, before interacting with webelements.
The process of handling the exceptions is called as Exception Handling.
Try-catch: Use a combination of try and catch keywords inside a test method. Try indicates the start of the block, and Catch is placed at the end of the try block to handle the exception. The following code represents the syntax of Try/Catch block –
try { // Some code } catch(Exception e) { // Code for Handling the exception }
For our Test case,
@Test public void testWarningMessageDisplayed() { try { // Get to URL driver.get("https://www.netflix.com/"); driver.manage().timeouts().pageLoadTimeout(5, TimeUnit.SECONDS); WebDriverWait wait = new WebDriverWait(driver, 10); WebElement tryNowButton = wait .until(ExpectedConditions.elementToBeClickable(By.xpath("(//*[text()='TRY IT NOW'])[1]"))); // Click the Try it now button tryNowButton.click(); Thread.sleep(2000L); // Validate warning message is displayed boolean displayed = driver.findElement(By.xpath("//*[@class='inputError']")).isDisplayed(); Assert.assertTrue(displayed, "Not displayed"); System.out.println("Test passed"); } catch (Exception e) { System.out.println("Test failed"); Assert.fail(e.getMessage()); } }
How to run Selenium Automation test script?
Finally, you have developed your first Selenium WebDriver Test Automation Script!
There are many ways of running a Selenium auto script:
1. Using Eclipse IDE with the help of a Testing framework like TestNG, Junit .
2. Via command line
3. Using a Build tool like Maven
4. Through Jenkins
5. Headless as well – that is without opening the browser
We would use the first method for this test case execution - TestNG which is a Testing framework used for running automated tests.
Install TestNG plugin for Eclipse.
TestNG Annotations
Are tags that can be added to code and gives information about test methods and methods going to run before & after test methods
@BeforeTest – causes a method to be run before each Test method.
@Test – causes a method to be run as a test case.
@AfterTest – causes a method to be run after the Test method.
public class TestNGTest { @BeforeTest public void beforeTest() { } @Test public void test() { } @AfterTest public void afterTest() { } }
TestNG Assertions
Are used for validation purpose as used in our test case before.
Assert.assertTrue(condition); Assert.assertEquals(expected, actual); Assert.fail(message);
Our Manual Test Case completely transformed into Test Automation Script (using Selenium WebDriver, Java & TestNG), looks so -
import org.openqa.selenium.By; import org.openqa.selenium.WebDriver; import org.openqa.selenium.WebElement; import org.openqa.selenium.chrome.ChromeDriver; import org.openqa.selenium.support.ui.ExpectedConditions; import org.openqa.selenium.support.ui.WebDriverWait; import org.testng.Assert; import org.testng.annotations.AfterTest; import org.testng.annotations.BeforeTest; import org.testng.annotations.Test; public class Netflix { WebDriver driver; @BeforeTest public void beforeTest() throws IOException { System.setProperty("webdriver.chrome.driver", ".\\driver\\Chromedriver.exe"); driver = new ChromeDriver(); } @Test public void testWarningMessageDisplayed() { try { // Get to URL driver.get("https://www.netflix.com/"); driver.manage().timeouts().pageLoadTimeout(5, TimeUnit.SECONDS); WebDriverWait wait = new WebDriverWait(driver, 10); WebElement tryNowButton = wait .until(ExpectedConditions.elementToBeClickable(By.xpath("(//*[text()='TRY IT NOW'])[1]"))); // Click the Try it now button tryNowButton.click(); Thread.sleep(2000L); // Validate warning message is displayed boolean displayed = driver.findElement(By.xpath("//*[@class='inputError']")).isDisplayed(); Assert.assertTrue(displayed, "Not displayed"); System.out.println("Test passed"); } catch (Exception e) { System.out.println("Test failed"); Assert.fail(e.getMessage()); } } @AfterTest public void afterTest() { driver.close(); } }
Run this test script within Eclipse IDE using TestNG plugin for eclipse.
Right click on the Java class (within Eclipse IDE), and from the context menu, select Run As > TestNG Test option.
Test Result on the Eclipse Console:
[TestNG] Running: C:\Users\\AppData\Local\Temp\testng-eclipse-1487057191\testng-customsuite.xml Starting ChromeDriver 79.0.3945.36 (3582db32b33893869b8c1339e8f4d9ed1816f143-refs/branch-heads/[email protected]{#614}) on port 39897 Only local connections are allowed. Please protect ports used by ChromeDriver and related test frameworks to prevent access by malicious code. org.openqa.selenium.remote.ProtocolHandshake createSession INFO: Detected dialect: W3C Test passed PASSED: testWarningMessageDisplayed =============================================== Default test Tests run: 1, Failures: 0, Skips: 0 ===============================================
What are Test Automation Frameworks?
In real world, the fundamental idea behind developing an individual test case is the same as explained before. However, the test automation scripts are organised and built within a formal Test Automation Framework. This gives us a Platform for test case development, execution and reporting. Test Automation frameworks helps accomplish: code reusability, maximise test coverage and reduce maintenance cost, to name a few.
We will use various design patterns and Test Automation Frameworks in real world like:
- Page object models based Framework
- Behaviour Driven Development Framework. Refer our blog How to develop your first Cucumber BDD and Selenium Automation Script
- Data driven and keywords driven framework
The above Test Automation Frameworks are covered extensively in our project-based, hands-on Automation Testing Training and Software Testing Internship.
You may also like
Firstly, if you are planning to Move From Manual to Automation Testing, you should have excellent Manual Testing Skills. Secondly, you should appreciate the fact that Automation Testing is progressively replacing Manual Testing in many ways. Most importantly, you need …
Java Basics For Test Automation
Java & Eclipse IDE This video refers to guidelines for setting up Java (JDK/JRE) & Eclipse IDE; configuration of Java using properties & command line. We shall employ Java as code base for Selenium WebDriver & Cucumber BDD Test automation. …