How to write dynamic/ custom XPATH?

In this blogpost, we are going to learn how to write custom or dynamic Xpath expressions for locating an element uniquely.

We will learn the techniques of writing custom Xpath expressions on browser console tab.

Visit How to write/ check Xpath and CSS Selector expression in any browser? for understanding the method of writing Xpath expression in the browser.

Now that you have gone through above mentioned link, let us start exploring different techniques of writing Xpath.

Open this URL, and apply Xpath techniques mentioned below.

1. Using HTML attribute :

Syntax : $x(“//tagname[@attributeName=’attributeValue’]”)

Example : $x(“//select[@id=’cat’]”)

Xpath-technique-locating-by-arttribute

Explanation : The xpath expression tries to locate select tag with id attribute and its value set as cat.

2. Using HTML attribute and * wildcard :

Syntax : $x(“//*[@attributeName=’attributeValue’]”)

Example : $x(“//*[@type=’text’]”)

Xpath-technique-locating-by-arttribute-and-wildcard

Explanation : The xpath expression tries to locate any tag (element) with id attribute and its value set as cat. Since, we have used * instead of tag name, all the tags (elements) having ID attribute value as cat will be located using the expression.

3. Using multiple HTML attributes :

Syntax : $x(“//tagName[@attributeName1=’attributeValue1′][@attributeName2=’attributeValue2′]”)

Example : $x(“//input[@id=’s’][@class=’field’]”)

Xpath-technique-locating-by-multiple-attributes

Explanation : The xpath expression tries to locate input tag having id attribute with value set asand class attribute with value set as field.

4. Using multiple HTML attributes and * wildcard:

Syntax : $x(“//*[@attributeName1=’attributeValue1′][@attributeName2=’attributeValue2′]”)

Example : $x(“//*[@id=’s’][@class=’field’]”)

Xpath-technique-locating-by-multiple-attributes-wildcard

Explanation : The xpath expression tries to locate any tag (element) having id attribute with value set asand class attribute with value set as field.

5. Using text() function : 

Syntax : $x(“//tagname[text()=’visible text inside any element’]”)

Example1 : $x(“//li[text()=’Home’]”)

Xpath-technique-locating-by-text-function

Explanation : The xpath expression tries to locate anchor tag having the inner text equals to Home.

Example2 : $x(“//h1[text()=’Recent Posts’]”)

Xpath-technique-locating-by-text-function1

Explanation : The xpath expression tries to locate H1 tag having the inner text equals to Recent Posts within it.

6. Using contains() function : 

Syntax : $x(“//tagname[contains(@attributeName,’attributeValue’)]”)

Example : $x(“//div[contains(@class,’entry-meta’)]”)

Xpath-technique-locating-by-contains-function

Explanation : The xpath expression tries to locate div tags (elements), having class attribute and its value set as entry-meta.

7. Using text() function with contains() function : 

Syntax : $x(“//tagname[contains(text(),’matching text portion’)]”)

Example : $x(“//h2[contains(text(),’Selenium’)]”)

Xpath-technique-locating-by-contains-function

Explanation : The xpath expression tries to locate H2 tag (element), having Selenium within the inner text.

8. Using starts-with : 

Syntax : $x(“//tagName[starts-with(@attributeName,’attributeValue’)]”)

Example : $x(“//li[starts-with(@id,’menu-item’)]”)

Xpath-technique-locating-by-starts-with

Explanation : The xpath expression tries to locate li tag (element), having ID attribute, and the value of the same at least starts with menu-item.

9. Using attribute keyword : 

Syntax : $x(“//node/attribute::attributeName”)

Example : $x(“//li[@id=’menu-item-9′]/a/attribute::href”)

Xpath-technique-locating-by-attribute-keyword

Explanation : The xpath expression gets the value of HREF attribute of located node. We can get the value of ant HTML node directly from XPATH expression itself using attribute:: keyword.

10. Using following keyword with wildcard *: 

Syntax : $x(“//node/following::*”)

Example : $x(“//*[@id=’menu-item-8′]/following::*”)

Description : The technique is used to locate all the nodes present in document from a particular node.

Xpath-technique-locating-by-following-keyword

Explanation : The xpath expression gets the all the elements present in the DOM, from the element located using “//*[@id=’menu-item-8′]”.

11. Using following keyword with particular tagName :

Syntax : $x(“//node/following::tagName”)

Example : $x(“//*[@id=’menu-item-8′]/following::h1”)

Description : The technique is used to locate the particular type of nodes from a particular node.

Xpath-technique-locating-by-following-keyword2

Explanation : The xpath expression gets the all the H1 elements present in the DOM, from the element located using “//*[@id=’menu-item-8′]”.

12. Using following-sibling keyword with wildcard *: 

Syntax : $x(“//node/following-sibling::*”)

Example : $x(“//*[@class=’o2-app-header’]//following-sibling::*”)

Description : The technique is used to locate the sibling elements of a particular node.

Xpath-technique-locating-by-following-sibling-keyword2

Explanation : The xpath expression gets the all the sibling elements of the element located using “//*[@class=’o2-app-header’]”.

13. Using following-sibling keyword with particular tagName 

Syntax : $x(“//node/following-sibling::tagName”)

Example : $x(“//*[@class=’o2-app-header’]//following-sibling::a”)

Description : The technique is used to locate the particular type of sibling elements of a particular node.

Xpath-technique-locating-by-following-sibling-keyword

Explanation : The xpath expression gets the all the anchor tag sibling elements of the element located using “//*[@class=’o2-app-header’]”.

14. Using parent keyword with wildcard *: 

Syntax : $x(“//node/parent::*”)

Example : $x(“//*[@class=’o2-app-page-title’]/parent::*”)

Description : The technique is used to locate the immediate parent node of a particular element.

Xpath-technique-locating-by-parent-keyword

Explanation : The xpath expression returns the parent element of the element located using “//*[@class=’o2-app-page-title’]”.

15. Using parent keyword with particular tagName: 

Syntax : $x(“//node/parent::tagName”)

Example : $x(“//*[@class=’o2-app-page-title’]/parent::ul”)

Description : The technique is used to locate the particular type of immediate parent node of a particular element.

Xpath-technique-locating-by-parent-keyword2

Explanation : The xpath expression returns the UL tag parent element of the element located using “//*[@class=’o2-app-page-title’]”.

16. Using preceding keyword: 

Syntax : $x(“//node/preceding::*”)

Example : $x(“//body/preceding::*”)

Description : The technique is used to locate all the preceding elements of a particular element.

Xpath-technique-locating-by-preceding-keyword

Explanation : The xpath expression returns a;; the preceding elements from BODY tag.

17. Using preceding-sibling keyword: 

Syntax : $x(“//node/preceding-sibling::*”)

Example : $x(“//body/preceding-sibling::*”)

Description : The technique is used to locate all the preceding sibling elements of a particular element.

Xpath-technique-locating-by-preceding-sibling-keyword

Explanation : The xpath expression returns all the preceding sibling elements of BODY tag.

Advertisements

#custom-xpath, #dynamic-xpath-in-selenium-webdriver, #xpath-using-contains-function, #xpath-using-following-keyword, #xpath-using-following-sibling-keyword, #xpath-using-html-attribute, #xpath-using-multiple-html-attribute, #xpath-using-parent-keyword, #xpath-using-preceding, #xpath-using-preceding-keyword, #xpath-using-preceding-sibling, #xpath-using-starts-with-keyword, #xpath-using-text-function, #xpath-using-wildcard