Know How to Perform Cross Browser Testing Using Selenium

Cross Browser Testing using Selenium — Edureka

With the increasing demand for automation testing, Selenium is one such tool which perfectly fits for Cross Browser Testing of a website. It is very necessary to check the compatibility and performance of the websites on different browsers and operating systems. So, this article on Cross Browser testing using Selenium will help you understand these concepts in depth.

Below are the topics covered in this article:

• What is Cross Browser Testing?
• Why do you need Cross Browser testing?
• How to perform Cross Browser testing?
• Demo using Selenium

What is Cross Browser Testing?

Cross-browser testing is nothing but testing the application in multiple browsers like IE, Chrome, Firefox so that we can test our application effectively. Cross-browser compatibility is the ability of a website or web application to function across different browsers and operating systems.

For Example — Say you have 20 test cases to execute manually. You can complete this task in a day or two. But, if the same test cases have to be executed in five browsers, then probably you will take a week to complete it. However, if you automate these 20 test cases and run them, then it will not take more than an hour or two depending on the test case complexity. So that’s where cross-browser testing comes into the picture.

Now, let’s move further and see why do you need Cross Browser Testing in Selenium.

Why do you need Cross Browser Testing?

Every website is comprised of three major technologies i.e. HTML5, CSS3, and JavaScript. However, there are n number of technologies in the backend like Python, Ruby, etc can be used. But, in the front end and in the rendering, only these three technologies are used.

Also, each browser uses a completely different rendering engine to compute these three technologies. For example, Chrome uses Blink, Firefox uses Gecko and IE uses edge HTML and Chakra, because of which the same website would be rendered completely differently by all these different browsers. And that’s exactly why you need cross-browser testing. That means the website should work perfectly fine, in all the different browser versions and in different operating systems. So to ensure that it works fine, cross-browser testing is required.

Along with that, I have listed a few reasons that depict the need for Cross Browser Testing.

• Browser compatibility with different OS.
• Image orientation.
• Each browser has a different orientation of Javascript which can cause issue sometimes.
• Font size mismatch or not rendered properly.
• Compatibility with the new web framework.

Now let’s move further and understand how to perform Cross Browser Testing.

How to Perform Cross Browser Testing?

Cross-browser testing is basically running the same set of test cases multiple times on different browsers. This type of repeated task is best suited for automation. Thus, it’s more cost and time effective to perform this testing by using tools. Now let’s see how it is performed using selenium web driver.

Step1: If we are using Selenium WebDriver, we can automate test cases using Internet Explorer, FireFox, Chrome, Safari browsers.

Step 2: To execute test cases with different browsers in the same machine at the same time we can integrate the TestNG framework with Selenium WebDriver.

Step3: Finally, you can write the test cases and execute the code.

Now, let’s see how to perform cross-browser testing of Edureka website on three different browsers

Demo using Selenium WebDriver

package co.edureka.pages;
 
import java.util.concurrent.TimeUnit;
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.edge.EdgeDriver;
import org.openqa.selenium.firefox.FirefoxDriver;
import org.testng.annotations.BeforeTest;
import org.testng.annotations.Parameters;
import org.testng.annotations.Test;
 
public class CrossBrowserScript {
 
WebDriver driver;
 
/**
* This function will execute before each Test tag in testng.xml
* @param browser
* @throws Exception
*/
@BeforeTest
@Parameters("browser")
public void setup(String browser) throws Exception{
//Check if parameter passed from TestNG is 'firefox'
if(browser.equalsIgnoreCase("firefox")){
//create firefox instance
System.setProperty("webdriver.gecko.driver", "C:\\geckodriver-v0.23.0-win64\\geckodriver.exe");
driver = new FirefoxDriver();
}
 
//Check if parameter passed as 'chrome'
else if(browser.equalsIgnoreCase("chrome")){
//set path to chromedriver.exe
System.setProperty("webdriver.chrome.driver", "C:\\Selenium-java-edureka\\New folder\\chromedriver.exe");
driver = new ChromeDriver();
 
}
else if(browser.equalsIgnoreCase("Edge")){
//set path to Edge.exe
System.setProperty("webdriver.edge.driver","C:\\Selenium-java-edureka\\MicrosoftWebDriver.exe");;span style="font-family: verdana, geneva, sans-serif; font-size: 14px;">//create Edge instance</span>
driver = new EdgeDriver();
}
else{
//If no browser passed throw exception
throw new Exception("Browser is not correct");
}
driver.manage().timeouts().implicitlyWait(10, TimeUnit.SECONDS);
}
 
@Test
public void testParameterWithXML() throws InterruptedException{
driver.get("https://www.edureka.co/");
WebElement Login = driver.findElement(By.linkText("Log In"));
//Hit login button
Login.click();
Thread.sleep(4000);
WebElement userName = driver.findElement(By.id("si_popup_email"));
//Fill user name
userName.sendKeys("your email id");
Thread.sleep(4000);
//Find password'WebElement password = driver.findElement(By.id("si_popup_passwd"));
//Fill password
password.sendKeys("your password");
Thread.sleep(6000);
 
WebElement Next = driver.findElement(By.xpath("//button[@class='clik_btn_log btn-block']"));
//Hit search button
Next.click();
Thread.sleep(4000);
WebElement search = driver.findElement(By.cssSelector("#search-inp"));
//Fill search box
search.sendKeys("Selenium");
Thread.sleep(4000);
//Hit search button
 
WebElement searchbtn = driver.findElement(By.xpath("//span[@class='typeahead__button']"));
searchbtn.click();
}
}

In the above code, I am performing actions on Edureka website like logging in to the website and searching for Selenium course. but, I want to check the cross-browser compatibility on three different browsers i.e Google Chrome, Mozilla Firefox, and Microsoft Edge. That’s why I have set the system properties of all the 3 browsers in my code. After that using locators I am performing actions on the website. So this is all about my class file. Now in order to execute the program, you need a TestNG XML file which contains the dependencies of the above class file. Below code depicts the TestNG file.

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE suite SYSTEM "http://testng.org/testng-1.0.dtd">
<suite name="TestSuite" thread-count="2" parallel="tests" >
<test name="ChromeTest">
<parameter name="browser" value="Chrome"/>
<classes>
<class name="co.edureka.pages.CrossBrowserScript">
</class>
</classes>
</test>
<test name="FirefoxTest">
<parameter name="browser" value="Firefox" />
<classes>
<class name="co.edureka.pages.CrossBrowserScript">
</class>
</classes>
</test>
<test name="EdgeTest">
<parameter name="browser" value="Edge" />
<classes>
<class name="co.edureka.pages.CrossBrowserScript">
</class>
</classes>
</test>
</suite>

In the above XML file, I am specifying different classes for the drives so that it will help us in instantiating the browsers to execute the test cases on the website. That’s how it works.

With this, we come to an end of this article on Cross Browser Testing using Selenium Webdriver. I hope you understood the concepts and it added value to your knowledge.

If you wish to check out more articles on the market’s most trending technologies like Artificial Intelligence, DevOps, Ethical Hacking, then you can refer to Edureka’s official site.

Do look out for other articles in this series which will explain the various other aspects of Selenium.

1. Selenium Tutorial

2. Selenium WebDriver: TestNG For Test Case Management & Report Generation

3. Building A Data Driven, Keyword Driven & Hybrid Selenium Framework

4. Locators in Selenium

5. XPath Tutorial

6. Waits in Selenium

7. Setting up a Selenium Grid for distributed Selenium testing

8. Selenium Using Python

9. Cross Browser Testing Using LambdaTest

10. Handle Multiple Windows in Selenium

11. Page Object Model In Selenium

12. Selenium Projects

13. QTP vs Selenium

14. Selenium vs RPA

15. Selenium WebDriver Architecture

16. Handling Exceptions In Selenium

17. Perform Website Testing Using Cucumber & Selenium

Originally published at https://www.edureka.co on April 30, 2019.