Max ·

I’ve been using the browser console and querySelector to inspect and find certain elements on a page. Today I learned that one can also use XPath in the search field inside the elements tab. It has a different syntax than querySelector, but it can do things that CSS selectors cannot.

For example you can search for all elements with aria attributes with this XPath query:

//[@[starts-with(name(),"aria-")]]

You can find more examples and use cases for XPath in this blog post by Adrian Roselli:

adrianroselli.com/2021/04/xpath-for-in-browser-testing.html

Both Chrome and Firefox support XPath searches when in the DOM view of their dev tools.

You can follow my Notes using any RSS reader — my personal favorite is Reeder.