Find Elements with Instance Snippets
Introduction
When looking at the accessibility issues you’re presented with after a site scan, sometimes you need a fast way to check where the issue actually is. An easy way to find this is to simply grab the JavaScript snippet for an issue instance and paste it into your browser’s console.
This will help you find the element referenced by the accessibility issue instance directly on the website itself.
Obtaining the Snippet
To find the snippet, you must first locate an issue you’re interested in inspecting. Please make sure to open it up for more details and ensure it is active.
After doing so, you can scroll down to where it will display either a screenshot or some code, and click a link that says Show Snippet.
You’ll now see a line of code in a field that you can copy to your clipboard. Click this button, and then head on over to the affected page.
Utilizing the Snippet
At this point, you’ll want to determine the best method of accessing your browser’s JavaScript console after right-clicking the page. Generally, this should show up as an Inspect option.
After doing so, you should be able to access the browser’s console and simply paste the code. You may have to follow additional steps provided by your browser to proceed. However, after doing so, you should be taken right to where the issue is.
The element that is affected will be highlighted with a red box outline around it.