Research & Development for 3D & the Web

Beginners guide to setting up Selenium for automated testing

I glossed over what Selenium is and a little of what it can do. Now it’s time to take a real look by installing the Firefox add-on and putting it through its paces. If you don’t have Firefox, go grab it. I’m not bothering to link you to the Firefox site because if you are here looking into how to do automated testing and you don’t know where to get Firefox or what it is, then for you unfortunately this is a NO THROUGH ROAD, TURN AROUND AND GO BACK.

In my opinion, Firefox still the best browser for testing in primarily because the combination of a few good add-ons its just easier to use and look/feel better inside of Firefox than their equivalents in say Google Chrome for example. I tend to use Firefox when I’m working for testing things and then another browser (usually Chrome) for general browsing. This is a good idea as testing can from time to time lead to Browsers freezing/crashing and it’s a pain to have to reload all of your general tabs up if that happens.

Right, down to business. Installing Selenium and recording our first test. Go and visit Selenium’s website and on the download page grab the latest version of the Selenium IDE. The IDE is the plugin for Firefox. The section below it named “Selenium Server” is for the Selenium Server which is also definitely worth grabbing while we are there. The selenium server is used to run tests outside of the IDE. I haven’t really done a lot with it on its own, but I do certainly make use of it when using Bromine in conjunction with Selenium. More on that later in another post however.

You will notice that there may also be download links for other things like plugins etc. You can read up and look into those should you wish, there are some good ones getting around, but for now, grab the IDE and install it so that you have it ready to go in Firefox. Once installed (and you have likely restarted your browser as part of the installation) you should notice an extra icon up in the menu bar next to the Home icon inside of Firefox which is where you can easily fire up the Selenium window.

The Selenium Interface

1. Record Button –> This is where you toggle recording on and off.

2. Base URL Field –> The base URL for the site you are testing.

3. Playback Option Buttons –> The buttons to play current test, entire test suite, pause test, control speed etc.

4. Table Window –> This is where you can view your recorded actions in HTML tabular view.

5. Command Customization Area –> this is where you can add manual commands or edit existing ones.

6. The Find Button –> Clicking this will highlight the target item you have entered into the Target Field. Useful for checking  you have the correct field (or that it’s a valid entry).

7. Text Window and tabs –> Here you can view useful information about the command you are using, the log of your tests and actions (where you debug) as well as a few other useful tabs which we will look at later on.

8. Test Case Window –> This is where your tests are listed for the particular suite you have open.

Running test cases on different domains or multiple variations of your site using the Base URL

Suppose you are working on a website for a client in-house and your development team have a local copy of the site in source control which everyone is using including you (to test). What happens to your tests when the site is nearing completion and a User Testing (UAT) version of the site is put somewhere for your client to access. What if once User Testing is over, your site is again moved to a different domain for the ‘Live’ site? Can I test all of these without having to write all of my tests again or make changes to them? YES, yes you can by simply using the Base URL in Selenium. All of your recorded tests should be using relative links throughout your tests. Lets look at an example to see what this means exactly..

Lets say you’re testing a site locally with a base url of: http://local.crazytests.com to start off with. Up the top of Selenium (number 2 in the above image) that url should be placed in there. Ok, so now you’re releasing a test version of your site for your clients at http://beta.crazytests.com – we now just change this at the top of selenium (number 2) and away we go. You will notice in the image above that my first example click was to click on the home link on my site and that it shows with /blog/ only. This is because of the relative link – so the actual address we’re telling Selenium to look at is http://davegoosem.net/blog/ . Great!

Selenium Commands

I like the way Seleniumhq.org describes this next part in their documentation, so I’m doing a dirty copy/paste from there for the most part (few minor adjustments) as I think they do actually describe these quite well. Some of it can be a bit wordy and long but otherwise their documentation is not toooo bad. Full credit to them for this next section on Selenium Commands anyhow.

A command is what tells Selenium what to do. Selenium commands come in three “flavors”:Actions, Accessors and Assertions.

• Actions are commands that generally manipulate the state of the application. They do things like “click this link” and “select that option”. If an Action fails, or has an error, the execution of the current test is stopped.Many Actions can be called with the “AndWait” suffix, e.g. “clickAndWait”. This suffix tells Selenium that the action will cause the browser to make a call to the server, and that Selenium should wait for a new page to load.
• Accessors examine the state of the application and store the results in variables, e.g. “storeTitle”. They are also used to automatically generate Assertions.

Assertions are like Accessors, but they verify that the state of the application conforms to what is expected. Examples include “make sure the page title is X” and “verify that this checkbox is checked”.

All Selenium Assertions can be used in 3 modes: “assert”, “verify”, and ” waitFor”. For example, you can “assertText”, “verifyText” and “waitForText”. When an “assert” fails, the test is aborted. When a “verify” fails, the test will continue execution, logging the failure. This allows a single “assert” to ensure that the application is on the correct page, followed by a bunch of “verify” assertions to test form field values, labels, etc.

“waitFor” commands wait for some condition to become true (which can be useful for testing Ajax applications). They will succeed immediately if the condition is already true. However, they will fail and halt the test if the condition does not become true within the current timeout setting (see the setTimeout action below).

Selenium commands are simple, they consist of the command and two parameters. For example:

The parameters are not always required; it depends on the command. In some cases both are required, in others one parameter is required, and in still others the command may take no parameters at all. Here are a couple more examples:

The command reference describes the parameter requirements for each command.

Parameters vary, however they are typically:

• a locator for identifying a UI element within a page.
• a text pattern for verifying or asserting expected page content
• a text pattern or a selenium variable for entering text in an input field or for selecting an option from an option list.

Locators, text patterns, selenium variables, and the commands themselves are described in considerable detail in the section on Selenium Commands.

Selenium scripts that will be run from Selenium-IDE will be be stored in an HTML text file format. This consists of an HTML table with three columns. The first column identifies the Selenium command, the second is a target, and the final column contains a value. The second and third columns may not require values depending on the chosen Selenium command, but they should be present. Each table row represents a new Selenium command. Here is an example of a test that opens a page, asserts the page title and then verifies some content on the page:

<table>
    <tr><td>open</td><td></td><td>/download/</td></tr>
    <tr><td>assertTitle</td><td></td><td>Downloads</td></tr>
    <tr><td>verifyText</td><td>//h2</td><td>Downloads</td></tr>
</table>

Rendered as a table in a browser this would look like the following:

The Selenese HTML syntax can be used to write and run tests without requiring knowledge of a programming language. With a basic knowledge of selenese and Selenium-IDE you can quickly produce and run testcases.

Recording a simple test with Selenium