How to locate element using Xpath in Selenium WebDriver?
Locating web element using XPath is much easier and mostly used locator in Selenium WebDriver, Because when we are unable locate element with any of the other locators, this is the last locator we can trust.
What is XPath?
XPath (XML Path Language) is a query language for selecting nodes from an XML document.
Why it is useful in Selenium?
As you must be knowing that HTML document or DOM is also hierarchical like XML. It consists of nodes with attribute and value pair. Using XPath, WebDriver can navigate through different nodes of the HTML document.
Types of XPath:
XPath of two types:
Absolute XPath: These types of XPath starts with Single slash “/”, XPath starts with root node of the HTML document. Not recommended as single change on WebPage will cause problem in locating WebElement.
Example: /html/body/div/input[@id=’loanamount’]
Relative XPath: These types of XPath starts with double slash “//”, does not start with root node.
XPath Syntax:
//tag[@attribute=’value’]
Xpath for Home Loan Amount text box: //input[@id=’loanamount’]
Note: You can use any attribute and value pair in XPath, which should uniquely identify the WebElement.
How to create XPath for text enclosed within html tags:
XPath Syntax:
//tag[text()=’value’]
Example:
<a href=”android-tutorial”>Android</a>
XPath: //a[text()=’android-tutorial’]
How to use axes methods in XPath, when using simple XPath, you are unable to locate WebElement?
Axes methods are used to jump to child, parent, sibling nodes when you are unable to locate element directly using simple XPath.
You can reach to nearly by element which you can identify uniquely then Axis method can be used to jump to required node.
XPath Syntax:
//tag[text()=’value’]//AxisMethodName::tagName[n]
First part of the syntax (till second //) can be used to reach to element which is nearby expected element and can be uniquely identifiable. In second part we are using axis name to jump to particular tag.
Most commonly used Axes methods while working with XPath: (Source: w3schools)
| Axis method Name | Result |
|---|---|
| ancestor | Selects all ancestors (parent, grandparent, etc.) of the current node |
| attribute | Selects all attributes of the current node |
| child | Selects all children of the current node |
| following | Selects everything in the document after the closing tag of the current node |
| following-sibling | Selects all siblings after the current node |
| parent | Selects the parent of the current node |
| preceding | Selects all nodes that appear before the current node in the document, except ancestors, attribute nodes and namespace nodes |
| preceding-sibling | Selects all siblings before the current node |
Example:
Let’s understand how we can use axis methods in real time, we will first find one unique element then we will navigate with respect that element.
XPath to find unique element: //a[text()=”Class Name”]
XPath to find parent element using axis method:
//a[text()=”Class Name”]//parent::li
XPath to find following sibling elements using axis method:
//a[text()=”Class Name”]//parent::li//following-sibling::li
Above XPath will select all the siblings of li, however if you want select specific sibling mention its number in “[” “]” square brackets.
//a[text()=”Class Name”]//parent::li//following-sibling::li[1]
I hope finding element using xpath is helpful for you. Try out different combinations and if you stuck anywhere please comment below.
Learn bit by bit!