Cross Browser Testing using Selenium GRID
One of the challenges that we face while testing the application is testing it on different browsers and environments. We all might have observed that some websites are not properly displayed on some browsers and we just think that the website is broken. But, as soon as you open it on a different browser, the website opens up just fine. Thus, this behavior explains the compatibility of a website with different browsers.
- Kiran HS, CoffeeBeans
Each browser interprets the information on the website page differently, so, some browsers may lack the features that your website is trying to show and make your website look broken on that browser.
That being the brief story, I bet you all have figured out the topic of today’s discussion — Cross Browser Testing. So what is cross browser testing?
Cross browser testing is a type of testing that lets you check whether the websites are working as intended when accessed through
- Different Browser — OS combination
- Browsers like — Chrome, Firefox, Safari, Edge, etc
- Operating Systems like — Windows, Linux, MAC, etc
It’s about shipping releases that are as browser-agnostic as possible, which is key to delivering a uniform user experience on a diverse, ever-growing range of browsers/devices.
As a tester, it is your responsibility to make sure that not only do applications work, but they work for all your users, no matter what browser, device, or additional assistive tools they are using. Now comes the next question -
Why cross browser testing?
- To check how the website appears on different browsers
- To check how the website works on different browsers ( quite obvious )
- To ensure that you’re not alienating a significant part of your target audience–simply because your website does not work on their browser OS.
The next question which comes to mind is -
How to perform cross browser testing?
This can be done in two (obvious) ways
- Manual Approach (Manually check the functionality on different browsers and platforms, painful process to follow)
- Automation Approach (Write one piece of code and run it on different browsers and platform combinations — sounds cool and easy right?)
That being said, let’s dive into the automation approach and see how this can be achieved with Selenium, Selenium GRID, and TestNG
Firstly, you will need to set up a selenium grid to run the tests on different browsers and platforms. For this, you will need a selenium server standalone jar which can be found in the given link — Selenium Server Standalone Jar
Once you have downloaded the jar file, you need to set up the hub and node based on the requirement. For the demonstration purpose, I will create 1 hub and 2 nodes. 1 of the nodes will run firefox as browser-related test cases. The other node will run chrome-related test cases.
Let’s start by creating a hub.
The command to create a node is as follows
java -jar selenium-server-standalone-3.141.59.jar -role hub
Below is the screenshot of the hub looks when it is up and running
Once you have created a hub and have obtained the hub register URL, let’s register a node with chrome browser-related configurations. This can be done in two ways,
- By passing the arguments in the command line
- By creating a JSON file with the required configurations.
I will be creating both nodes by passing the arguments from the command line. The configuration goes as follows for creating a node with chrome browser configuration
java -Dwebdriver.chrome.driver=”/Users/macbook/Downloads/chromedriver” -jar selenium-server-standalone-3.141.59.jar -role node -hub http://localhost:4444/grid/register
Below is the screenshot of it looks when it is registered
Once you have registered that node, let’s register another node with firefox browser configurations. The command to do so is as follows
java -Dwebdriver.gecko.driver=”/Users/macbook/Downloads/geckodriver” -jar selenium-server-standalone-3.141.59.jar -role node -hub http://localhost:4444/grid/register
Below is the screenshot of it looks when it is registered
Once both the nodes are registered it can be verified by navigating to the grid console. The same can also be verified on the hub console
Hub Console
Grid console URL is as follows — GRID Console
After you have registered both nodes, get the hub URL and append wd/hub at the end. We will use this URL to route the test cases to specific nodes as configured.
Hub Url — Hub URL
Now let's create a maven project and testng.xml file so that we can run the tests parallelly.
Let’s add the selenium and testng dependency
The next step is to initialize the browser’s drivers based on the requirement. chrome driver if chrome browser is required, firefox driver if firefox browser is required.
Let’s write some basic test cases that are going to print the browser title from both the browsers
Now let's run the test cases parallelly and see if the configurations are working
Command to run the test — mvn clean test
Viola, one single test can now be run on 2 different browsers parallelly. Refer to the console for execution results
For now, the platform in which I am running the test cases is MAC, this can be changed when a different platform is configured like Windows, Linux, etc. TestNG file to run the test cases parallelly is as below.
In the same way, safari and edge can also be configured to run the test cases. It depends on the requirement of how many browsers and platforms need to be covered.
That’s all folks, for now, see you guys in the next exciting blog.
Thank you !!
