logo logo

How to Create a Cross Browser Compatible Test Automation Framework

main post image

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#

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

Class 3 – Utilizing Test Automation Framework with Advanced Capabilities


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.


 

Asya Galinsky

About the author

Asya Galinsky

Join TestProject Community

Get full access to the world's first cloud-based, open source friendly testing community. Enjoy TestProject's end-to-end test automation Platform, Forum, Blog and Docs - All for FREE.

Join Us Now  

Comments

12 15 comments
  • Avatar
    Pratik March 9, 2017, 11:00 am

    Thanks Asya for sharing the basic tutorial to create a Cross-browser compatible test automation framework. This will definitely help to test cross-browser compatibility using other tools like BrowserStack, TestingWhiz, CrossBrowserTesting, etc.

  • Asya Galinsky
    Asya Galinsky March 9, 2017, 12:28 pm

    Hi Pratik, happy to hear that. You’re welcome!

  • Avatar
    only4arunkumar July 25, 2017, 6:39 am

    Thanks Asya, well written article and examples are lucid and encouraging.

  • Avatar
    lufirofe July 26, 2017, 1:02 pm

    Hi Asya,
    Just followed these steps to include cross browser capabilities to my test project but I have errors in “ConfigurationManager” when creating the variables for returning the url and name of specific browser:

    public static string baseURL = ConfigurationManager.AppSettings[“url”];
    public static string browser = ConfigurationManager.AppSettings[“browser”];

    I’m new to test automation, could you help me?

  • Avatar
    Duke54 October 4, 2017, 7:49 am

    Hi Asya

    I’ve experienced exactly the same problem as Lufirofe, are you able to help seeing as this question was posted in July and we’re now in September?

    Other than that they’re pretty well written tutorials.

  • Avatar
    gandhe123 October 13, 2017, 9:53 pm

    Hi, I am new to the C# and Selenium..I was at this topic and I’ve some code but its not working.
    In Browsers.cs – following 2 lines are throwing an error:
    private static string baseURL = ConfigurationManager.AppSettings[“url”];
    private static string browser = ConfigurationManager.AppSettings[“browser”];
    The name ‘ConfigurationManager’ does not exist in the current context

    I added the App.config file as following:

    I am not sure how can I fix the error?

    thanks,
    Gandhe

    • Avatar
      gandhe123 October 16, 2017, 2:44 pm

      I am able to fix the above issue but I am facing other issues:
      Browsers.cs class:
      using System;
      using System.Collections.Generic;
      using System.Linq;
      using System.Text;
      using System.Configuration;
      using System.Threading.Tasks;
      using OpenQA.Selenium;
      using OpenQA.Selenium.Support.PageObjects;
      using OpenQA.Selenium.Chrome;
      using OpenQA.Selenium.IE;
      using OpenQA.Selenium.Firefox;
      using System.Threading;
      using System.Drawing;

      namespace CrossBrowserTest
      {
      public class Browsers
      {
      private static IWebDriver webDriver;
      private static string baseURL = ConfigurationManager.AppSettings[“url”];
      private static string browser = ConfigurationManager.AppSettings[“browser”].ToString();

      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();

      }

      public static void Goto(string url)
      {
      webDriver.Navigate().GoToUrl(baseURL);
      }
      public static string Title1
      {
      get { return webDriver.Title; }
      }
      public static IWebDriver getDriver
      {
      get { return webDriver; }
      }
      public static void Close()
      {
      webDriver.Quit();
      }
      }
      }

      ===============
      testclass.cs defined as:
      using System;
      using System.Text;
      using System.Collections.Generic;
      using Microsoft.VisualStudio.TestTools.UnitTesting;
      using OpenQA.Selenium.Support.PageObjects;
      using OpenQA.Selenium.Chrome;
      using System.Threading;
      using OpenQA.Selenium;
      using System.Collections.Specialized;

      namespace CrossBrowserTest
      {

      [TestClass]
      public class UnitTest1
      {
      string url;
      IWebDriver driver;

      [TestInitialize]
      public void SetupTest()
      {
      Browsers.Init();
      }

      [TestMethod]
      public void TestMethod1()
      {

      Browsers.Goto(url);
      driver = Browsers.getDriver(); — this line is throwing an error

      string actualTitle = driver.Title(); this line is throwing an error

      Thread.Sleep(5000);

      }

      [TestCleanup]
      public void MyTestCleanup()
      {
      Browsers.Close();

      }

      }

      }

      Any help is appreciated

      thanks

  • Upgrade Your Project with CSS Selector and Custom Attributes | Viralizer Network Blog | Viralizer Network Blog November 21, 2017, 3:49 am

    […] you need to be able to select parent elements, you need to consider the impact it will have on your cross-browser testing in Internet Explorer. Essentially, it will take longer to run your automated tests in […]

  • Avatar
    xpt December 18, 2017, 4:28 pm

    Thanks Asya, Nice tutorial! Just what I need and was looking for!

    Is the finished code ready somewhere? I’m quite new to the whole thing, so it’d be much better that I start with the fully finished code first (instead make all the copies * pastes), so that I don’t need to fix small things that are not covered in the tutorial, like details about `App.config`, etc.

    If not, would you mind publishing it on Github please?

    Thanks

  • Avatar
    saoba February 27, 2018, 10:47 am

    Hi All,
    I am using the cross-browser function, but I was getting Nullreference exception when I configured the framework setting up a different project to hold the test cases. This is what I tried to resolve the issue, with no joy.

    public class Browsers
    {
    private static IWebDriver webDriver;
    public static ReportManager report;
    private static string baseURL = ConfigurationManager.AppSettings[“url”];
    private static string browser = ConfigurationManager.AppSettings[“browser”];

    public static void Init()
    {

    switch (browser)
    {
    case “Chrome”:
    if (webDriver == null)
    {
    webDriver = new ChromeDriver(@”C:\Users\obafemis\Documents\Visual Studio 2015\Drivers”);
    }

    break;
    case “IE”:
    if (webDriver == null)
    {
    webDriver = new InternetExplorerDriver(@”C:\Users\obafemis\Documents\Visual Studio 2015\Drivers”);
    }
    break;
    case “Firefox”:
    if (webDriver == null)
    {
    webDriver = new FirefoxDriver(@”C:\Users\obafemis\Documents\Visual Studio 2015\Drivers”);
    }
    break;
    }
    webDriver.Manage().Window.Maximize();
    report = new ReportManager(browser, baseURL);
    Goto(baseURL);
    }
    However, I still get the NullReference Exception. Any help would be appreciated.

  • Avatar
    Magoo February 4, 2019, 10:47 am

    Hi I’m struggling with this tutorial. I’m completely new to programming and C#, and I keep getting errors.

    In this one I found I needed to add:

    using OpenQA.Selenium.IE;
    using OpenQA.Selenium.Firefox;
    using System.Configuration;

    to get rid of a number of issues.

    However I’m still stuck with a CS5001 – Program does not contain a static ‘Main’ method suitable for an entry point.

    Why is this? How do I fix this?

Leave a Reply

Join TestProject Newsletter

Join a 20K community of readers! Always stay up-to-date with all the latest test automation trends, best practice and tips shared by leading software testing community experts across the globe!

FacebookLinkedInTwitterEmail