Test Case Editor and sample recording of script

Test Case Editor:

The Command, Target and Value entry fields display the currently selected command along with its
parameters.
These are entry fields where you can modify the currently selected command.

Your script is displayed in the test case editor. It has two tabs.

Table View
Source View

Table View:

This is where you create and modify Selenese commands.
After playback, each step is color-coded.
If you start typing in the Command field, a drop-down list will be populated based on the first
characters you type; you can then select your desired command from the drop-down.

Source View:

It displays the steps in HTML (default) format.
It also allows you to edit your script just like in the Table View.

Log/Reference/UI-Element/Rollup Pane/Expert/Stored-Vars:

The bottom pane is used for six different functions

Log
Reference
UI-Element
Rollup
Stored-Vars
Expert

Log:

When you run your test case, error messages and information messages showing the progress are
displayed in this pane automatically, even if you do not first select the Log tab.
These messages are often useful for test case debugging

Clear button is used for clearing the Log.
Info button is a drop-down allowing selection of different levels of information to log.

Reference:

The Reference tab is the default selection whenever you are entering or modifying Selenese commands and parameters in Table mode.
In Table mode, the Reference pane will display documentation on the current command.

When entering or modifying commands, whether from Table or Source mode, it is important to ensure that the parameters specified in the Target and Value fields match those specified in the parameter list in the Reference pane.

If there is a mismatch in any of these three areas, the command will not run correctly.

We will discuss remaining tabs in the pane later in the posts

How to create Test Suites?

Step 1: Open Selenium IDE and go to Menu.
Step 2: Click on File ->  New Test Suite

Remember:

By default the suit name is “untitled”.

Right click on untitled and add the test cases.

Finally save the Test Suite with the extension .html.

We can drag and drop the Test cases for the order of execution.

Even if a Test case fails in the middle, the remaining test cases will execute.

Scripting in Selenium IDE

Selenium IDE is case sensitive and we should type values/attributes exactly as in the application.

Now we will see about –
Scripting by recording option.
Scripting manually using Firebug.
To explain clearly, I am taking the IRCTC website as our web application under test.

It is an online railway reservation system. Its URL is https://www.irctc.co.in/ and this will be our Base URL.

Scripting by recording option

We will create our first test script in Selenium IDE using recording option.
Afterwards, we shall execute our script using the playback feature.

Step 1:

Launch Mozilla Firefox browser and Selenium IDE.
Type the value for our Base URL: https://www.irctc.co.in/
Toggle the record button

Step 2:

In Firefox, navigate to https://www.irctc.co.in/.
Firefox should take you to the page similar to the one shown below

Step 3:

Right-click on IRCTC logo on the upper left corner. This will bring up the Selenium IDE context
menu.
Select the “Show Available Commands” option.
Then, select “assertTitle IRCTC Next Generation eTicketing System”.
This is a command that makes sure that the page title is correct and validating that we entered into the home page

After Selecting the command the TestCase pane is updated as below

Step 4:

In the “User Name” text box, type the username, “TestUser”.
In the “Password” text box, type a password, “123456”.

Selenium IDE Menu's explanation

Edit:

It contains the options like Undo, Redo, Cut, Copy, Paste, Delete, and Select All.

The two important options are:

Insert New Command
Insert New Comment

The newly inserted command or comment will be placed on top of the currently selected line.
In the below example,

We have placed open command in the first line, and clickAt command in the second line.
Suppose if I want to insert a comment in between these two commands then we have to right click on the second command “ClickAt” and click on the option “Insert New Comment”.

I have typed the comment as “Hi Automation” which is displaying in pink color.

Remember:

Comments displays in pink color

Commands displays in black color

Actions:

The “Actions” menu and “Tool bar” have the same actions.

So, I will explain in detail about this at “Tool bar” section.

Options:

Options dialog box can be launched by clicking Options->Options… on the menu bar.

We can configure various settings of Selenium IDE.

The below diagram shows the various options present in the Selenium IDE.

Some of the important options are as below:

Default Timeout Value: Default timeout value is 30000ms. It is the time that Selenium IDE has

to wait for a certain element to appear in a webpage before it generates an error.

Remember base URL: If you want Selenium IDE to remember the Base URL every time you

launch it then keep this option as checked. If you uncheck this, Selenium IDE will always launch

with a blank value for the Base URL.

Clipboard Format:

Clipboard Format allows us to copy a command from the editor and paste it as a code snippet as

explained in the below figure:

For example, when you choose Java/JUnit 4/Remote Control as your clipboard format, every Selenese command you copy from Selenium IDE’s editor will be pasted as Java code.

Base URL: (Referred from http://docs.seleniumhq.org/)

The Base URL field at the top of the Selenium-IDE window is very useful for allowing test cases to be run across different domains.

For example, Suppose that a site named http://news.portal.com had a beta site named

http://beta.news.portal.com.

Any test cases for these sites that begin with an open statement should specify a relative URL as 

the argument to open rather than an absolute URL (one starting with a protocol such as http: or https :).

Selenium-IDE will then create an absolute URL by appending the open command’s argument onto the end of the value of Base URL. 

For example, the test case below would be run against

http://news.portal.com/about.html:

This same test case with a modified Base URL setting would be run against

http://beta.news.portal.com/about.html

Tool bar:

The tool bar contains buttons for controlling the execution of your test cases, including a step feature for debugging your test cases.

The right-most button, the one with the red-dot, is the record button.

Selenium IDE Features

Features of Selenium IDE

The below diagram explains the various features of Selenium – IDE:

Menu bar
Base URL
Tool bar
Test Case Pane
Test Case Editor
Log /Stored-Vars /Reference /Expert /UI-Element /Rollup.

Remember:
Learning Selenium IDE is a must. Once we are aware about using the tool then we can write scripting either in Selenium RC or WebDriver.
Before that, we need to know the usage and features of Selenium IDE.

So, let us start with the features of Selenium IDE.

Let us discuss about each feature of Selenium IDE in detail

Menu Bar:

The Menu bar has the following tabs as in below figure:

File:

The File menu contains options to create, open, save, and close tests.

“Export” option allows us to convert Selenium IDE test cases into file formats that can run on Selenium

“Export Test Case As” exports only the currently opened test case to source code.

“Export Test Suite As” exports all the test cases in the currently opened test suite to source code.

By Selenium IDE, test cases can be exported only to the following formats:

.rb (Ruby source code)
.cs (C# source code)
.java (Java source code)

.py (Python source code)

Now Selenium IDE supports Perl and PHP formats also.

Selenium IDE installation and configuration

Selenium IDE Installation 

Let me explain you how to install Selenium IDE before working on it.

Step 1: Open Mozilla Firefox browser and navigate to the below link to download the IDE
http://docs.seleniumhq.org/download/
Step 2: Now refer to the Selenium IDE section and click on the download link that is provided.
Step 3: Once you clicked on the link, a popup appears as in below figure.

Step 4: Now click on the “Allow” button.
Step 5: Again a pop up will appear, as seen in the next screenshot. Click on “Install Now” button once it is
active.

Step 6: Once the installation process is complete, it will ask you to restart Firefox. Click on the Restart button. Firefox will close and then reopens.

Step 7: After Firefox has restarted, we can launch Selenium IDE using either of the following three ways:

         By using Ctrl+Alt+S     -- Keyboard Short cut

         By clicking on the Firefox menu button Web Developer Selenium IDE

By Clicking on the Selenium icon which will available on top right corner of the browser as shown below

Step 8: Selenium IDE should launch as shown below

Selenium RC, Webdriver and GRID overview

Selenium Remote Control (Selenium RC)

You should use Selenium RC, if you want to -

Run your test in different browsers on different operating systems.To write automated tests for a web application in any programming language.

What is Selenium RC?

Selenium RC is a test tool that allows the users/testers to write automated test cases/scripts in any programming language against any website using any JavaScript-enabled browser.

Selenium RC can support the following programming languages:
 Java
 C#
 PHP
 Python
 Perl
 Ruby

Advantages:

Execution is faster than Selenium IDE.
Supports multiple browsers like Google Chrome, Mozilla Firefox, Internet Explorer, etc.
Can use control and looping statements.
Supports data-driven testing.

Disadvantages:

RC disables the the javascript in the browser and injects it own while running the scripts on browsers
Execution time is slower than WebDriver.
Installing/Configuring RC is complicated than IDE.
Selenium RC Server is necessary to be running before executing the script.

Selenium WebDriver

You should use WebDriver, if you want to -

Use a particular programming language in automating/designing your test case.
Test the AJAX-based application that is rich in functionalities.
Execute tests on the HtmlUnitDriver browser.
Create customized test results.

What is WebDriver?

WebDriver is designed to address some of the limitations in the Selenium IDE and Selenium-RC like the file upload or download, pop-ups and dialogues barrier.
It drives the browser much more effectively.
It uses internal native browser javascript to drive the tests
It is a complete Object Oriented API when compared to Selenium 1.0/Selenium RC.

Advantages:

Faster Execution than Selenium IDE & Selenium RC
Communicates directly to the browser
Supports multiple browsers like Google Chrome, Mozilla Firefox, Internet Explorer, etc which
stabled or old versions
Can use control and looping statements
Supports data-driven testing

Disadvantages:

Cannot support new browsers or new browser versions
No built-in mechanism for generating test results/reports
Can't support to run the scripts on the multiple platforms

Selenium-Grid

Selenium-Grid allows us to run multiple tests at the same time on different platforms against
different browsers in parallel.
It saves time enormously when we are testing a web application.
It utilizes the hub-and-nodes concept.

Pros and Cons of Selenium IDE

Advantages and disadvantages of Selenium IDE

PROS
Easy to install and use
Supports record and playback options
Can convert the recorded script into any programming language like Java, C#, Perl etc
Create own commands in javascript and import as user extensions
Recorded testcases can be played as testsuite

CONS
Supports only Mozilla Firefox browser
No flexibility in custom testcase execution
Control statements and loops are not supported
Externally test-data cannot be taken into the current execution script
Unable to generate detailed reports
Doesn't support connecting to a database
Doesn't support desktop windows or alerts

About Selenium

Message to Beginners

Selenium is a Test Automation tool for Web Applications. This means we can automate the manual test cases.
If you are new to Selenium and do not have programming knowledge, then do not worry. Learning Selenium is very easy.
Once you are good at using the tool and configuring the software then you can concentrate on programming.

What are essential for programming with Selenium?

1. Selenium supports multiple programming languages like JAVA, C#, Ruby, Python, Perl etc.
2. Whatever programming language you prefer, it is better to learn and develop programming logic and debugging skills.
3. Debugging helps in finding out the root cause of the issues with the program which helps a tester in improving the programming skills.
4. The following are the minimum concepts that are essential in Java:
i) Data types, looping, controls statements.
ii) OOPS (Object Oriented Programming System) Concepts, Strings, Collection Types like List

If you just want to do Record and Play back the scenarios, you can opt for Selenium IDE.
However, for programming with Selenium we use Selenium RC and Web Driver, where the programming
knowledge is needed.

What is Selenium?
Selenium is a set of tools to automate Web Applications. 
It is Open Source and supports many browsers namely Google Chrome, Mozilla Firefox, IE, etc.
Supports many Programming languages like Groovy, Java, PHP, Ruby, Python, Perl etc.

Components of Selenium