Do It Yourself – Website Tutorials
Agenda
What is SelectorsHub
How to install SelectorsHub extension
Where to find SelectorsHub tab
SelectorsHub features demo
Auto suggest
Invalid Xpath error message
Shadow DOM support
Iframe support
SVG element xpath support
#SelectorsHub #selenium #automation
Timeline:
0:18 Agenda
1:30 What is SelectorsHub
2:48 How to install SelectorsHub extension
3:37 Where to find SelectorsHub tab
4:48 SelectorsHub feature – Auto suggest demo
7:36 SelectorsHub feature – Invalid Xpath error message demo
8:30 SelectorsHub feature – Shadow DOM supportdemo
9:50 SelectorsHub feature – Iframe support demo
12:42 SelectorsHub feature – SVG element xpath support demo
What is SelectorsHub?
Xpath and CSSSelector building tool
Free Chrome extension
Created by Sanjay kumar
It helps you to learn Xpath syntax
Most secured
SelectorsHub is a time saver tool if you are trying to write your own xpath or css selector.
You don’t have to copy and paste the values from the DOM to build xpath. It gives you quick auto suggestions on text, attributes, siblings, parents, childNodes, ancestors and descendants. If you have written a wrong xpath, the tool will inform you about the errors and suggests you the way to correct.
SelectorsHub is a free tool no license in required. Right now it is available, very soon this extension will be available in firefox, edge, safari browsers also.
This tool is created by Sanjay kumar who has also created ChroPath which is a popular tool among automation engineers.
Chrome webstore link for selectorshub:
https://chrome.google.com/webstore/search/selectorshub
Where to find the selectorshub tool in the browser?
SelectorsHub features demo
Auto suggest
Invalid Xpath error message
Shadow DOM support
Iframe support
SVG element xpath support
Auto suggest and error message
Show for xpath and css selector(# . Tag name)
https://books-pwakit.appspot.com/
shadow root Open
Shadow root Close
Change in the color
Just inspect the element if it will be inside iframe, SelectorsHub will show “in iframe” in the SelectorsHub tab.
To write the xpath/cssSelector for any element which is inside an iframe, just inspect that element and start typing.
Context switching
http://uitestpractice.com/
Limitation of Iframe is, it will not support the iframe from different source. Iframe source must be of same origin
SVG elements doesn’t support the standard XPath pattern. So most of the times we struggle while writing the XPath for SVG elements. You just type // and it will suggest the correct syntax and you can build XPath without wasting anytime.
https://www.w3schools.com/html/html5_svg.asp
selectorshub does not stores any user data, The tool runs in local environment. Injection of script happens only when you open this tool in the elements tab sidebar.
source