1839638 - InspectorUtils.parseStyleSheet does not seem to fully update stylesheet state when input has nested rules

Status: RESOLVED FIXED

(DevTools :: Inspector, defect, P1)

Description

[Nicolas Chevobbe [:nchevobbe]]

Steps to reproduce

1. Pull https://phabricator.services.mozilla.com/D181645
2. Run ./mach test layout/inspector/tests/browser/browser_parseStyleSheet_nested.js

Expected results

The test passes

Actual results

The test fails

---

The test basically opens a tab with a simple stylesheet containing nested rules:

      <style>
        h1 {
          .mySpan {
            background: gold;
            &.mySpan {
              color: red;
            }
          }
        }
      </style>
      <h1>Hello<span class="mySpan">world</span>

then calls parseStyleSheet on the stylesheet, changing the red color to black

      InspectorUtils.parseStyleSheet(
        sheet,
        `h1 {
          .mySpan {
            background: gold;
            &.mySpan {
              color: black;
            }
          }
        }`
      );

and run some assertions.
The rule cssText is updated as expected, but the new color isn't applied to the element
Furthermore, InspectorUtils.getCSSStyleRules on said element now returns no rules, while it used to returned the expected 2 rules.

For some reason, I wasn't able to reproduce with a plain mochitest (which are widely used for the InspectorUtils tests, but I was seeing the odd behavior in DevTools

Hopefully I'm not missing something important

Comment 1

[Emilio Cobos Álvarez (:emilio)]

Attachment: Bug 1839638 - Fix stylesheet invalidation on some kinds of rule insertions. r=#style

In particular, style rules weren't taking the children code-path.

Comment 2

[Emilio Cobos Álvarez (:emilio)]

I can't access https://phabricator.services.mozilla.com/D181645, it says:

Access Denied: Restricted Differential Revision

Do you know what that might be about? But I suspect comment 1 fixes it.

Comment 3

[Nicolas Chevobbe [:nchevobbe]]

Attachment: Bug 1839638 - [devtools] Add InspectorUtils.parseStyleSheet test for nested rules. r=emilio.

Comment 4

[Nicolas Chevobbe [:nchevobbe]]

(In reply to Emilio Cobos Álvarez (:emilio) from comment #2)

I can't access https://phabricator.services.mozilla.com/D181645, it says:

Access Denied: Restricted Differential Revision

Do you know what that might be about? But I suspect comment 1 fixes it.

erf, not sure, I just set it as "review needed" , which I guess should unblock the access.

Comment 5

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/096fdcd38685
Fix stylesheet invalidation on some kinds of rule insertions. r=zrhoffman

Comment 6

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/766b38dd96b6
[devtools] Add InspectorUtils.parseStyleSheet test for nested rules. r=emilio.

Comment 7

[Sandor Molnar[:smolnar]]

https://hg.mozilla.org/mozilla-central/rev/096fdcd38685
https://hg.mozilla.org/mozilla-central/rev/766b38dd96b6