Social Blog XPath Selenium
May 28, 2020

6 Ways to Use XPath in Selenium WebDriver

Automation
Continuous Testing

In Selenium automation, if the elements are not found by the general locators like ID, class, name, etc., then XPath is used to find an element on the web page.

In this tutorial, you will learn about XPath in Selenium and different XPath expressions to find complex or dynamic elements whose attributes changes dynamically on refresh of any operations.

Keep reading to learn about XPath, the different types of XPath, and six ways of writing XPath in Selenium.

What Is XPath in Selenium?

XPath in Selenium is a way to navigate the structure of a webpage’s HTML. XPath is a syntax for finding elements on web pages. Using UXPath in Selenium helps find elements that are not found by locators such as ID, class, or name. XPath in Selenium can be used on both HTML and XML.

What Is XPath?

XPath is defined as XML path. It is a syntax or language for finding any element on the web page using the XML path expression. XPath is used to find the location of any element on a webpage using HTML DOM structure.

The basic format of XPath is explained below.

Syntax for XPath

XPath contains the path of the element situated on the web page. Standard syntax for creating XPath is as follows:

XPath=//tagname[@attribute='value']

  • // : Select current node.
  • Tagname: Tagname of the particular node.
  • @: Select attribute.
  • Attribute: Attribute name of the node.
  • Value: Value of the attribute.

Free Download: Mobile & Web Test Coverage Index

 

Types of XPath Locators

To find the element on web pages accurately, there are a number of different types of locators.

XPath LocatorsFind different elements on a web page.
IDTo find the element by ID of the element.
ClassnameTo find the element by classname of the element.
NameTo find the element by name of the element.
Link TextTo find the element by text of the link.
XPathXPath required for finding the dynamic element and traverse between various 
elements of the web page.
CSS pathCSS path also locates elements having no name, class, or ID.

Types of XPath

There are two types of XPath:

  • Absolute XPath
  • Relative XPath

Absolute XPath

Absolute XPath is the direct way to find the element. But the disadvantage of the absolute XPath is that if there are any changes made in the path of the element then that XPath fails.

The key characteristic of XPath is that it begins with the single forward slash(/) ,which means you can select the element from the root node.
Below is an example of an absolute XPath expression of the element shown in the below screen.

Absolute XPath: /html/body/div[1]/div/div[2]/header/div/div[2]/a/img

Image XPath Selenium 1

Relative XPath

For Relative XPath, the path starts from the middle of the HTML DOM structure. It starts with the double forward slash (//), which means it can search the element anywhere at the webpage.

You can start from the middle of the HTML DOM structure with no need to write a long XPath.

Below is the example of a relative XPath expression of the same element shown in the below screen. This is the common format used to find elements through a relative XPath.

Relative XPath: //*[@id="block-perfecto-main-menu"]/ul/li[6]/a

Image XPath Selenium 2

Related Reading: What to Expect in the Latest Version of Selenium

6 Ways to Write Dynamic XPath in Selenium: A Tutorial

If you are testing with Selenium, these examples of writing XPath expressions will help your automation.

1. Basic XPath

XPath expression selects nodes or lists of nodes on the basis of attributes like ID, name, classname, etc. from the XML document as illustrated below.

XPath=//*[@name='username']

Here is a link to access the Perfecto login page.

Image XPath Selenium 3

Here are some more basic XPath expressions:

XPath=//input[@type='text']                
XPath=//input[@id='username’]
XPath=//input[@value='RESET']
XPath=//a[@href='http://perfecto.io/']

 

2. Contains()

Contains() is a method used in an XPath expression. It is used when the value of any attribute changes dynamically — for example, sign up information.

The contain feature has an ability to find the element with partial text as shown in the below example. In this example, we tried to identify the element by just using partial text value of the attribute. In the below XPath expression, partial value 'Name' is used.

Complete value of 'id' is 'FirstName' but using only partial value 'Name.'

XPath=//*[contains(@id,'Name')

In the above expression, we have taken the 'id' as an attribute and 'Name' as a partial value as shown in the below screenshot. This will find two elements (FirstName and LastName) as their 'id’ attribute ending with 'Name.'

Image XPath Selenium 4

 

3. Using OR & AND

In OR expression, two conditions are used, whether the first condition OR second condition should be true. It is also applicable if any one condition is true, or maybe both. This means that any one condition should be true to find the element.

In the below XPath expression, it identifies the elements whose single or both conditions are true.

XPath=//*[@id='FirstName' or @name='LastName']

Highlight both elements as ‘First Name’ element having attribute 'id' and ‘Last Name’ element having attribute 'name'.

Image XPath Selenium 5

In AND expression, two conditions are used. Both conditions should be true to find the element. It fails to find the element if any one condition is false.

XPath=//*[@id='FirstName' and @name='FirstName']

In the below expression, we highlight the 'First Name' element as it has both attributes 'id' and 'name.'

Image XPath Selenium 6

 

4. Starts-With Function

Starts-with function finds the element whose attribute value changes on refresh or any operation on the webpage. In this expression, match the starting text of the attribute used to find the element whose attribute changes dynamically. You can also find the element whose attribute value is static (does not change).

For example, suppose the ID of a particular element changes dynamically like:

Id=" message12"

Id=" message345"

Id=" message8769"

And so on. But the initial text is same. In this case, we use Start-with expression “message.”

In the below expression, there are two elements with a class starting with "form." So, XPath finds those elements whose 'class' is starting with 'form.'

XPath=//input[starts-with(@class,'form')]

Image XPath Selenium 7

 

5. Text()

In this expression, with text function, we find the element with the exact text match as shown below. In this case, we find the element with text "Username or email."

XPath=//*[text()='Username or email']                

Image XPath Selenium 8

 

6. Using Index:

This approach comes in use when you wish to specify a given tag name in terms of the index value you wish to locate. 

XPath=(//*[@attribute='value'])[index]

In the below expression, a DOM has multiple input tags for each different field value, and you wish to input text into the second field i.e. Last Name.

XPath=(//input[@type=”text”)[2]

Image XPath Selenium 9

 

Use These XPath in Selenium Tips With Perfecto

Scale Selenium test automation in the cloud with Perfecto. Perfecto integrates seamlessly with Selenium, and every other tool in your toolchain. With Perfecto and Selenium, you can:

  • Execute web testing 50% faster than other vendors.
  • Enjoy the scalability of Selenium Grid from the cloud.
  • Scale your tests across VMs, real Macs, and multiple platforms.
  • Find and fix bugs quickly with advanced test reporting.
  • Integrate into your entire CI/CD toolchain.

Experience the world’s largest global testing cloud for web and mobile apps. Try Perfecto free for 14 days.

Try Perfecto

Related Content