[Webkit-unassigned] [Bug 279280] New: Web Inspector: Sometimes glitches when editing style sheet with a nested `@media all` rule

Fri Sep 6 13:09:07 PDT 2024

https://bugs.webkit.org/show_bug.cgi?id=279280

            Bug ID: 279280
           Summary: Web Inspector: Sometimes glitches when editing style
                    sheet with a nested `@media all` rule
           Product: WebKit
           Version: WebKit Nightly Build
          Hardware: All
                OS: All
            Status: NEW
          Severity: Normal
          Priority: P2
         Component: Web Inspector
          Assignee: webkit-unassigned at lists.webkit.org
          Reporter: qianlangchen at apple.com
                CC: inspector-bugzilla-changes at group.apple.com

Created attachment 472482

  --> https://bugs.webkit.org/attachment.cgi?id=472482&action=review

Demo webpage

1. Open this attached demo webpage:
    <html>
        <head>
            <style>
                body {
                    color: navy;

                    @media all {
                        background-color: linen;
                    }
                }

                body {
                    font-size: 33px;
                }
            </style>
        </head>
        <body>
            Hello
        </body>
    </html>

2. Open Web Inspector's Element's tab and select the <body> element
3. Try to edit the `color: navy` style.
   - Glitches; editing was lost, and some styles suddenly disappeared from the styles panel

If the `@media all` rule were something like `@media (min-width: 0)`, it works just fine. (This may or may not have something to do with an issue with @at-rule's headers that Patrick noticed: https://github.com/WebKit/WebKit/blob/b1d970cf1045f6233eb1805757907dd0ff60369b/Source/WebCore/inspector/InspectorStyleSheet.cpp#L1133-L1136)

If we flip around the nesting of the `@media all` rule and the `body` rule, where it's `@media all { body { ... } }` instead of `body { @media all { ... } }`, it works just fine too.

-- 
You are receiving this mail because:
You are the assignee for the bug.
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.webkit.org/pipermail/webkit-unassigned/attachments/20240906/9631c7e0/attachment.htm>