There is a problem in using the locators mentioned in earlier articles, which is that many site will not have the locator you were planning to use and some site use alphanumeric as the locator value, these alphanumeric are dynamic and changes every few intervals this will make useless for a long run. There is a way to avoid this problem by using Xpath.

XPath also called as XML Path is a language to query XML documents. It is an important strategy to locate elements in Selenium. Xpath Query and Scripts are written to locate elements in Webpage.

Xpath and CSS are the most stable selector which are used even in Industry as they are reliable locator. You can create your own Xpath and can also customize it. For an element you can have more than one Xpath.

All the popular browser have an inbuilt Xpath and CSS engine, you can create your Xpath and validate them with your Browser's Developer mode.

Open the Developer tool's Inspect, select the element you want to listen and hover above the page source and right click to view the list of open then select the copy menu.

In the menu, click the copy Xpath. This will copy the Xpath to your clipboard.

We will so in-dept about the Xpath and CSS on our later article.

Absolute Xpath

Relavtive Xpath

Basic Xpath

Contains() Xpath

Using Logial operations - Xpath

Using Start-with function Xpath

Using Text Xpath

Selects all elements in the document of the current node( ) [ UserID input box is the current node] as shown in the below screen. Visit the following link https://www.crunchyroll.com/login

//*[@type='email']//following::input

There are 8 "input" nodes matching by using "following" axis- password, login and reset button. If you want to focus on any particular element then you can use the below XPath method:

//*[@type='email']//following::input[2]

You can change the XPath according to the requirement by putting [1],[2]…………and so on. With the input as '2', the below screen shot finds the particular node that is 'Password' input box element.

The ancestor axis selects all ancestors element (grandparent, parent, etc.) of the current node as shown in the below screen.

In the below expression, we are finding ancestors element of the current node("ENTERPRISE TESTING" node).

//*[@required='required']//ancestor::label

There are 5 "label" nodes matching by using "ancestor" axis. If you want to focus on any particular element then you can use the below XPath, where you change the number 1, 2 as per your requirement:

//*[@required='required']//ancestor::label[1]

You can change the XPath according to the requirement by putting [1], [2]…………and so on.

Selects all children elements of the current node as shown in the below screen(reference link https://www.crunchyroll.com/premium_pick_plan?membership=premium).

//*[@id='footer_menu']//child::li

There are 41"li" nodes matching by using "child" axis. If you want to focus on any particular element then you can use the below xpath:

//*[@id='footer_menu']//child::li[3]

You can change the xpath according to the requirement by putting [1],[2]…………and so on.

Preceding - Xpath axis

Following Sibling - Xpath axis

Parent - Xpath axis

Self - Xpath axis

Decendent - Xpath axis