NEW226903
Web Inspector: Style panel display incomplete CSS declarations for JS-created styles
https://bugs.webkit.org/show_bug.cgi?id=226903
Summary Web Inspector: Style panel display incomplete CSS declarations for JS-created...
Nikita Vasilyev
Reported 2021-06-10 16:15:58 PDT
Created attachment 431158 [details] [HTML] Reduction Steps: 1. Open the attached HTML page 2. Inspect <div id=foo> 3. Open Style panel Expected: ``` font: 24px sans-serif; background: url(https://webkit.org/wp-content/themes/webkit/images/webkit.svg) center center / cover no-repeat fixed;} ``` Which is the same text as it's specified in JS. Actual: ``` font-size: 24px; font-family: sans-serif; ``` `background` is missing, which is misleading. `font` shortcut expanded, into two longhand properties, which isn't ideal. Notes: The bug was initially discovered on https://www.disneyplus.com/home. CSS-in-JS is very common on the modern web. It's used by React Native and other UI frameworks.
Attachments
[HTML] Reduction (467 bytes, text/html)
2021-06-10 16:15 PDT, Nikita Vasilyev
no flags
Radar WebKit Bug Importer
Comment 1 2021-06-10 16:18:47 PDT
Note You need to log in before you can comment on or make changes to this bug.