[Webkit-unassigned] [Bug 279377] New: Web Inspector: Style details panel incorrectly shows `@supports` rules as applied

Mon Sep 9 12:59:29 PDT 2024

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

            Bug ID: 279377
           Summary: Web Inspector: Style details panel incorrectly shows
                    `@supports` rules as applied
           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 472507

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

Demo webpage

1. Open the attached demo webpage:
    <html>
        <head>
            <style>
                body {
                    @supports (display: none) {
                        color: navy;
                    }
                }
            </style>
        </head>
        <body>
            Hello
        </body>
    </html>

2. Open Web Inspector, go to Elements tab, and select the <body> element.
3. From the style details panel, observe that `display: none` is incorrectly shown as an active style, when it should only be a condition and not actually applied.

The expected behavior should be that only the `color: navy` style shows up and no `display: none` (apart from in the @support rule's condition).

Note: I realize that having a @supports rule being nested is non-standard. (The canonical way is `@supports (...) { body { ... } }`, instead of `body { @supports (...) { ... } }`.) However, the MDN docs suggests @at-rules can now be nested (https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_nesting/Nesting_at-rules), so our Web Inspector should be able to support that syntax.

-- 
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/20240909/ddd96111/attachment.htm>