What is Selenium IDE: Learn The Basics

Selenium has revolutionized the world of testing. Since its inception, Selenium has proven to be robust and has been adopted across the globe. But what makes the tool so efficient? The answer to this is its robust test suite. But first, let’s brush up on what exactly Selenium is. 

Selenium is an open-source, automated testing tool used to test web applications across various browsers. It's primarily built in Java and supports several browsers and programming languages. 

Selenium comprises of four tools: 

1. Selenium IDE
2. Selenium RC
3. Selenium WebDriver
4. Selenium Grid

This article focuses on the first tool, Selenium IDE. We’ll learn and implement the features of IDE and will also see how it works through a demo.

What is Selenium IDE?

Shinya Kasatani developed Selenium Integrated Development Environment (IDE) in 2006 as a Firefox plugin that helps create tests. IDE is an easy-to-use interface that records user interactions on the browser and exports them as a reusable script. 

Selenium IDE is part of the Selenium suite and was developed to speed up the creation of automation scripts. It’s a rapid prototyping tool and can be used by engineers with no programming knowledge whatsoever. 

Learn the Ins & Outs of Software Development

Caltech Coding BootcampExplore Program

Advancements with New Selenium IDE

In 2017, Firefox upgraded to a new Firefox 55 version, which no longer supported Selenium IDE. Since then, the original version of Selenium IDE ceased to exist. However, Applitools rewrote the old Selenium IDE and released a new version recently. 

This new version comes with several new advancements: 

• Support for both Chrome and Firefox
• Improved locator functionality
• Parallel execution of tests using Selenium command line runner
• Provision for control flow statements
• Automatically waits for the page to load
• Supports embedded JavaScript code-runs 
• IDE has a debugger which allows step execution, adding breakpoints
• Support for code exports

Working Principle of Selenium IDE

IDE works in three stages: recording, playing back and saving. 

Fig: Selenium IDE working principle

In the next section, we’ll learn about the three stages in detail, but before we begin, let’s acquaint ourselves with the installation of IDE. 

Recording 

IDE allows the user to record all of the actions performed in the browser. These recorded actions as a whole are the test script. 

Playing Back 

The recorded script can now be executed to ensure that the browser is working accordingly. Now, the user can monitor the stability and success rate. 

Saving 

The recorded script is saved with a “.side” extension for future runs and regressions. 

Installation of Selenium IDE 

Step 1- Open the Firefox browser. 

Step 2- Click on the menu in the top right corner. 

Step 3- Click on Add-ons in the drop-down box.

Step 4- Click on find more add-ons and type “Selenium IDE.” 

Step 5- Click on Add to Firefox

Once installed, the Selenium IDE icon appears on the top right corner of the browser. When clicked, a Welcome message appears.

Now that we went through the installation, let’s create our first test. Consider the following use case for the tutorial: 

• Navigate to https://www.facebook.com
• Provide a dummy userID and password
• Log in with these credentials 
• Assert title of the application

A Simple Demo 

Recording

Step 1 - Launch your Firefox menu and open the Selenium IDE plugin. 

Step 2 - Select “Record a test in a new project.” Provide the name for your test. 

Step 3 - Provide a link to the Facebook webpage. The IDE starts recording by navigating to this web page. To continue, click on, OK.

Step 4 - Once the website opens, type “username1” in the username field and a dummy password for the password field. 

Step 5 - Click on “Log In.”

Step 6 - Now, we verify the title of our application. To do that, Right click>>Selenium IDE>>Assert title. As soon as this is done, a test step would be appended in the IDE editor. 

Now you can go back to the IDE editor and click on the Stop icon on the top right corner. With this, we’ve successfully recorded our test case. 

Once the recording is stopped, the editor will look something like this: 

Playing Back 

Now that the recording is done, we can play it back to verify if the script executes correctly and the browser behaves accordingly. To do this, we can click on the play icon on the menu bar. 

The commands successfully executed are color-coded in green, and the log at the bottom indicates any errors that occurred during the execution. If the script runs successfully, it indicates this by displaying a message.

Saving 

Once the test script is successfully executed, you can then save it. 

Once clicked, you can browse the location and save it in an appropriate folder. The project is stored with a “.side” extension — this can be used for future runs and regressions. 

Here's How to Land a Top Software Developer Job

Full Stack Developer - MERN StackExplore Program

Selenium Commands 

Selenium commands are broadly classified into: 

1. Actions - Commands that interact directly with the application: 

clickAndWait(),

typeAndWait()

2. Enable the user to store certain values to a user-defined variable:

storeTitle()

3. Assertions - Verifies the current state of the application along with an expected state. There are different types of assertions: 

1. Assert command makes sure that the test execution is terminated in case of failure
2. Verify command ensures script execution even if the verification has failed
3. WaitFor command waits for a specific condition to be met before executing the next test step

Advancements with the New IDE 

Re-usability of Test Scripts 

Many of the test scripts in the original version required signing into an application, creating an account, or signing out of an app. As you may see, this is redundant and a waste of time to recreate these test steps over and over. Thankfully, the new Selenium IDE allows one script to run another. 

In this test case, let’s navigate to http://thedemosite.co.uk/login.php and pass values to the username and password fields. Once the “Failed Login” message appears, we assert the text. 

The script in the IDE will look something like this: 

This login function is tested multiple times for different usernames and passwords. To do this, we create a UserID and password. 

Click on the commands and add a variable to it rather than hardcoded values. 

Now, create another test case and call it “InvalidCredential.” In this test case, we assign values to the username and password variables. Once assigned, we call the original test “LoginTest.” 

Use the store command and pass the values “user1” and “pwd1” for the variables username and password, respectively. The Run command runs the target test case (i.e., LoginTest). 

Now run the current test case. 

As shown above, “LoginTest” is run via “InvalidCredentials.” In this way, the Selenium IDE enables the reusability of test cases, which is similar to passing arguments to a function from the primary function in any programming language. 

Learn the Ins & Outs of Software Development

Caltech Coding BootcampExplore Program

Debugging in IDE

The Selenium IDE facilitates the debugging of test scripts. This enables the user to provide breakpoints where the execution of the test script halts, thus letting the user inspect the browser’s state.

Debugging in IDE is facilitated with the help of the following steps: 

1. Step execution - From the test script, you can run every step in succession, controlling the execution of each step. To do this, follow the steps below. 

1. Select the command that you would wish to execute. 
2. Click on the “Step over current command.” 
3. The command executes and pauses before proceeding to the next one. 

Step execution is useful when the test cases are written are long. You could start checking for errors at any step. This will reveal where the test might be failing. 

2. Breakpoints - To add breakpoints, click on the digit corresponding to the command you’d like to apply a breakpoint on. Once run, the debugger will execute all the steps before the breakpoint stops the execution.

3. Enter the debugger by using the “Play to this point” option - Another easy way to debug is by using the option as mentioned above. Right-click on the command you’d wish to stop at>>Click on “Play to this point.” 

4. Pause on Exception - This is a brilliant feature that automatically enters the debug mode in case of an exception. Consider a scenario where the target of a command has been changed. 

The target value here is missing a letter causing an error. The script fails, trying to find an incorrect ID. 

Control Flow Statements 

Various pop-ups, notifications, and subscription windows can be handled easily using control flow statements. If “X” appears, do “this” to handle it. Conditional logic (control flow) statements can be added to the IDE test script. Control flow statements like conditional branching and looping can be executed by the IDE. 

Consider a webpage for calculating calories. Here, we select one option for females and another for males, which can only be done with the help of control flow statements. To do this, type the commands mentioned.

Selenium Side-Runner

The new Selenium IDE enables users to run all Selenium IDE tests on any browser, in parallel, and on a Grid without the need to write any code. This ensures that the test suite executes fast.

Prerequisites:

• Node version 8 or 10
• npm package that typically is installed with Node
• Selenium side-runner
• Browser driver

To read the documentation on the command-line-runner, click here.

Selenium Side-Runner ensures the sequential execution of all the commands and test cases. The detailed log is also shown in the terminal, where any failures will also show up. 

Here's How to Land a Top Software Developer Job

Full Stack Developer - MERN StackExplore Program

Limitations of Selenium IDE

Being one of the earliest test tools in the market, IDE has a few drawbacks: 

1. It does not support data-driven testing
2. It cannot perform database testing
3. It cannot provide a detailed test report
4. It cannot export to WebDriver scripts

Master the Selenium Suite 

Interested in making a career as an automation engineer? A certification course will come in handy, so check out Simplilearn’s Full Stack Developer - MERN Stack which enables you to master the complete Selenium suite. 

The certification course is ideal for: 

• Test Managers 
• Test Engineers 
• Test Leads
• Test Analysts
• QA Engineers 
• Software Developers 
• Engineers who want to learn automation testing