What were you doing?

1. Load test.html
2. Click on "Add element that has a shadow subtree"
3. Right-click on the second div (red rectangle) and choose "Inspect Element".

What happened?

The inspector does not show any style sheets.
If you do see the style sheet, click on the other red div in the inspector.

What should have happened?

The inspector should have shown the applicable style sheet (i.e. :host{border:9px solid red;margin:9px}).

Anything else we should know?

• In this specific test case, if the devtools were open before the element is inserted, then the inspector works as expected.
• In the original test case, the bug still occurs even if the devtools was open before. Original STR (depending on bug 1542262): 1. Set extensions.htmlaboutaddons.enabled to true at about:config 2. Install any extension if you haven't done so before. 3. Visit about:addons, click on the Extensions tab, double-click on a specific extension to see details. 4. Scroll down and use "Inspect Element" on the five stars. Expect rules from "rating-star.css" (actual: they do not show up).
• It seems that the style sheet fails to be detected, and that the failed result is cached.
• This happens with chrome:, resource:, https: and data: URLs (other schemes not tested).
• This does not happen with inline style sheets (<style> element and style attribute)
• Reproduced in Nightly 68.0a1 buildID 20190512214232 on macOS.
• Reproduced in Firefox 66.0.3 buildID 20190409155332 on macOS.