Xpath is one of the locator that we use to locate web elements. it is the primary skill of Test automation engineers. mastering it will help you standout. Lets directly jump into the topic.
Syntax : //tagname[@attribute='value']
//div[@class= 'classname']
- Here // represents out web element can be anywhere in dom
- if we put asterisk(*) in place of tag name it represents our web element can be from any tag
- we use @ for attributes and its value should be in double or single quotes(recommended)
AND and OR
- If we are not able to identify an element uniquely we can make use of AND or OR in our condition within square brackets like below.
- Syntax : //tagname[@attribute='value' AND @attribute='value'] //tagname[@attribute='value' OR @attribute='value']
//p[@name= 'x' and @id='y']
Text()
- If we have no unique attribute and has unique text we can use Text() like below.
//p[Text()= 'some unique text]'
Identifying parent using child.
- At times we don't have unique way to identify few element, in such case we need to check if any child parent relation and if child has unique attributes.
- we can move to the parent from child with just single forward slash and two dots
/..like below. //span[@name='uniqueName']/..it identifies parent web element.
Identifying child using parent.
- It is similar to above but instead of two dots we just need to mention child element tag, if it is not unique then we can play the trick using AND or OR combinations etc..
//div[@name='uniqueName']/input
Identifying using indexes
//input[@type='text'][1]- It basically means say this particular element has parent which has say 10 child elements, in that we are trying to get the first element.
- if a parent has 5 sub childs(Child to child), we need to write xpath as below
(//input[@type='text'])[2]
Functions
contains(param1, param2):
- Unlike text() function we can use contains for a partial match
//div[contains(@name,'this is na')]//div[contains(text(),'this is tex')]
starts-with(param1, param2):
- if any element text, id, name or class values remains have same starting then we can use starts-with
//div[starts-with(@id, 'div')]//h3[starts-with(text(),"starting text")]
position()
- You can either use index or position if you have web table or few sequence of same tags with parent child relationship
//table[@id = 'id_value']//tr[3]//table[@id = 'id_value']//tr[position()=1 ]
last()
- consider web table or few sequence of same tags and if the count of them keep on changing and you want get the last web element every time, here last() function will help you out.
//table[@id = 'id_value']//tr[3]//table[@id = 'id_value']//tr[last()]- You can also perform conditions, say if you would like to last but 1 element in your sequence
//table[@id = 'id_value']//tr[last()-1]//table[@id = 'id_value']//tr[1+3]is allowed to select the 4th element
count(param)
- It will give you count of matched web elements
- In param you need to pass xpath
- We can also identify elements uniquely using count function, say if you would like to identify table whose total rows are 10, you can do this with below xpath
//table[count(.//tr) = 10]
normalize-space(param)
- It trails off addition space before or after attribute value
- In param you need ot pass attribute
//p[normalize-space(text()) ='san']
translate(string, abc, XYZ)
- string: The string to evaluate.
- abc: The string of characters that will be replaced.
- XYZ:The string of characters used for replacement. The first character in XYZ will replace every occurrence of the first character in abc that appears in string
//p[translate(text(), 'brown', 'red') = 'The quick brown fox.']
string-length(param1)
- Using this function we can identify element whose text is of particular size(greater/lesser) like below
//p[string-length(text()) >20 ]
round(param) or floor(param)
- We use these functions to deal with numbers
- Below xpath identifies all table entries whose table data can be floor to 30 (ex: 30.8, 30.3, 30.7 etc..)
//td[floor(text()) = '30']- Below xpath identifies all table entries whose table data can be round to 30 (ex: 30.4, 29.6, 29.9 etc..)
//td[round(text()) = '30']
not(param)
- it is simple but power, if you would like to select all elements except one particular element
//p[@id ='id1' and not(@name='san')]
substring-before(param1, param2) and substring-after(param1, param2)
- param1 is the string that we evaluating, param2 is divider to before and after to that, say tomandjerry@gmail.com here we can write as below to match all element which ends with gmail.com
- It selects element if it matches with below condition
//p[substring-after(text(), '@') = 'gamil.com']//p[substring-before(text(), '@') = 'some text']
Xpath Axes
parent
- using child elemet we will identify parent uniquely. same we achieve usign double dots as well
//div[@id='A']/..//div[@id='A']/parent::*//div[@id='B1']/parent::div[@id='A']It is way of identifying parent A using its child B1
ancestor
- scope of parent is limited to one particular element but ancestor scope is all parents till root node
//div[@id='B1']/ancestor::div[@id='A']
child
- Here in this example it is trying to identify child X2 using parent id.
//div[@id='B1']/child::div[@id='X2']//div[@id='B1']/*also works
descendent
it is not just child but it includes children of children as well.
//div[@id='B1']/descendant::*]It gives all descendants of B1
Following
- It gives all web elements that comes after matched element
//div[@id='B1'] / following::*
Following-sibling
- It gives all web elements that are at sibling level of matched web element
//div[@id='B1'] / following-sibling::*//div[@id='B1'] / following:: div/inputit matched input field which comes after div tag.
preceding and preceding-sibling
- these are also similar to following examples but it matched preceding element
//div[@id='B1'] / preceding-sibling::*//div[@id='B1'] / preceding:: div/input
with this you have reached to the end of xpath methods, I will try to add different ways to use xpath as I encounter.