Elements on a web page can be located using XML expressions with Selenium’s XPath locator. Below is an example of the fundamental syntax for Selenium WebDriver’s use of XPath as a CSS locator:

‍

1 XPath: //tagname[@attribute = ‘value’]

‍

Here, the Selenium term TagName refers to the tag in the DOM structure that you are searching for in order to find the desired WebElement. TagName may refer to an anchor tag, input tag, etc.

The prefix “@” and its matching value serve to define attributes. As a result, TagName can be used with properties like Name, ID, Class, etc.

As demonstrated here, Selenium supports a variety of XPath usages.

1) Standard XPath

2) XPath Contains

3) XPath using ‘AND’ & ‘OR’

4)starts-with() method in XPath

‍5) XPath Text

‍

1) Standard XPath

As the name suggests, this is the simplest (or most typical) way to write an XPath. Let’s find the email element on the Facebook webpage to show how to use a typical XPath locator with Selenium.

‍

The element’s DOM structure is displayed below:

‍

The standard XPath of the desired WebElement is //input[@name= ’email’]. Here is how the XPath is used with the findElement() method to locate the element.

‍

2) XPath Contains

Similar to the CSS ‘contains’ selection, XPath contains works. It is frequently used on WebElements whose value is dynamically changing.

Think of a scenario where the login value is altered after the login text has been added. In this case, XPath contains will be quite beneficial in finding the appropriate WebElement.

Syntax:

‍

The element’s DOM structure is displayed below:

‍

Here is how the desired WebElement was located using the ‘XPath contains’ locator in Selenium:

‍

3) XPath using ‘AND’ & ‘OR’

When identifying a WebElement based on specific condition sets, Selenium uses the ‘AND’ & ‘OR’ operators in the XPath selector. Both conditions must be true for a “AND” condition to be true. However, the ‘OR’ XPath operator allows any of the two conditions to be true.

Syntax of OR operator in XPath:

‍

Syntax of AND operator in XPath:

Let’s locate the email login element on the Facebook homepage using the ‘AND’ & ‘OR’ operators.

‍

Below is the DOM structure of the element:

‍

Here is how we used the OR operator with XPath locator in Selenium:

‍

Here is how we used the AND operator with XPath locator in Selenium:

‍

4) starts-with() method in XPath

Functionalities similar to those of the CSS Selector in Selenium are available through the starts-with() technique in XPath. Finding elements that begin with a particular property value is made easier. XPath’s starts-with() technique is mostly used to find WebElements whose values change when a page is refreshed.

Syntax:

‍

Shown below is the DOM structure for locating the Password field on the Facebook login page:

‍

Below is the DOM structure of the element:

‍

Here is how we locate the Password element using the starts-with() method with XPath in Selenium:

‍

5) XPath Text

In Selenium, text in the XPath locator aids in finding WebElements using XPath and exact text matching. It can be used to locate elements by looking at the tags that contain specific text.

Syntax:

‍

To demonstrate XPath text usage, we locate the ‘FREE SIGN UP’ button on the Facebook Sign in page

Here is the DOM structure of the required WebElement:

‍

Here is how we locate the ‘Create New Account’ button element using the XPath text:

‍

Complex Selenium test automation scenarios may be executed using both CSS Selector and XPath. Even though I use XPath a lot, the decision between it and CSS Selector comes down to how complicated the case is and how easy it is for you to find WebElements using the appropriate location.

Always consider how maintainable the locators are while making a decision because it will make your job simpler! Using the appropriate locators in Selenium WebDriver, you may say you’ve “been there, done that” while planning your Selenium automated testing approach.

‍