238874 2022-04-06 10:14:39 -0700 [cssom] "set a CSS declaration" is broken for deferred properties 2024-07-23 11:24:06 -0700 1 1 1 Unclassified WebKit CSS WebKit Nightly Build Unspecified Unspecified NEW https://bugs.webkit.org/show_bug.cgi?id=226461 BrowserCompat, InRadar P2 Normal --- 238350 1 obrufau webkit-unassigned ahmad.saleem792 karlcow m_dubet webkit-bug-importer oldest_to_newest 1858888 0 456830 obrufau 2022-04-06 10:14:39 -0700 Created attachment 456830 testcase Run this testcase: <!DOCTYPE html> <div id="target"></div> <script> var cs = getComputedStyle(target); target.style.boxShadow = "0 0 0 100px blue"; console.log(target.style.cssText); // box-shadow: blue 0px 0px 0px 100px; console.log(cs.boxShadow); // rgb(0, 0, 255) 0px 0px 0px 100px target.style.webkitBoxShadow = "0 0 0 100px red"; console.log(target.style.cssText); // box-shadow: blue 0px 0px 0px 100px; -webkit-box-shadow: red 0px 0px 0px 100px; console.log(cs.boxShadow); // rgb(255, 0, 0) 0px 0px 0px 100px target.style.boxShadow = "0 0 0 100px green"; console.log(target.style.cssText); // box-shadow: green 0px 0px 0px 100px; -webkit-box-shadow: red 0px 0px 0px 100px; console.log(cs.boxShadow); // rgb(0, 128, 0) 0px 0px 0px 100px </script> Expected: green shadow. Actual: red shadow. box-shadow and -webkit-box-shadow are implemented as longhands that share a computed value. During the CSS cascade, they are deferred and applied in parse order, so that the last one wins. But CSSOM is broken, as seen above. When you set boxShadow="0 0 0 100px green", it just updates the old value in place, without taking into account that it will be overridden by -webkit-box-shadow that appears later. This needs the same fix that bug 226461 did for properties in a logical property group. 1861155 1 webkit-bug-importer 2022-04-13 10:15:15 -0700 <rdar://problem/91698692> 2047847 2 ahmad.saleem792 2024-07-23 11:23:53 -0700 It is still broken in Safari Technology Preview 199, while Chrome Canary 128 and Firefox Nightly 130 are matching each other and show 'green' for attached test case instead of 'red' (as in Safari). 456830 2022-04-06 10:14:39 -0700 2022-04-06 10:14:39 -0700 testcase deferred-cssom.html text/html 737 obrufau PCFET0NUWVBFIGh0bWw+CjxkaXYgaWQ9InRhcmdldCI+PC9kaXY+CjxzY3JpcHQ+CnZhciBjcyA9 IGdldENvbXB1dGVkU3R5bGUodGFyZ2V0KTsKCnRhcmdldC5zdHlsZS5ib3hTaGFkb3cgPSAiMCAw IDAgMTAwcHggYmx1ZSI7CmNvbnNvbGUubG9nKHRhcmdldC5zdHlsZS5jc3NUZXh0KTsgLy8gYm94 LXNoYWRvdzogZ3JlZW4gMHB4IDBweCAwcHggMTAwcHg7CmNvbnNvbGUubG9nKGNzLmJveFNoYWRv dyk7IC8vIHJnYigwLCAxMjgsIDApIDBweCAwcHggMHB4IDEwMHB4Cgp0YXJnZXQuc3R5bGUud2Vi a2l0Qm94U2hhZG93ID0gIjAgMCAwIDEwMHB4IHJlZCI7CmNvbnNvbGUubG9nKHRhcmdldC5zdHls ZS5jc3NUZXh0KTsgLy8gYm94LXNoYWRvdzogZ3JlZW4gMHB4IDBweCAwcHggMTAwcHg7IC13ZWJr aXQtYm94LXNoYWRvdzogcmVkIDBweCAwcHggMHB4IDEwMHB4Owpjb25zb2xlLmxvZyhjcy5ib3hT aGFkb3cpOyAvLyByZ2IoMjU1LCAwLCAwKSAwcHggMHB4IDBweCAxMDBweAoKdGFyZ2V0LnN0eWxl LmJveFNoYWRvdyA9ICIwIDAgMCAxMDBweCBncmVlbiI7CmNvbnNvbGUubG9nKHRhcmdldC5zdHls ZS5jc3NUZXh0KTsgLy8gYm94LXNoYWRvdzogZ3JlZW4gMHB4IDBweCAwcHggMTAwcHg7IC13ZWJr aXQtYm94LXNoYWRvdzogcmVkIDBweCAwcHggMHB4IDEwMHB4Owpjb25zb2xlLmxvZyhjcy5ib3hT aGFkb3cpOyAvLyByZ2IoMCwgMTI4LCAwKSAwcHggMHB4IDBweCAxMDBweAo8L3NjcmlwdD4=