As explained in one of the previous posts, Firebug and Firepath add-ons for locating and validating the UI elements on the page got deprecated and discontinued and we have to use alternative add-ons in place of Firebug and Firepath.
Though ChroPath is the best alternative of Firebug & Firepath in locating the UI elements and validating the XPath Expressions & CSS Selectors, we can also use Relative XPath Helper in Chrome browser to auto-generate the Relative XPath Expressions and for validating the XPath Expressions.
Note: Relative XPath Helper add-on is only available in the Chrome browser and can only be used for auto-generating Relative XPath Expressions and validating the XPath Expressions.
In this article, I am going to practically demonstrate auto-generating Relative XPath Expressions and validating XPath Expressions using the Relative XPath Helper add-on.
Let’s get started.
Selenium Locators – Installing and using Relative XPath Helper Add-on
Follow the below steps for auto-generating the Relative XPath Expressions and validating XPath Expressions using Relative XPath Helper Add-on in Chrome browser:
1) Open Chrome browser, google search for ‘Relative XPath Helper’ and click on the below link from the search results:
2) Click on the ‘Add to Chrome’ button from the Chrome Web Store page of ‘XPath Helper’ as shown below:
3) Click on ‘Add Extension’ button on the displayed dialog as shown below:
4) Observe that the Relative XPath Helper Add-on got added to the Chrome Browser as shown below:
5) Open any application say http://omayo.blogspot.com/ in the Chrome Browser as shown below:
6) Click on the ‘Relative XPath Helper’ icon on the chrome browser and observe that few sections of the Relative XPath Helper will be displayed as shown below:
7) While the above ‘Relative XPath Helper’ section is displayed, right-click on any UI element for which the Relative XPath Expression needs to be auto-generated.
Let’s right-click on the ‘Button2’ button while the ‘Relative XPath Helper’ section is displayed and observe that the first Relative XPath Expression got auto-generated and displayed as shown below:
Now, without clear the above auto-generated Relative XPath Expression, let’s right-click on another UI element on the page say ‘search’ text field and observe that the Relative XPath Expression for the ‘search’ text field got auto-generated in the ‘XPath of Second Element’ field as shown below:
8) We can copy the auto-generated Relative XPath Expressions and later use it for locating the required UI elements as shown below:
9) Apart from auto-generating the Relative XPath Expressions, we can also use ‘Relative XPath Helper’ add-on to validate the existing XPath Expressions.
Let’s validate the XPath Expression say //input[@name=’q’]
Enter the above XPath Expression into the ‘Relative XPath of the First Element to Second Element’ text field and press ‘Enter’ key on your keyboard and observe that the ‘Search’ text box field got located as shown below:
Here concludes this article.
In the next article, I will explain a different alternative for Firebug and Firepath.
- > To learn more about Selenium, continue to the next post (Click on Next Post link below)
- > Check complete Selenium Tutorial Contents here (Click here)
Please leave your questions/comments/feedback below.
Happy Learning ?
On a mission to contribute to the Software Testing Community in all possible ways.