NEW 279377
Web Inspector: Style details panel incorrectly shows `@supports` rules as applied
https://bugs.webkit.org/show_bug.cgi?id=279377
Summary Web Inspector: Style details panel incorrectly shows `@supports` rules as app...
Qianlang Chen
Reported 2024-09-09 12:59:29 PDT
Created attachment 472507 [details] 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.
Attachments
Demo webpage (236 bytes, text/html)
2024-09-09 12:59 PDT, Qianlang Chen
no flags
Radar WebKit Bug Importer
Comment 1 2024-09-09 12:59:49 PDT
Note You need to log in before you can comment on or make changes to this bug.