NashTech Insights

LetXPath, an useful extension to generate good locators

Picture of Thang Nguyen
Thang Nguyen
Table of Contents

As we know, capturing locators plays an important role in automation testing. Good locators make our scripts more stable and help us save effort by reducing the need to fix flaky tests. Therefore, we need to spend effort carefully capturing locators before using them in our test scripts. In this blog, I’d like to share about LetXPath, and let’s see if it can help us reduce the effort required for capturing locators.

1. What’s LetXPath

LetXPath is built as a browser extension which supports us to find the best locators like XPath, CSS, Axes for our elements. Besides, it also helps us verify if the captured locator is unique or generate the test script for various kinds of automation tool and programming languages.  Currently, we can use it on Chrome or Microsoft Edge to speed us the locator capturing activity.

2. Installation

LetXPath is built as a browser extension, so you can easily install it. Please follow the following steps to install LetXPath on your browser.

  • You can find the extension here for Chrome or Microsoft Edge
  • Restart your browser.
  • Navigate to your application under test.
  • Open inspect element or press F12.
  • Open the LetXpath menu on the sidebar panel.
  • Click on the element you want to capture.

3. LetXPath features

3.1 Capture locator

LetXPath supports 3 ways to capture locators: XPath, CSS, and Axes. Let’s see if there are any differences from other tools.

3.1.1 Capture XPath

As you see in the below pictures, the tool can suggest 3 locators for us based on their attributes. Based on our experience and best practices for capturing XPath, we can select the best one for the element.

3.1.2 CSS

If you’re interested in CSS, please choose the CSS tab. Like the XPath tabs, LetXPath provides us with results so that we can choose the most appropriate locator.

3.1.3 Axes

Sometimes, we cannot find any attribute of the target element, so we need to base it on their parent/ancestor. The Axes tab is a very useful tab that supports us to capture an element by combining its attributes and the attributes of its parent.

For using this feature, we need to click on the parent element first. After that, we’ll click on the target one. The tool will show the list of attributes of both the child and parent element. By clicking on the toggle, we can add the attributes we want into the XPath.

3.2 Search Element

With this feature, we can check if the locator we capture matches with any elements on the web. If there’s more than one matched element, your locator is not unique.

3.3 Generate test script

LetXPath also supports generating a simple test script. Here is the list of tools and programming languages supported by LetXPath:

  • Playwright – Java
  • Playwright – Node
  • Selenium Java
  • Selenium Python
  • Selenium C#
  • Protractor

By clicking on the Setting button, we’ll navigate to the selecting tool windows. We can choose the kind of tool and programming language we want.

After that, please go back to XPath or CSS tabs, select the Snippet dropdown, and choose the interaction. The snippet code will be generated.

4. Advantage and disadvantage

4.1 Advantage

  • The locator suggested by LetXPath is short, robust, and always unique (if not unique, it is hidden by LetXPath automatically).
  • Easy to install and use.
  • Support on both Chrome and Microsoft Edge.

4.2 Disadvantage

  • For complicated elements, the suggested locator is not the best one. The tool may suggest with index or meaningless attributes.
  • The code generated by LetXPath will need to be updated to follow the automation framework applied in the project.

Conclusion

We have a lot of tools supporting the finding of locators, but I think LetXPath is one of the most useful ones that can be leveraged by both automation and manual testers. It helps us capture the locator quickly without spending effort learning the tool. The tool is also free and highly rated by the community.

Reference:

https://chromewebstore.google.com/detail/letxpath/bekehlnepmijedippfibbmbglglbmlgk

Picture of Thang Nguyen

Thang Nguyen

I'm Thang Nguyen, hailing from the vibrant city of Da Nang, Viet Nam. Currently, I thrive as an Automation Test Engineer at NashTech. My passion lies in ensuring that every line of code meets the highest standards of quality and reliability. With a meticulous eye for detail and a knack for problem-solving, I meticulously craft and execute test plans to perfection. My dedication to excellence and my ability to navigate complex technical landscapes have earned me a reputation as a trusted expert in my field. Let's connect and collaborate!

Leave a Comment

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

Suggested Article