UI-testing (EPiServer): the need for speed

Executing our two test takes around 20 seconds. If you’ve run the test you’ve noticed that a lot of the test time is actually spent on opening a new browser window. One way to mitigate this is to use the same browser throughout all the test which opens before the first test and closes after the last test. Note that there are downsides with this since your test may now affect other tests because of the shared browser data (cookies etc.). We can try and mitigate this by clearing the state between tests but the absolutely full proof way of ensuring a clean slate is to fire up a new browser before each tests.

Sharing the browser

We need to refactor our test code a bit to make this happen. Let’s start with adding some code that runs before any tests are run and after all the tests are completed using the SetupFixture attribute.

[SetUpFixture]
public class SeleniumServer
{
    public static IWebDriver Driver { get; private set; }

    [SetUp]
    public static void Start()
    {
        Driver = new FirefoxDriver();
        Driver.Manage().Window.Maximize();
    }

    [TearDown]
    public static void Stop()
    {
        Driver.Quit();
    }

    public static void ResetBrowser()
    {
        Driver.Manage().Cookies.DeleteAllCookies();
    }
}

The TestBase class now looks like this

public class UiTestBase
{
    protected IWebDriver Driver = SeleniumServer.Driver;
    protected const string BaseUrl = "http://alloy.demo.episerver.com";

    [TearDown]
    public void After()
    {
        SeleniumServer.ResetBrowser();
    }

    public void Visit(string relativeUrl)
    {
        Driver.Navigate().GoToUrl(BaseUrl + relativeUrl);
    }
}

Bring me the head of… oh wait

A great way to speed up your tests is to use what is called a headless browser. A headless browser is basically a browser without a GUI and since it doesn’t need to show a user anything it’s considerably faster than a conventional browser. This has been missing from the .net space but now PhantomJS is available and it’s also integrated into the Selenium code! To use it we need to download the phantom js executable either via the PhantomJS page or by fetching the NuGet package

Install-Package phantomjs.exe

To use phantom we only need to adjust our SeleniumServer class to initiate a phantomjs driver instead of a firefox one. The constructor needs to know the path the phantomjs executable.

[SetUp]
public static void Start()
{
    //Driver = new FirefoxDriver();
    Driver = new PhantomJSDriver(@"(yourPathHere)\phantomjs.exe.1.8.0");
    Driver.Manage().Window.Maximize();
}

Time spent executing tests

As usual the numbers themselves are not important but rather how they compare to each other.

2 tests

1. New browser: 20 seconds
2. Shared browser: 13 seconds
3. Headless browser: 7 seconds

6 tests

1. New browser: 44 seconds
2. Shared browser: 20 seconds
3. Headless browser: 8 seconds

14 tests

1. New browser: 1 minute 48 seconds
2. Shared browser: 29 seconds
3. Headless browser: 9 seconds