Inspect Shadow DOM with Firefox
Yes, we have added shadow DOM inspection to Firefox 65.0+ DevTools.
Shadow DOM in normal content pages is always displayed e.g.
By default shadow DOM for built in browser features is not displayed e.g here is a video element:
To enable viewing of the Shadow DOM for built in features:
- Go to about:config
- Set
devtools.inspector.showUserAgentShadowRoots
to true
After changing this setting you need to restart DevTools (or restart Firefox).
Now the Shadow DOM for built-in elements will be available:
- Type
about:config
in the browser address bar. - Set
devtools.inspector.showUserAgentShadowRoots
totrue
// not needed for Firefox 76+ - Set
devtools.inspector.showAllAnonymousContent
totrue
(Firefox 76+)