Any ways of using selectors from javascript side on Browser

Libraries Browser
1

So, at the moment I’m integrating accessibility checks to my test suites and using Axe-core for those. Essentially this; robotframework-browser-extensions/Axe-Core at main · MarketSquare/robotframework-browser-extensions · GitHub

While the generated html reports are fine, i’d like to extend this a bit by iterating thru to actual dict of violations this tool can return and take a screenshot of the offending element. However, selectors are not in format RF/Browser accepts as they are essentially what you could feed to document.querySelector() …

Here’s bunch of examples:

".sc-59c070c6-2:nth-child(1)"
"a[data-gtm-id=\"ecom-navi:div:magnifier\"]"
"meta[name=\"viewport\"]:nth-child(6)"
"meta[name=\"viewport\"]:nth-child(7)"
"meta[name=\"viewport\"]:nth-child(8)"
"meta[name=\"viewport\"]:nth-child(9)"
"span:nth-child(1)"
"span:nth-child(2)"

Quick thought would be to just split at : but in some cases that might not work (see data-gtm-id)

Is there any straight up way to use selectors directly from browser ? Essentially i would just like to a) highlight the element and b) take screenshot of the said element with the given selector.

2

You probably could, but would have to either execute javascript to return the (web)element back via the selector value and cast that into the appropriate WebElement object RF can work with - this might not be easy to do if you are trying to handle it as keyword executions rather than within library code.

The other easier option is to handle all this that you want within javascript and simply have the RF library execute the javascript against the browser.