Firefox Developer Tools: Highlight element found through queryselector in console as per. 'Inspect Element'

StackOverflow https://stackoverflow.com/questions/21456075

Question

If I open Firefox Web Develop Web Console and I reference a query selector like this:

document.querySelector('selector');

I would like to highlight the selector that is returned, in the same style as if I were to right click the element and select 'Inspect Element'

Was it helpful?

Solution

This feature has landed. Now DOMNodes are nicely outputted to the webconsole:

  • They are colored like in the inspector
  • Hovering over them highlights them in the page
  • Clicking on the inspector icon next to them switches over to the inspector

OTHER TIPS

We are due to land that feature but for now you can use shift+f2 to bring up the Firefox command line and type inspect to do the same thing.

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top