Locators in Selenium | Types of Locators

In this tutorial, we will know about locators in Selenium. Locators help us to find the elements on the web page using WebDriver API.

When we are working with WebDriver on a web application, we will require to find elements on the web page.

All the methods present in the Selenium WebDriver search the element first to perform the actions on the web application such as clicking, selecting, typing, etc.

The locating an element is one of the most important tasks in the selenium tests but there is no fixed strategy that you can follow to find an element uniquely. It totally depends on the user ideas and their comfort level in locating the web elements.

So, let’s start to know about selenium locators in detail. The interviewer can ask one question related to this topic in interview, especially for freshers. 

Locators in Selenium

Locator in selenium is like an address that is used to identify the web element uniquely within the web page. The basic use of locators is to identify the element or object on the webpage accurately.

Selenium WebDriver uses the element locators to interact with elements present in a web page. All the elements that are present on a web page are called Web elements which can be located using any kind of locator type.

For example, you can see the view of HTML code written for the web element “Username” in the Facebook login page in the below figure.
Locators in Selenium

Selenium WebDriver uses the “findElement(By.locator())” method to find a web element on a web page. This method search for an element based on the criteria given to it. If a matching element is found, it will return a web element object.

If method is not able to find any matching element with search criteria then it will throw NoSuchElementException exception.

Selenium also provides to use “findElements(By.locator())” method to find multiple elements on the web page. This method will search and return a list of WebElement objects that match with the search criteria.

Types of Locators in Selenium WebDriver

Selenium WebDriver uses 8 types of locators to locate an element on the web page. They are as follows:

1. ID Locator

Id locator is the safest and fastest locator to locate an element based on the value of “ID” attribute on a web page. It is the most efficient and preferred way to find a web element.

Since Id is unique for each element on the web page so it can be easily identified. It is always the first choice for the testers. It is mostly account number or college name that will be unique. 

The following is the syntax to use locator type.
       WebElement element = driver.findElement(By.locatorType(“Attribute value”));

     driver ➨ Object reference variable of the WebDriver object.
     WebElement ➨ Return type of the findElement() method.
     element ➨ Variable used to store the returning web element.
     By ➨ By is a class which extends java.lang.Object. It provides a mechanism which is used to locate elements within a document.

For example:

   WebElement element = driver.findElement(By.id("college name")); 
// The above code can also be written directly as 
   driver.findElement(By.id("college name")); // Here. college name is attribute value.

Unfortunately, you will get in many cases where an element does not have a unique id. In this case, you will have to choose an alternative locator to find the element on the web page.

2. Name Locator

Name locator is the second safest and fastest locator to locate an element based on the value of “name” attribute on the web page. The name cannot be unique for each element all times.

If there are multiple elements with the same name on a web page then Selenium will always perform the action on the first matching element. It has the following syntax to use name locator.
        WebElement element = driver.findElement(By.name(“Attribute value”));

For example:
< input name="firstname" class="required" type="text"/>
 WebElement register = driver.findElement(By.name("firstname")); // firstname is attribute value.

3. ClassName Locator

Class Name locator finds an element based on the value of “class” attribute on the web page. The syntax is like this:
         WebElement element = driver.findElement(By.className(“Attribute value”));

For example:

WebElement paper = driver.findElement(By.className("sample")); // Here, the attribute value is sample and paper is variable used to store returning value.

4. TagName Locator

TagName locator is used to finding an element from the group elements like check boxes, drop-downs etc. It locates an element by its tag name.
        WebElement element = driver.findElement(By.tagName(“Attribute value”));

For example:

WebElement element = driver.findElement(By.tagName("div")); // Here, div is the attribute value of tagName.

5. LinkText Locator

This locator finds an element by the link text. If there is one unique element on the web page, you can easily find an element with the link text. But if there are multiple links with the same link text such as repeated header and footer on the web page.

In such case, selenium will select the first matching element with the link. It has the following syntax to declare:
         WebElement linktext = driver.findElement(By.linkText(“Atrribute value”));

For example:

<a href="https://www.seleniumhq.org>Download</a> // Here, Download is link text. 
WebElement download = driver.findElement(By.linkText("Download"));

6. Partial LinkText Locator

This locator locates an element by a partial match of its link text. It works in the same way as of link text. The syntax is given below.
        WebElement partialLinktext = driver.findElement(By.partialLinkText(“Attribute value”));

For example:

< a href="https://www.seleniumhq.org">Download Selenium Server</a> 
WebElement download = driver.findElement(By.partialLinkText("Download"));

7. CSS Selector Locator

This locator finds an element by the CSS selector on the web page. CSS selector makes the execution of test scripts faster as compared to XPath locator. It is the best way to find an element on the web page. The CSS stands for Cascading Style Sheets.
        WebElement element = driver.findElement(By.cssSelector(“Attribute value”));

For example:

WebElement element=driver.findElement(By.cssSelector("input#email"));You can check for W3C CSS Locators here.

8. XPath Locator

XPath stands for XML (Extensible Markup Language) Path language. It is a query language which is used to search and select the node in an XML document. All the major web browser support XPath. 

Selenium web driver supports XPath to find the location of any element on a web page using XML path expression. XPath produce reliable locator but the performance of XPath is slower than CSS selector.

Syntax for XPath:
The path of the element at the webpage is selected by XML path syntax. The standard syntax for creating XPath is shown below:
          XPath = //tagname[@attribute = ‘value’]
     //  ➨ It selects the current node.
    Tagname ➨ It is the name of the tag of a particular node. For example, input.
    @ ➨ It selects attribute like id, name, className etc.
    Attribute ➨ Name of the node. For example, type, class, name, id etc.
    Value ➨ value of the attribute.

For example:

XPath = //input[@id='user-message'] 
WebElement username = driver.findElement(By.xpath("//input[@id='user-message']"));

Types of XPath in Selenium

There are two types of XPath. They are:

1. Absolute XPath

➲ It is the easiest way to find the element but if any changes are made in the path of the element then this XPath gets failed. So, This is the main disadvantage of absolute XPath.

➲ It begins with a single forward slash (/) which selects the element from the root HTML node. The example of an absolute XPath expression of the element is given below:

Absolute XPath = /html/body/div/div/form/input
WebElement userName = driver.findElement(By.xapth("/html/body/div/div/form/input"));

2. Relative XPath

➲ It starts from the double forward slash(//) and selects the element from anywhere on the webpage.

➲ It is the best practice to find an element through a relative XPath and helps us to reduce the chance of “element not found exception”.

➲ With a relative XPath, we can locate an element directly irrespective of its location in the DOM. The example of relative XPath is given below:

Relative XPath = //input[@class='social-media'] 
WebElement username = driver.findElement(By.xpath("//input[@class='social-media']"));

Key points: 
The priority of locator type in this order: id > name > css > xpath.

Learn XPath in an easy way and step by step:
XPath Tutoial in Selenium WebDriverFinal words 
Hope that this tutorial has covered almost all the important points related to Locators in Selenium with examples. I hope that you will have understood this topic and enjoyed them. Keep in mind the priority of locators type.
Thanking you for reading!!!
Next ⇒ How to find XPath in Chrome browser⇐ PrevNext ⇒

Leave a Comment