Cheat Sheet for XPath and CSS

The previous cheat sheet I made(Selenium WebDriver Cheat Sheet) received great feedback and so I decided to make one for XPath – CSS Paths as well. It includes the commonly used XPaths along with the corresponding CSS paths.

XPath CSS Path Cheat Sheet

Xpath Css Path Cheat Sheet

 

Here is the same table in HTML form.

DescriptionXpathCSS Path
Direct Child//div/adiv > a
Child or Subchild//div//adiv a
Id//div[@id=’idValue’]//adiv#idValue a
Class//div[@class=’classValue’]//adiv.classValue a
Following Sibling//ul/li[@class=’first’]/following-siblinul>li.first + li
Attribute//form/input[@name=’username’]form input[name=’username’]
Multiple Attributes//input[@name=’continue’ and @typinput[name=’continue’][type=’button’
nth Child//ul[@id=’list’]/li[4]ul#list li:nth-child(4)
First Child//ul[@id=’list’]/li[1]ul#list li:first-child
Last Child//ul[@id=’list’]/li[last()]ul#list li:last-child
Attribute Contains//div[contains(@title,’Title’)]div[title*=”Title”]
Attribute Starts With//input[starts-with(@name,’user’)]input[name^=”user”]
Attribute Ends With//input[ends-with(@name,’name’)]input[name$=”name”]
Element with Attribute//div[@title]div[title]

Further Reading:

SEE ALSO:   Selenium WebDriver Cheat Sheet

You may also like...

6 Responses

  1. Text contains in Xpath:
    //span[contains(@text,’text’)]

  2. Raghavendra says:

    You can also add
    1. //label[text()=’ ‘]
    2. //label[text()=’ ‘’]/ preceding::a

Leave a Reply

Your email address will not be published. Required fields are marked *