How to Create a Cross Browser Compatible Test Automation Framework

In this tutorial we’ll be learning about the first step in Designing the architecture of a Selenium test automation framework with C# and NUnit: developing the ability for cross browser testing on IE, Chrome and Firefox. Meaning, the engineer or developer would decide on the type of the browser to perform the tests on by changing one parameter in the .appconfig file.

---

Tutorial Overview:

Class 1 – Creating an Automated Test Using Selenium WebDriver 3 and C#

• Setting Up the Development Environment for Your Selenium Automation Framework
• How to Inspect Web Elements & Methods to Locate Them with Chrome Devtools
• How to Find Web Elements with Selenium WebDriver

Class 2 – How to Create a Test Automation Framework Architecture with Selenium WebDriver 3

• You’re here→How to Create a Cross Browser Compatible Testing Framework
• Steps to Develop a Report Module in a Testing Framework
• Implementing a Report Module in an Automated Framework
• How to Write a Functional Test with a Basic Selenium Automation Framework

Class 3 – Utilizing Test Automation Framework with Advanced Capabilities

• Page Object Pattern: Advantages & Implementation ​
• Read Data From CSV File in C#
• How to Create a Test Suite in Selenium WebDriver and C#
• How to Use Data Driven with Selenium Test Suite

---

Reasons why it’s important for the automation framework to perform cross browser testing:

1. When executing tests, it is crucial to create a cover to each of the browsers the product is compatible with.
2. In some cases, bugs occur in specific browsers.
3. Easier code maintenance

In order to mitigate the code maintenance, we’ll create a class responsible for our browsers: ‘Browsers’.

Paste the following code:

public class Browsers
{
    private static IWebDriver webDriver;
    private static string baseURL = ConfigurationManager.AppSettings["url"];
    private static string browser = ConfigurationManager.AppSettings["browser"];

    public static void Init()
    {
         switch (browser)
         {
             case "Chrome":
                 webDriver = new ChromeDriver();
              break;
             case "IE":
                 webDriver = new InternetExplorerDriver();
             break;
             case "Firefox":
                 webDriver = new FirefoxDriver();
             break;
         }
         webDriver.Manage().Window.Maximize();
         Goto(baseURL);
    }
    public static string Title
    {
         get { return webDriver.Title; }
    }
    public static IWebDriver getDriver
    {
         get { return webDriver; }
    }

    public static void Goto(string url)
    {
         webDriver.Url = url;
    }
    public static void Close()
    {
         webDriver.Quit();
    }
}

Class description:

First, we’ll create the relevant variables for the class. In our case, we’ll be creating:

1. An object that holds our driver
2. A variable that will return the url we are reaching
3. A variable that will hold the name of the specified browser

Notice the values of the url and the browser will be saved in the app.config file.

private static IWebDriver webDriver;
private static string baseURL = ConfigurationManager.AppSettings["url"];
private static string browser = ConfigurationManager.AppSettings["browser"];

Function description:

Init – In the starting point, it creates an instance of the specified browser. In order to determine which browser to work with we’ll utilize switch.

The command: webDriver.Manage().Window.Maximize();

Maximizes the browser’s window because Selenium opens the browser in a minimized display.

Finally, a call to the function: GoTo(baseURL)

GoTo – responsible for navigating the browser to the url it receives.

Close – closes the browser.

Properties description:

Title – returns the url of the Browser, we’ll utilize this attribute when writing the tests.

getDriver – returns the driver, we’ll utilize this attribute when creating a reporting class.

Now, you are probably wondering how are we planning to implement this class? We’ll go back to the class created in the previous tutorial and paste there the following piece of code:

[TestFixture]
public class AutomationCore
{
    // Core Automation class
    [TestFixtureSetUp]
    public void startUpTest()// This method fire at the start of the Test
    {
        Browsers.Init();
    }
    [TestFixtureTearDown]
    public void endTest()// This method will fire at the end of the Test
    {
        Browsers.Close();
    }
}

In the startUpTest function, we’ll call Browsers.Init() and in the endTest function, Browsers.Close() will be called.

---

After enabling cross browser testing, move on to the Next tutorial and Develop a Reporting Module for the test automation framework, in order to get an indication on the failures, what passed and at which point it occurred.

-Please leave a comment and let me know about your questions, ideas and thoughts.

---