Thursday, 11 June 2015

Selenium - Types Of Locators

In this post, lets discuss about various types of Locators available to locate Web Page Elements.
This is the most crucial part of automation since we start automating after locating required elements on the Web Page !!

Before trying out any of the examples below, make sure that you have JAVA and Eclipse installed on your machine.
Also download Selenium JARS (Click here)

Different Types of Locators include :

  • ID
  • Class Name
  • CSS
  • LinkText
  • Tag Name
  • Xpath
  • Name

These are the different methods used to locate Web Page elements.
Lets discuss each of them.

1 - Locating By ID :
          This is the first type of locator that we must use to locate an element (if ID of the required element exist). Since IDs are unique, we can find the required element easily by specifying its ID.
          <input id = "email" class = "required" type = "text" />
WebElement element = driver.findElement("email"));

If there is no ID for some particular desired element than we have to use other methods of locating elements.

2 - Locating By Class Name :
          Since multiple elements can belong to the same class, we have to ensure that the required element is located when using this method of locating elements. This is mostly used in conjunction with CSS for locating the right element. By default, it will return the first match it finds on the page.
          <input id = "email" class = "required" type = "text" />
WebElement element = driver.findElement(By.className("required"));

In this example, it finds the above tag but on actual sites you have to make sure that right element is found.

3 - Locating By CSS :
          This makes use of the DOM structure of the page and includes various combinations of other locators. Hence we will discuss about CSS method of locating elements in the next post.

4 - Locating By LinkText :
          This is used only when we want to find an element which is a link. We find it using the text of the link.
Example :
          <a href = ""> Google </a>
Webelement element = driver.findElement(By.linkText("Google"));

This way we can find the link that is displayed with the required text that we want to find. The element is found only when the link with desired text is present on the page.

5 - Locating By Tag Name :
          Another way of locating element is by using the tag name of the element. But like class names, we can have the same tag appear multiple times on the page. So care must be taken while using this approach.
Example :
          <p> This is a para </p>
WebElement element = driver.findElement(By.tagName("p"));

Again, make sure that the right element is found.

6 - Locating By Name :
          This makes use of the name attribute of the element to be found.
Example :
          <div id="pancakes">
                <button type="button" name="pancake" value="Blueberry">Blueberry</button>
                <button type="button" name="pancake" value="Banana">Banana</button>
                <button type="button" name="pancake" value="Strawberry">Strawberry</button>
WebElement element = driver.findElement("pancake"));

7 - Locating By Xpath :
          It is useful in case of cross browser testing since different browsers render CSS in different ways, hence using CSS selectors to locate elements would behave differently on different browsers.
To find Xpath - Right Click on the element and select "Copy Xpath".

To conclude, we have seen different types of locators that can be used to locate elements on a web page. The best way is to use ID or name of the element if they exist.

Will discuss about setting up of the project in Eclipse (integrating Selenium JARS) and CSS Selectors method of locating element in the upcoming post.
Happy Learning.

YouTube Channel : Click Here

Friday, 5 June 2015

Selenium IDE

Since this is the most basic tool in Selenium, we will see how it can be utilized to accomplish our automation tasks.
Anyone with or without any Programming Background can automate Web based applications using Selenium-IDE. It is a firefox add-on and you can install it easily from here.

This is how Selenium IDE looks like :

Selenium IDE provides different features such as Record and Playback, running single/multiple commands, running single/multiple Test Cases at a time, control the speed of execution of Test Cases, etc.

Lets have a look on different components of Selenium IDE :

  • Menu Bar - It contains various options such as creating/saving Test Cases/Test Suites, export to a particular language, insert/delete a command, saving in a particualar format, etc.
  • Base URL - This is where your test URL goes (the page that you are going to test).
  • Toolbar - It contains various components that helps in controlling the execution of Test Cases, running single Test Case or entire Test Suite, pause option, etc.
  • Test Case Pane - All the test cases are displayed in this section. Also displays the number of passed and failed Test Cases.
  • Editor - This is the section where all the commands, values and targets are entered automatically as we go through the page.

Some of the important Selenium IDE commands :
  • open - opens URL on current Web Browser instance
  • openWindow - opens URL on new Web Browser instance
  • click - clicks on an element
  • clickAndWait - clicks and wait for the page to load
  • store - used to store user defined values in a variable
  • echo - used to print data in Selenium IDE log section
  • storeText - used to store data from Web page in a variable
  • type - types a sequence of characters
  • verifyTitle - compares actual page title with expected page title
  • verifyText - compares the expected and actual values
  • verifyTextPresent - verifies presence of text on the page
  • verifyElementPresent - verifies presence of an element
  • assertText - compares the expected and actual values 
  • waitForPageToLoad - waits for the page to load
  • waitForElementPresent - waits for an element to be present
  • pause - pauses the execution of Test Script
  • refresh - refreshes the Web Page
  • storeLocation - stores the URL of a Web Page in a variable
  • storeTitle - stores title of a Web Page in a variable

The difference between "verify" and "assert" is :
Verify - The Test Case Execution continues even if the command fails.
Assert - The Test Case Execution stops if the command fails.

By default, Record button (small red circle on top right) is "on", hence the actions on web page are recorded automatically.
Most of the testers or developers use Selenium IDE to locate Web Elements. One can simply copy the identifier (using one of the identifying methods to be discussed) in "Target" field provided and click on "Find" to identify Web Element. If the required element is highlighted on the Web page, we can use the locator in "Target" field for that element in our Automation Script.

We will discuss about Selenium Webdriver and different types of locators(locating techniques) in the upcoming posts.
Happy Learning.

YouTube Channel : Click Here

References :