You can use the iPath tool to edit, inspect and generate XPath and CSS selectors. iPath makes it easy to write, edit, extract, and evaluate XPath queries on any webpage. iPath is the only tool which provide the unique CSS selector for any web element in webpage.
- Right-click on the web page, and then click Inspect.
- In the right side of Elements tab, click on iPath tab.
- To generate XPath, inspect element or click on any dom node, it will generate the unique absolute XPath/CSS.
- To eavluate XPath/CSS, type the XPath/CSS query and press enter key. As you enter, it will query in DOM for the relevant element/node. You can view the matching node(s) and nodes value as per their sequential occurrence. A blue colour outline appears around to highlight the matching elements in the web page.
- If you mouse hover on any matching node in the iPath tab, blue dashed outline will convert into dotted orangered to highlight the corresponding element in the webpage.
- If the found element is not in visible area on webpage then mouse hover on found node in iPath panel will scroll that element in the visible area with dotted orangered outline.
- If found element is not highlighted but visible then on mouse hover on matching node on iPath tab it will highlight element with dotted oragered outline.
1- To use CSS features, first change the dropdown value from XPath to CSS in header. 2- Tool will add xpath/css attribute to all the matching node(s) as per their sequential occurrence. For example, a matching node appearing second in the list will have xpath=2. And if verifying CSS then it will add css=2.