Tips & Tricks #48

Can I inspect the shadow DOM of an element for a user-agent?

Chrome, Edge

• Open Settings (F1 or Shift+?) > Under the Elements section, enable Show user agent shadow DOM.

• In the Elements panel, expand the node to inspect the shadow DOM available under shadow-root (user-agent).

  

  https://canidev.tools/inspect-shadow-dom/chrome

---

Safari

• In the Elements panel, expand the element to reveal the Shadow root (user-agent) node, and its children, that were generated by the browser for this element.

  

  https://www.canidev.tools/inspect-shadow-dom/safari