UX Testing with Docker

Introduction

Ola! Thanks for popping in and having a squiz

Today I’ll like to showcase how we can make our browser based test faster and more efficient by making use of 

• Docker and 
• selenium grid

Docker

Why

Docker is a great resource to use as we have the ability to spin up and environment for testing and then very quickly throw it away again.

OMG why would you do that?

Well that the power and presence of docker and containers. We can spin up, tear down and re-use this resource multiple times and we should do so, without attachment, 

Docker support is amazing. there are heaps of predefined containers that just require us to pull and use instead of us having to write and maintain those scripts, environments and data.

Its like magic at your fingertips

Selenium Grid

Grid is an extension out from Selenium which give us the ability to run our tests remotely.

Lets look at some of the key benefits:

• Run tests remotely
• Run tests in different browsers with the change of a config
• Run tests in parallel – our biggest win. 
• Reduce test time and therefore the feedback cycle.

Implementation

Start up the Selenium Grid

We’ll make use of the predefined selenium-docker containers.

This setup makes use of a dockerfile which will spin up 3 environments:

• Hub
• Chrome Node
• Firefox Node

Pull the image from: https://github.com/SeleniumHQ/docker-selenium

Head on into your download dir and docker-compose up, you will see the following: 

What we want to look out for:

• The Hub starts up and publishes a url and port.
  • in our case: localhost:4444
• The chrome node started up and registered against the hub
• The firefox node started up and registered against the hub

Navigate to the grid:

In your browser, open up: http://localhost:4444/grid/console

You will see:- 

You are viewing the grid, and the child worker nodes it has available. 

Thats it! your grid is up and running –

how damn easy was that!

But we’re not done. We need to change our test application code to hit this new environment.

Implement the Hook into the grid

To open the browser we need to establish some browser capabilities to start up our browser.

These are seen as ChromeOptions(),

We need to apply these setttings so that we can start up a browser on a linux terminal with no display adapter. We set the headless option in particular for this.

We then need to point our RemoteWebDriver to the new url,

We do so by setting the  urlToRemoteWD variable, which point to the url of the grid.

Run your test

When we run our test, – 

Our test is published to the master

The master will inspect which node is free and available and will push the test to run there.

The results are fed back to the master and then fed back to our test application for reporting. 

You are ALL DONE and ready to run a battery of tests against AWS or locally, headed or headless.