Types of Locators to locate the elements

First of all lets understand why do we need to find an element in Selenium??

We know that we use Selenium mostly for UI testing of a web-based application. Since we need to perform automatic feature interaction with the web page, we need to locate web elements so that we can trigger some JAVASCRIPT events on web elements like click, select, enter, etc. or add/ update values in the text fields. To perform these activities it is important to first locate the element on the web page and then perform all these actions.

For Example, suppose given an website "Mission Humane" ,we need to click on "I need Information" .

So before implementing the code for the say click event on this button, we will have to first find this element on the web page. So, how we are going to find the element so that we can carry on with our actions?

We will use two methods 'findElement' and 'findElements' provided by Selenium WebDriver for this purpose. Now let us go ahead and understand the details of these methods.

findElement() in Selenium

The findElement() method of the Selenium WebDriver finds a unique web element within the webpage.

It’s syntax looks like below:

WebElement elementName = driver.findElement
                  (By.LocatorStrategy("LocatorValue"));

As shown in the above syntax, this command accepts the "By " object as the argument and returns a WebElement object.

The "By" is a locator or query object and accepts the locator specifier or strategies we discussed above. So if we write the line "driver.findElement( By.)" then the Eclipse IntelliSense will give the following locator strategies that we can associate with By object.

How to find an element using the attribute "id" in Selenium?

Using "id " to find an element is by far the most common strategy used to find an element. Suppose if the webpage uses dynamically generated ids, then this strategy returns the first web element that matches the id.

This strategy is preferred as most web pages are designed by associating ids with the elements. This is because using IDs is the easiest and quickest way to locate elements because of its simplicity while coding a web page. The value of the id attribute is a String type parameter.

The general syntax of findElement() command using By id strategy is :

WebElement element = driver.findElement(By.id("Element_Id"));

How to find an element using the attribute "name" in Selenium?

This strategy is the same as id except that the locator locates an element using the "name" instead of "id ".

The value of the NAME attribute accepted is of type String. The general syntax of the findElement() method with By Name strategy is as below.

WebElement element = driver.findElement(By.name("Element_NAME"));

How to find an element using the attribute "class name" in Selenium?

Here the value of the "class" attribute is passed as the locator. This strategy is mostly used to find multiple elements that use similar CSS classes.

The locator strategy 'By Class Name' finds the elements on the web page based on the CLASS attribute value. The strategy accepts a parameter of type String. The general syntax with the Class name strategy is given by:

List<WebElement> webList = driver.findElements(By.className(<Element_CLASSNAME>));

or

WebElement element = driver.findElement(By.className(<Element_CLASSNAME>));

How to find an element using the attribute "HTML tag name" in Selenium?

The Tag Name strategy uses an HTML tag name to locate the element. We use this approach rarely and we use it only when we are not able to find elements using any other strategies.

The value of the TAG attribute is a String type parameter. The syntax of the findElement() method using this strategy is as below.

WebElement element = driver.findElement(By.tagName(“Element_TAGNAME");

How to find an element using the "CSS Selector" in Selenium?

We can also use the CSS Selector strategy as an argument to By object when finding the element. Since CSS Selector has native browser support, sometimes the CSS Selector strategy is faster than the XPath strategy.

The CSS Selector for the above input field is #firstName. So the corresponding command to find element by CSS Selector is:

WebElement inputElem = driver.findElement(By.cssSelector("input[id = 'firstName']"));

How to find an element using the "XPath" in Selenium?

This strategy is the most popular one for finding elements. Using this strategy we navigate through the structure of the HTML or XML documents.

This strategy accepts a String type parameter, XPath Expression. The general syntax of using this strategy is as given below:

WebElement element = driver.findElement(By.xpath(“ElementXPathExpression"));

The XPath for the above button element is [@id="submit"]. Please refer How To Inspect Elements using Web Inspector for more information. So we use it in the findElement() command as below:

WebElement buttonLogin = driver.findElement(By.xpath("//button[@id = 'submit']"));

How to find an element using the "Link Text/Partial Link Text" in Selenium?

This strategy finds links within the webpage. It specially finds elements having links. This means we can use this strategy to find elements of "a " (links) tags that have matching link names or partial link names.

The strategy accepts the value of the LINKTEXT attribute as a String type parameter.

The syntax of findElement using this strategy is as seen below.

WebElement element = driver.findElement(By.linkText(“Element LinkText"));

The above syntax is for finding elements using full link text. This is used when we know the link text that is used within the anchor (a) tag.

We can also use the partial link and find elements. Following is the syntax:

WebElement elem = driver.findElement(By.partialLinkText(“ElementLinkText”));

When By.linkText is specified, the 'findElement' matches the entire linkText specified. It matches the partial text when By.partialLinkText is specified.

Hopefully you like this post and find it informative !!