XPath is used to navigate through elements and attributes in a tree-structured document (XML or HTML). Selenium commands use XPath as an element locator. XPath can be tested for matching results using developer tools in a browser.
Test any XPath for its match using Developer Tool (using Firefox/Firebug)
- Load a page in a browser and open the developer tool.
- Place valid XPath in the "evaluate function" field within the console tab.
Example:document.evaluate("XPath here", document, null, 7, null); - Hit Run to get results.
- Hover mouse over a result to see the corresponding element highlighted on the page.
Sample HTML document used for reference in path expression construction.
Selecting Elements
XPath uses path expressions to select elements (aka "nodes", not to be confused with Catchpoint's test nodes) in an XML/HTML document. The node is selected by following a path or steps. Some useful path expressions are listed below:
| Expression | Description | ||
|---|---|---|---|
| / | Selects matching elements contained in the specified node, starting from the root node. | ||
| Path Expression | Result | ||
| /HTML | Selects the root element HTML. | ||
| /HTML/body | Selects the body element that is child of HTML. | ||
| /HTML/body/div/form/input[1] | Selects the first input element inside the form. | ||
| // | Selects all matching nodes in the document no matter where they are in the tree. | ||
| Path Expression | Result | ||
| //button | Selects all button elements anywhere in the document. | ||
| //form | Selects all form elements no matter where they are in the document. | ||
| //input[@name='submit'] | Selects all input elements with name 'submit' no matter where they are in the document. | ||
| @ | Matches Attributes. | ||
| Path Expression | Result | ||
| //div[@class='one']/form | Selects form element inside a div with class='one'. | ||
| //form[@name='account'] | Selects form with name='account'. | ||
| //input[@id='fname'] | Selects input with id='fname'. | ||
| .. | Selects the parent of the current node. | ||
| Path Expression | Result | ||
| /html/body/.. | Selects the HTML element which is the parent of the body. | ||
| //body/.. | Selects the HTML element which is the parent of the body. | ||
| //input[@id='fname']/.. | Selects form element which is the parent of input with id=`fname`. | ||
| * | Wildcard - matches any node | ||
| Path Expression | Result | ||
| //* | Selects all elements in the document. | ||
| //form[@name='account']/* | Selects all the child nodes of the form element with name='account'. | ||
| //*[@name='account'] | Selects the form element with name='account'. | ||
| @* | Matches any node with at least one attribute. | ||
| Path Expression | Result | ||
| //select[@*] | Matches all select elements which have at least one attribute. | ||
| node() | Matches any node of any kind | ||
| Path Expression | Result | ||
| /HTML/node() | Selects the child nodes of HTML, in this case <head> and <body>. | ||
| //form/node()[last()] | Selects the last child element under form, in this case input with name=`submit`. | ||
| [ ... ] | Predicate - used to find a specific node or a node that contains a specific value. Predicates are always embedded in square brackets. | ||
| Path Expression | Result | ||
| //form/input[1] | Selects the first child input element under form. | ||
| //form/input[position()=2] | Selects second input element under form. | ||
| //a[text()='Sign In'] | Selects anchor tag whose inner text is exactly `Sign In`. | ||
| //a[contains(.,'Sign')] | Selects anchor tag whose inner text contains `Sign`. | ||