Testing Taxi

Intelligent Assistant for Testers

Navigation

XPath Cheat Sheet for Testers

This is a comprehensive guide designed to equip testers with the knowledge and techniques needed to effectively use XPath for locating elements on webpages during testing. This cheat sheet provides a handy reference for common XPath syntax and functions, enabling testers to quickly and accurately select elements based on their attributes, hierarchy, or textual content. From basic XPath expressions to advanced querying methods, this cheatsheet covers it all, empowering testers to streamline their testing efforts and enhance their efficiency in identifying and interacting with elements on webpages.

Table of Contents

Locating Form Inputs with XPath

When using XPath to locate form inputs, it’s important to identify the specific input element you want to interact with. You can do this by finding its unique attribute, such as “id” or “name,” and using XPath to navigate to it. Additionally, you can also use XPath to locate inputs based on their type, value, or position within the form.

Get all the radio buttons in the form

//*[@type=”radio”]
//form[@id=”myform”]//*[@type=”radio”]

Get the radio button that has specific text

//*[text()=”Hamburger”]/ancestor-or-self::label//*[@type=”radio”]

Get the n-th radio button

//form//input[1][@type=”radio”][@name=”brand”] // first radio button

//form//input[2][@type=”radio”][@name=”brand”] // second radio button

Get a select box

//form[@id=”myform”]//select[@name=”juice_flavor”]

Get a text box

//form[@id=”myform”]//input[@type=”text”][@name=”notes”]

//form[@id=”myform”]//textarea[@name=”name”]

Get a checkbox

//form[@id=”myform”]//input[@type=”checkbox”][@name=”name”]

Get disabled inputs

//input[@disabled]

//select[@disabled]

//textarea[@disabled]

Getting Buttons with XPath

XPath can be a powerful tool for locating and interacting with buttons on a web page during testing. To get buttons using XPath, you can use the “//button” XPath expression, which selects all button elements on the page. Additionally, you can narrow down the selection by using predicates to match specific attributes or conditions of the buttons.

Getting <button> for form submission

//form[@id=”myform”]//button[@type=”submit”]

Getting <button> by text

//form[@id=”myform”]//button[@type=”submit”][contains(text(), “Save”)]

Getting <input type=button> by text

//form[@id=”myform”]//input[@type=”button”][contains(text(), “Upload”)]

Find disabled buttons

//button[@disabled]

Getting links with XPath

To get links with XPath, use the anchor tag element followed by the appropriate attribute or attribute value. For example, “//a” selects all anchor tags in the document, while “//a[@href=’example.com’]” selects anchor tags with an href attribute value of “example.com”. Remember to use the “href” attribute to specifically target links.

Get External Links

//a[starts-with(@href, “http”)]

Finding links that open in a new tab

//a[@target=”_blank”]

Getting Internal Links (or relative links)

//a[not(starts-with(@href, “http”))]

Finding links by text

//a[contains(@text, “Home”)]

Finding links by URL

//a[contains(@href, “https://google.com”)]

Getting Titles with XPath

When working with XPath, getting titles from a webpage is a common task. To achieve this, you can use the XPath expression “//title”, which selects the title element in the HTML document. By extracting the text from this element, you can retrieve the title of the webpage for further testing or verification.

Get URL Bar title

//title

Get Title by Header Level

//h1

//h2

//h3

Get Title by Content

//h1[contains(@text, “my title”)]

Getting Logos and Images with XPath

When using XPath to retrieve logos and images, it is important to identify the correct XPath expression for the element containing the desired image. This can be done by inspecting the HTML source code or using browser developer tools. Once the XPath is determined, testers can use it to extract the image URL or directly download the image for analysis or verification purposes.

Get Image by Dimensions

//img[@height=”100px”][@width=”100px”]

//img[@height=”100%”]

Get Image by source

//img[@src=”/logo.png”]

Get header image

//header//img[@src=”/logo.png”]

Helpful Tools

Test your XPath in Chrome or Firefox Javascript Console

$x(“my xpath”)

Here’s an example of grabbing the Google logo via the Javascript Console. Just type your query in there and press enter to see the results.

How to test XPath in chrome with dev tools

Finding XPath of element in Chrome/Firefox DOM Inspector

You can also copy the full XPath of an element via the DOM inspector. Just right click on the element and choose Copy XPath.

How to copy XPath from Chrome DevTools
Autofill forms in seconds with Testing Taxi Extension for Chrome
  • Autofill Tedious Forms with One Click
  • Always on Spell Check
  • Live locator copy/paste
  • Instant warnings and test suggestions

Navigation

Share the Post:

Related Posts

Autofill forms in seconds with Testing Taxi Extension for Chrome
  • Autofill Tedious Forms with One Click
  • Always on Spell Check
  • Live locator copy/paste
  • Instant warnings and test suggestions