Cross browser testing

Cross Browser Testing is a type of functional test which is used for checking the outlook or functionality of our web application on different browsers. Most of the time we might have observed that for the same web URL, a website running on one browser looks different from that the other. Following are a few reasons that require cross-browser testing:

  1. The different browser has different page alignment.
  2. Image orientation may vary on different browsers.
  3. JavaScript behavior might  be different on different web browsers.
  4. CSS and HTML tags may behave in a different manner.
  5. Some browsers do not support few of the HTML 5 tags.
  6. Other incompatible features, etc.

Cross Browser Testing using Selenium TestNG
To execute test cases on different browsers at the same time we use the Testng framework with Selenium WebDriver. TestNG provides us functionality to perform same test on different browsers in a simple way.

Below is the testng.xml look like:

<!DOCTYPE suite SYSTEM "http://testng.org/testng-1.0.dtd" >

<suite name="Test Suite" thread-count="2" parallel="tests">
  <test name="FirefoxTest">
    <parameter name="browser" value="firefox"/>
      <classes>
        <class name="seleniumAdvanceTopics.CrossBrowserTest" />
      </classes>
  </test>
  <test name="ChromeTest">
    <parameter name="browser" value="chrome"/>
      <classes>
        <class name="seleniumAdvanceTopics.CrossBrowserTest" />
      </classes>
  </test>
</suite>

As per this testng.xml, test cases will execute two times on two different browsers. First Test will pass the value of parameter ‘browser’ as ‘firefox’ so FirefoxDriver will be executed. This test case will run on Firefox browser. Second Test will pass the value of parameter ‘browser’ as ‘chrome’ so ChromeDriver will be executed. This test case will run on Chrome browser.

Now create the test script using parameter annotation such as:

package seleniumAdvanceTopics;

import org.openqa.selenium.WebDriver;
import org.openqa.selenium.chrome.ChromeDriver;
import org.openqa.selenium.firefox.FirefoxDriver;
import org.testng.Assert;
import org.testng.annotations.BeforeTest;
import org.testng.annotations.Parameters;
import org.testng.annotations.Test;

public class CrossBrowserTest {

  private WebDriver driver;
  @BeforeTest
  @Parameters("browser")
  public void setUp(String browser) {
    if(browser.equalsIgnoreCase("firefox")) {
      driver = new FirefoxDriver();
    }
    else if(browser.equalsIgnoreCase("chrome")) {
      System.setProperty("webdriver.chrome.driver", "E:\\chromedriver.exe");
      driver = new ChromeDriver();
    }
  }

  @Test
  public void crossBrowserTest() {
    driver.get("http://hugelearning.com/");
    System.out.println("Page title" + driver.getTitle());
    Assert.assertEquals(driver.getTitle(), "HomePage - Huge Learning");
    driver.close();
  }
}

Now we need to execute the xml. Run the test by right click on the testng.xml file and select Run As > TestNG Suite.