This is a quick little summary about a class library I developed during my 4-5 week placement at Intelligent Environments in Belfast that allows for the automated control of sliders within Selenium.

Git Link

Selenium WebDriver:

The selenium webdriver is a suite of tools used to automate web browsers across many platforms which is ideal in a QA environment where a large proportion of testing is done on website based solutions and products.


The problem:

Consider a slider on a webpage, one end represents the minimum value able to entered, the other the maximum and the user chooses the value they wish to enter by dragging an object (usually a circle or something) between these two points.


How does a developer verify that the value entered by the user via the slider is indeed the correct value that the website and backend see?

Sure the dev could just drag the slider to the value they want to test manually and verify via the textbox that the value is indeed correct or even run a jquery command to be doubly sure.

This works very well for a small number of values but in the case of financial services website where the values have to be correct 100% of the time and with the possibility of two or more sliders on the page.

The time it takes to test every single combination of slider goes up and up and up to the point where it cannot be feasibly manually tested every single update.

Furthermore the problem gets worse where a developer somewhat familiar with selenium can get a slider to move but can't tell the driver where to move the slider to as typically the "amounts" to be tested are given in PoundsMonths and Kilometers instead of in Pixels which a computer understands.

The Solution:

First things first I needed to created a mathematical relationship between the "amounts of stuff" and the pixels that this amount represented on the slider. I did a bit of tinkering & experimentation and eventually came up with this simplfied equation.

My Equation


Say a developer wanted to move a slider of width 600px with a max and min of £10,000 and £2,000 respectively to £5,000, they'd plug these values into this equation and get the amount of pixels returned as a value.




Which would give 225 pixels as an answer.

The neat thing is this equation converts any amounts of stuff into pixels so it will work for months, days, pounds, grams.. ANYTHING :).

Now that I had a way of knowing how many pixels the slider would need to be moved all I would need to do is manipulate it to that amount.

This is where things get a little arcane and muddled and I owe full credit to Declan at IE for this command.

What this does is returns the slider to it's start position and drags it to the amount of pixels calculated in the previous step allowing the slider to be manipulated.

Once you put all these parts together and define a list of what values should be entered and what should be displayed you now have a complete solution for testing a webpage in selenium, I'll link a video below of it in action.

It was a great project to work on as the code above can be used for any slider on any webpage. I gained great experience in QA testing and even got to demo my code live to the client!

I ended up connecting this code to an excel spreadsheet with input values and expected output, by using the selenium web driver in C# I was able to run through all of these values and automatically validate the output so that the website could be fully tested in a matter of seconds rather than hours.