Xpath for Selenium Automation, The Only Xpath Guide you’ll need

XPath, often known as XML Path, is one of the most widely used locators in Selenium WebDriver for navigating around a page’s HTML structure. It may be used to locate any element in an HTML or XML document using the HTML DOM structure.

1. Basic Xpath

This is the common approach of writing the xpath in selenium which is the combination of a tag name and attribute value

Syntax : //tagname[@attribute = ’value’] or //[@attribute = ‘value’]

examples :

//input[@id=’vfb5']

//input[@value=’Female’]

//img[@alt=’picture1’]

//a[@href=’https://medium.com/ayomal/']

2. Using OR & AND

Syntax : //tagname[@attribute = ‘value’ or/and @attribute = ‘value’ ]

3. startswith() Method

This method is used when the value of any attribute changes dynamically at the end of its value (not the start). Transaction numbers, order numbers, etc., use such values.

example : Transaction_12XCF45

Here, the transaction part is static. But the next part is dynamically changed.

Syntax : //tagname[ startswith(@attribute, ‘value’) ]

example : //tagname[startswith (@id = ‘Transaction’) ]

4. contains() Method

The contains method has the ability to find an element where an attribute has a value with partial text, i.e., usually both the starting and ending parts of the value change.

example : 123ID_Transaction_999XFS

Here, the starting and ending parts are dynamic.

Syntax : //[contains( @attribute, ‘partial value’) ]

5. text() method

with text() function, we can find an element with exact text match

Syntax: //tagname[ text() = ’Value’ ]

examples:

//button[text() = ’Confirm Alert Box’ ]

//[text() = ’selenium automation’ ]

6. text() + contains() method

This method is used when we have a text defined in an HTML tag and want to identify an element via text .It can also be used for identifying dynamically changing attribute values. It is widely used for text validation or verification.

Syntax: //[contains( text(), ‘value’) ]

example : //[contains( text(), ‘Registration Form is Successfully Submitted’) ]

7. Xpath axes method

these xpaths axes methods are used to find the complex or dynamic elements

Following

selects all the elements in the document of the current node() and chooses the one as per your requirement by changing the number. NOTE: we will follow this method when we are unable to find the element using an unique value.

Syntax: //[@attribute=’value’]//following::tagname[number]

based on the specific value like title of text we can identify the following webElements.

example:

//[contains(text(), ’xpath tutorial’ )]//following::input[4]

//[contains(text(), ’xpath tutorial’ )]//following::select[1]

//[contains(text(), ’xpath tutorial’ )]//following::iframe[2]

following-sibling

In case of following-siblings, it can find all the following siblings of the context node that shares the same parent .

Syntax: //[@attribute=’value’]//followin-gsibling::tagName[number]

example:

//ul[@class=’classname’]//following-sibling::li[3]

//div[@class=’classname’]//following-sibling::div[5]

parent

selects the parent of the current node

Syntax: //[@attribute = ’value’ ]//parent::tagName[number]

example:

//ul[@class=’classname’]//parent::div[1]

child

selects all the children elements of the current node

Syntax: //[@attribute = ’value’]//child::tagName[number]

example:

//ul[@class = ‘classname’ ]//child::li[5]

preceding

this method select all nodes that come before the current node.

Syntax: //[@attribute = ’value’]//preceding::tagName[number]

example:

//input[@class = ‘classname’)]//preceding::li[3]

Ancestor

The ancestor axis selects all ancestors element(grandparent, parent, etc.) of the current node

Syntax: //contains[text() , ’value’]//ancestor::tagName[]

example: here we have 3 levels of ancestors for the element which contains “xpath tutorial” text

//[contains(text(), ‘xpath tutorial’)]//ancestor::div[1]

//[contains(text(), ‘xpath tutorial’)]//ancestor::div[2]

//[contains(text(), ‘xpath tutorial’)]//ancestor::div[3]

Descendant

This approach is used to locate element via Xpath for all the children and sub children of the current node.

Syntax: //[@attribute = ‘value’]//descendant::tagName[Number]

example: following xpath will select an image in the footer section

//[@class = ‘classname’]//descendant::img[1]