How to get more out of your recorded Selenium tests

Selenium is a portable framework for testing web applications. It is well suited for creating automated tests of varying complexity, and both beginners and professional autotest-developers can use this framework. The easiest way to create automated UI web tests is by using script-recorders. Let’s look at the most popular Selenium tests script-recorder, and understand how to use it both for simple and for more complex tests:

The Selenium IDE (Recorder) extension is the tool that is designed to record your interactions with websites to help you generate automation for your site. It also allows you to edit recorded tests, which makes it possible to keep your testing up to date. Its features include:

• Recording and playing back tests on the Firefox and Chrome browsers.
• Organizing tests into suites for easy management.
• Saving and loading scripts, for later playback.
• Support for Selenium 3.

In this article, we’ll consider using Selenium IDE as an extension for the Chrome browser, but it also exists for Firefox. Let’s talk about the cases of using this tool in more detail:

Single test

Preparing steps:

1. 1. Install the extension from this link.
   2. Launch the application.
   3. After launching, the application will prompt you to select the appropriate action. We are interested in point 1:

 

1. 1. Enter a project name:

 

1. And now enter the starting URL, it is necessary that your test has a starting point (home page). Just click “START RECORDING” to start creating your automation:
2. Now that we are ready to record our test. We will write the following script:
   • Open the main page – experitest.com
   • Click on the “LEARN MORE” button inside Mobile App Testing section

After completing these steps in the browser, click the Stop button (1) in Selenium IDE, then click the Play button (2) to check the recorded test:

This is a very small script, but it is enough to show how to work with the recorder. Now we can move on to the next part – editing the recorded script:

Click on the bottom line in your IDE window:

Fill in the fields for this step:

• Command – We are interested in checking that the text we specify is actually stored in the indicated part of the page, therefore here we indicate “store text”. The names of the commands here are quite understandable, but if you don’t know the exact name, the application will tell you this in the drop-down list.
• Target – Here we indicate the element with which the interaction will take place at this step. The easiest way to do this is to use the visual page search tool. To do this, click on the button right to the target field (the arrow points at it) and select the desired item.
• Value – If we want to search for something, we have to set a value for searching. In this case, we will specify the text whose presence is checked by our test.

Run the script and make sure that it works correctly.

The recorder also supports logical operations; let’s complicate our test a little, by using the if operator. To do this, we replace the text availability check to write it into a variable (named “myVar”), then use the “if” operator to compare it with the expected one, and if successful, press the “FREE TRIAL” button, otherwise, use the “else” operator to click on another button. Like this:

As you can see, after running the test, one of the steps is not highlighted in green. This happens because it was omitted by the condition. Let’s save our project as a file. For this click on the Save button in the upper right corner. Your project will be downloaded as a .side file.

Test suite

The Selenium IDE is not limited to the creation of individual Selenium tests, it allows you to create test suites. Let’s make our script more complex. First, let’s add a second test to our project. For this we can:

• Add a new empty test and use the recorder again
• Add a new empty test and add test steps manually
• Duplicate an existing test and edit it

For convenience, we will use the third option, and in the test itself, we will replace only the section in which we check the title. This will affect the execution of the test.

Test1 is the original test:

Test2 is the clone of the Test1.

Now let’s move on to test suites creation. To do this, go to the appropriate section and create a few test suites:

• Select the Test suite section
• Add a suite
• Click add tests entry.
• Select some tests.

After that, we get a list of test suites. Now, we can execute only the necessary set of tests, for this select the first test from the suite and click on the “Run all tests in-suite” button.

This project can be downloaded from the repository at the link.

Additional features

Well, now you know about the main features of the Recorder. However, it has some very useful features, let’s talk about them:

1. 1. You can execute a specific test step by step. This is very convenient when you need to fix a problem during debugging.
   2. The test can be played at a given speed. This is useful for demonstrating to a customer, or for the realism in the execution of a script.Features applied to a specific test suite you can find in the suite Settings:
   3. Timeout (seconds) – This is a pause between test steps.
   4. Parallel running – This feature allows you to run tests of your suite in parallel. But this only works when tests were started from the console. You can read more about this feature from this article.
   5. Persist session – This and the previous properties cannot be used simultaneously. This feature implies the launch of a new test from the state in which the browser remained after the previous test. This is an important point.
   6. Log – Obviously, with so many features, the tool must have logs. When you run the application, you don’t see the log field, but it’s available. Pull up the footer to see it.

 

1. Export – One of the key features is the ability to export recorded tests into Java for further use in IDE. Let’s take a closer look at this. To do this, select Export for the test suite.

Then, approve the export to Java+JUnit. If you do not have experience in developing such autotests, then I recommend enabling auto-commenting for the generated code. For this, check the “Include origin tracking code comments” checkbox.

Well, now we have a ready file with a Java code. Create a Java Maven (or Gradle, if you prefer to use it) project with the default settings, and put your java class into /src/main/java folder. If you are using IntelliJ IDEA IDE, don’t forget to enable auto-import, and add all the dependencies that the IDE offers:

After this, the IDE shows that you have no errors in the class code, and you can run your code. Let’s try to do this using the next combination of hotkeys – ctrl+shift+F10.

As you can see, an error has occurred. IDEA IDE understands what the error is and suggests a solution. Although we (like most users, judging by statistics) used the Google Chrome Browser during creating of our script, the generated java code contains instructions for using Mozilla Firefox Browser. IDEA gives a hint that we need to indicate the location of the geckodriver in the code, as well as the download link. Follow this advice. Download the driver and add the following line to the code as the next line after the setUp() method declaration (line 26):

System.setProperty(“webdriver.gecko.driver”, “C:\Users\mbabilo\Desktop\recorder\geckodriver.exe”); // <-- Change this path

Run it again:

Well done, we fixed the problem and launched our tests in IDE.

Experitest offers an excellent cloud system for distributed test execution and subsequent report generation, let’s now consider how to use it in this case. Obviously, the first thing we need to understand is how we can run the simplest test on this cloud platform using the local IDE. So let’s put off our finished test, and run a simple default test script. For this, we will go to the next page https://cloud.seetest.io/index.html#/quickstart, log in (registration is required), select Automation section and set Browser = FireFox. Then, click on the “RUN TEST” button.

After that, we will see the execution status in the upper right corner.

Let’s launch the default Selenium tests using IDEA IDE and a new project:

• Copy Java code to a separate class.
• Copy Maven dependency to the pom.xml file.
• Create a new Java class, copy the test code from the SeeTest, and make import as the IDE advices (and we did it earlier).
• Build and run the project

In the web browser, you should see the same designation of the running test as before (when we started this test using the site).

A link to the test report appears in the IDE:

Now we need to detect and copy those lines of code from the default example, which allow us to run our tests using the Seetest cloud platform. In our case we should:

1. 1. In TestSuite3Test class itself:
      • Add:

private static final String ACCESS_KEY = “eyJ4cC55Ijo0MjQwMjk1LCJ4cC5wIjo0MjQwMjk0LCJ4cC5tIjoiTVRVME9EQTJPREU1T1Rrek5RIiwiYWxnIjoiSFMyNTYifQ.eyJleHAiOjE4NjM1MDg5MDUsImlzcyI6ImNvbS5leHBlcml0ZXN0In0.JsahW8N-gWkTIU3WC1UMV-oI8_xQnnFaptdrB3wIjzQ”; // <= Replace this with your ACCESS_KEY private RemoteWebDriver driver; private URL url; private DesiredCapabilities dc = new DesiredCapabilities();

1. 1. • Remove:

private WebDriver driver; – It’s necessary because we redefined driver as RemoteWebDriver above.

1. 1. In @Before method:
      • Add:

url = new URL(“https://cloud.seetest.io/wd/hub”); dc.setCapability(CapabilityType.BROWSER_NAME, BrowserType.FIREFOX); dc.setCapability(CapabilityType.PLATFORM, Platform.ANY); dc.setCapability(“accessKey”, ACCESS_KEY); dc.setCapability(“testName”, “Test suite 3”); driver = new RemoteWebDriver(url, dc);

1. 1. • Remove:

System.setProperty(“webdriver.gecko.driver”, “C:\Users\mbabilo\Desktop\recorder\geckodriver.exe”); driver = new FirefoxDriver();

1. 1. • Add exception method signature:

public void setUp() throws MalformedURLException { – This is necessary for using URL parameter. Let’s run our tests now.

1. 1. • In the IDE we’ll see the process of execution, and then the result.
      • The web application displays the number of tests performed.
      • And shows more detailed statistics for each test. For each launch, there is the same report as we saw earlier (marked by arrows).

You can download the finished project here.

That’s it! What’s next?

1. • • You can complicate tests by adding more different checks
     • Run tests using different browsers and environments
     • Use CI tools
     • Find more useful articles in the Selenium section of the Experitest blog: https://experitest.com/selenium-testing