Chapter 2:Selenium locator types

What is Locator?

The locator can be defined as an address that identifies a web element uniquely within the web-page. Locators are the HTML properties of a web element which tells the Selenium about the web element it needs to perform the action on.

There is a diverse range of web elements. The most common amongst them are:

  • Button
  • Drop Down
  • Text Box
  • Check Box
  • Radio Button
  • Hyperlink

Types of Locators

Identifying above elements has always been a very tricky subject and thus it requires an accurate and effective approach. Thereby, we can assert that more effective the locator, more stable will be the automation script. Basically every Selenium command requires locators to find the web elements. Hence, to identify these web elements accurately and precisely we have different types of locators.

Using ID as a Locator

The best and the most popular method to identify web element is to use ID. The ID of each element is supposed to be unique.

In this sample, we would access “Email” text box present in the login form at gmail.com.

Finding an ID of a web element using Chrome

Step 1: Launch the web browser (chrome) and navigate to “https://accounts.google.com/”.

Step 2:Right Click on the mouse to inspect the web element.

Step 3: Hover on the web element (Email text box in our case) on which we desire to perform some action.

Step 4: Be aware about the ID attribute and take a note of it. Now we need to verify if the ID identified is able to find the element uniquely and flawlessly.

Syntax: id = id of the element

In our case, the id is “identifierId”.

Using Class Name as a Locator

There is only a perceptive difference between using ID as a locator and using the class name as a locator.

In this sample, we would access “Password” textbox present at the facebook login form page at facebook.com.

Finding a classname of a web element using Chrome

Step 1: Locate/inspect the web element (“Password”Textbox in our case) by right-clicking on the web element whose locator value we need to inspect and clicking on the option “Inspect Element”.

Step 2: Be aware about the class name attribute and take a note of it. Now we need to verify if the class name inputtext is able to find the element uniquely and accurately.

Syntax: class = classname of the element

In our case, the classname is “inputtext”

Using name as a Locator

Locating a web element using the name is very much analogous to previous two locator types. The only difference lies in the syntax.

In this sample, we would access “Password” text box present in the login form at facebook.com.

Syntax: name = name of the element

In our case, the name is “Pass”.

Using Link Text as a Locator

All the hyperlinks on a web page can be identified using Link Text. The links on a web page can be observed with the help of anchor tag (<a>). The anchor tag is used to create the hyperlinks on a web page and the text between the opening and closing of anchor tags constitutes the link text (<a>Some Text</a>).

In this sample, we would access “Admission” link present at the pune university website at unipune.ac.in

Finding a link text of a web element

Step 1: Locate/inspect the web element (“Admission” link in our case) by right-clicking on the web element whose locator value we need to inspect and clicking on the option “Inspect Element”.

Step 2: Be aware about the text present within the <a> </a> tags and take a note of it. Hence this text will be used to identify the link on a web page uniquely.

linktext=driver.findElement(by.LinkText(“Admissions”));

Using X Path as a Locator

X path is used to locate a web element based on its XML path. XML stands for Extensible Markup Language and is used to store, organize and transport absolute data. It stores data in a key-value pair which is very much similar to HTML tags. Both being the markup languages and since they fall under the same union, x path can be used to locate HTML elements.

The key behind locating elements using X path is the traversing between various elements across the entire page and thus enabling a user to find an element with the reference of another element.

X path can be created in two ways:

Relative X path

Relative X path begins from the current location and is prefixed with a “//”.

For example: //span[@class=’Email’]

Absolute Xpath

Absolute Xpath begins with a root path and is prefixed with a “/”.

For example: /HTML/body/div/div[@id=’Email’]

Important Points:

  • The success rate of finding an element using Xpath is too high. Along with the previous statement, Xpath can find relatively all the elements on a web page. Thus, Xpaths can be used to locate elements having no id, class or name.
  • Creating a valid Xpath is a tricky and complex process. There are plug-ins available to generate Xpath but most of the times, the generated Xpaths fails to identify the web element correctly.
  • While creating xpath, the user should be aware of the various nomenclatures and protocols.
  • We can directly access the xpath using following tools

 chropath for chrome browser and firebug for Firefox browser can automatically generate XPath locators.

 In the following example, we will access textbox that cannot possibly be accessed through the methods we discussed earlier.

Xpath of above web element =input[@id=’u_0_p’]