devtools: how to query through the shadow DOM

This is a literal TIL but was so hand I had to put it my blog so that I wouldn't later forget it.

Thanks to Big Brain Keith Cirkel for sharing this.

As (hopefully) you know, there's the $ and $$ functions in devtools. For querySelector and querySelectorAll respectively.

Well there's also $$$ to query through the shadow DOM. This means the query will cut through and into the nested DOM inside of the shadow DOM making it much easier to navigate and search for elements when debugging or styling.

Begs the question: what's going to be lurking inside of $$$$ in 5 years time!