Xpath Introduce

XPath is a language that describes a way to locate and process items in Extensible Markup Language (XML) documents by using an addressing syntax based on a path through the document’s logical structure or hierarchy. XPath in used in Selenium to uniquely identify an element on a Webpage. The basic format of XPath is explained below with screen shot.

In there:

//: Select current node.

Tagname: Tagname of the particular node.

@: Select attribute.

Attribute: Attribute name of the node.

Value: Value of the attribute.

Finding xpath in Selenium WebDriver is so easy, using Firebug and FirePath

Firebug integrates with Firefox to put a wealth of web development tools at your fingertips while you browse. You can edit, debug, and monitor CSS, HTML, and JavaScript live in any web page.
FirePath is an extension to FireBug that adds a development tool to edit, inspect and generate XPath expressions and CSS3 Selectors ; And Firepath is an extension to Firebug, so you would only be able to install it after installing FireBug.

About install Firebug and FirePath, go to Google reseach for more detail.

Note

In FireFox latest version, FirePath tab not appearing. How to fix issue?

• Open firefox.
• Type "about:config" in the explorer.
• Click on the “I understand” button.
• Now in the search box enter "browser.tabs.remote.autostart.2" (without quotes) and hit enter.
• Set the value as false (you need to click the property to toggle the values).
• Close the firefox and open again.

Absolute Xpath

It is the direct way to find the element, but the disadvantage of the absolute XPath is that if there are any changes made in the path of the element then that XPath gets failed.

The key characteristic of XPath is that it begins with the single forward slash(/), which means you can select the element from the root node.

Eg: html/body/div[1]/section/div[1]/div/div/div/div[1]/div/div/div/div/div[3]/div[1]

Relative Xpath

For Relative Xpath the path starts from the middle of the HTML DOM structure. It starts with the double forward slash (//), which means it can search the element anywhere at the webpage. You can starts from the middle of the HTML DOM structure and no need to write long xpath.

Eg: //[@class='nf-label-control']//[text()='売上状況']

Note

Type command below in tab console to verify.

document.evaluate("//[@class='nf-label-control']//[text()='売上状況']",document,null,XPathResult.FIRST_ORDERED_NODE_TYPE,null).singleNodeValue.click();

Basic of Xpath

XPath expression select nodes or list of nodes on the basis of attributes like ID, Name, Classname …

Eg: Xpath = //*[@id='idHomePageNewItem']

Some more basic xpath expressions:

• Xpath=//input[@type='text']
• Xpath = //label[@id='Id']
• Xpath = //input[@value='Value']
• Xpath=//*[@class='Class name']
• Xpath=//a[@href='URL']

Eg:

• Xpath = //div[@id='sideNavBox']//a[.='02.申請担当者別']
• Xpath = (//input[@value='2.条件付承認'])[1]
• Xpath = //div[@data-controlname='担当営業部課']//textarea
• Xpath = //li[@role='presentation'][1]
• Xpath=//a[@href='https://www.google.com']

Contains()

Contains() is a method used in XPath expression. It is used when the value of any attribute changes dynamically. The contain feature has an ability to find the element with partial text.

Eg: Xpath = //*[contains(text(),'製番管理台帳')]

Using OR & AND

In OR expression, two conditions are used, whether 1st condition OR 2nd condition should be true. It is also applicable if any one condition is true or maybe both. Means any one condition should be true to find the element.

Eg: Xpath = //input[@type='submit' or @value='保存']

In AND expression, two conditions are used, both conditions should be true to find the element. It fails to find element if any one condition is false.

Eg: Xpath = //input[@type='submit' AND @value='保存']

Start-with function

Start-with function finds the element whose attribute value changes on refresh or any operation on the webpage. In this expression, match the starting text of the attribute is used to find the element whose attribute changes dynamically. You can also find the element whose attribute value is static (not changes).

Eg: Xpath = //div[starts-with(@id,'sideNavBox')]

Text(): In this expression, with text function, we find the element with exact text match as shown below.

Following: Selects all elements in the document of the current node( ).

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

Child : Selects all children elements of the current node.

Preceding: Select all nodes that come before the current node.

Following-sibling: Select the following siblings of the context node. Siblings are at the same level of the current node and It will find the element after the current node.

Parent: Selects the parent of the current node.

XPath is required to find an element on the web page as to do an operation on that particular element. There are two types of XPath:

• Absolute XPath
• Relative XPath

XPath Axes are the methods used to find dynamic elements, which otherwise not possible to find by normal XPath method. XPath expression select nodes or list of nodes on the basis of attributes like ID , Name, Classname, etc. from the XML document .