5.12. Automating Cross-Browser Tests

One of the main problems with web testing is dealing with different browsers and rendering engines. Cross-browser testing ends up being a manual process most of the time because it's very difficult to test exactly how a browser will render the page. One technique that could be applied is taking a screenshot for each test in each browser, but this calls for a manual process that includes looking at the screen captures.

A great use of automated cross-browsers is in testing JavaScript. With the popularity of AJAX in recent years, developers have found that JavaScript does not behave the same way between browsers in all situations. Creating automated UI tests with WatiN or Selenium can help ensure that your application works in all major browsers. The following code snippet is a cross-browser test using WatiN:

public void Should_Click_Search_On_Google_And_Return_Results_For_AspNet()
        {
            IBrowser browser = BrowserFactory.Create(BrowserType.InternetExplorer);
            Return_Results_For_ASP_Net(browser);

            browser = BrowserFactory.Create(BrowserType.FireFox);
            Return_Results_For_ASP_Net(browser);
        }

        private void Return_Results_For_ASP_Net(IBrowser browswer)
        {
            browswer.GoTo("http://www.google.com");
            browswer.TextField(Find.ByName("q")).Value = "asp.net";
            browswer.Button(Find.ByName("btnG")).Click();
            Assert.IsTrue(browswer.ContainsText("The Official Microsoft ASP.NET
Site"));
        }

Remember, to run WatiN tests in Firefox, the jssh.xpi add-in must be installed on the Firefox instance you will be testing with.

The following example is a cross-browser test with Selenium:

[Test]
        public void Should_Click_Search_On_Google_And_Return_Results_For_AspNet()
        {
            ISelenium browser = new DefaultSelenium("localhost", 4444, "*firefox",
               "http://www.google.com/");
            Return_Results_For_ASP_Net(browser);
            browser.Close();

            browser = new DefaultSelenium("localhost", 4444, "*iexplore",
               "http://www.google.com/");
            Return_Results_For_ASP_Net(browser);
            browser.Close();
        }

        private void Return_Results_For_ASP_Net(ISelenium browser)
        {
            browser.Start();
            browser.Open("/");
            browser.Type("q", "asp.net");
            browser.Click("btnG");
            browser.WaitForPageToLoad("30000");

            Assert.IsTrue(browser.IsTextPresent("The Official Microsoft ASP.NET
Site"));
        }

There are a couple of concerns with the above style of test. Firstly, if our IE test fails, then our Firefox test will never be executed. If we knew that our IE test failed, but FireFox was successful, then we could identify the problem more effectively. The other problem is that if we wanted to add Google Chrome as a test platform, we would need to manually visit all of our tests to add this logic. As a result, Ben Hall has created an extension for the xUnit unit testing framework to improve this situation.

The extension is an attribute which will create an instance of the WatiN browser object which is passed to the test as a parameter. As a result, xUnit will execute the test twice, once for each browser.

public class Example
{
   [Theory]
   [Browser(BrowserType.InternetExplorer)]
   [Browser(BrowserType.FireFox)]
   public void Should_Click_Search_On_Google_And_Return_Results_For_AspNet(IBrowser
      browser)
        {
            browser.GoTo("http://www.google.co.uk");
            browser.TextField(Find.ByName("q")).Value = "asp.net";
            browser.Button(Find.ByName("btnG")).Click();
            Assert.True(browser.ContainsText("The Official Microsoft ASP.NET
Site"));
        }
    }

This can be downloaded from http://github.com/BenHall/xUnitBrowserAttribute/tree/master with an example included in the samples for this chapter.

While a similar extension could be built for nUnit, it is more much difficult and less effective than xUnit's approach. Similar approaches can be achieved by having a config file which is used to find out which browser to test against. The config file could then be edited by a build script during execution, allowing you to very simply control which browsers are tested and when.

Going forward, companies will start providing cloud-based services offering to host and execute your UI tests on a cloud server. The advantage being that you can run your tests on multiple different platforms and browsers without having to install and configure the individual platforms. Two such services are Cloud Testing (http://www.cloudtesting.com/) and Go Test It (http://go-test.it/).