Bug 301208 – Web Inspector: Styles for @starting-style are not shown when nested within a rule

• Status: NEW
• Component: Web Inspector

[Bramus]

I tried to use `@starting-style` debugging in Safari 26, but it’s not working for me (see https://bsky.app/profile/bram.us/post/3lzgfiu57bs25). Razvan pointed out that it’s CSS Nesting that is causing issues here.

For reference, here’s a bunch of nesting variations in which I would expect `@starting-style` debugging to work:

- https://codepen.io/bramus/pen/rNXyBBE/dd1dc4cc90989b0b385dedde3d38beff
- https://codepen.io/bramus/pen/XWvMrrv/eb75492268ff2d505cacdb0786831eea
- https://codepen.io/bramus/pen/xxvqKxG/34a88eeca8596b9591212a34555a8699
- https://codepen.io/bramus/pen/qBerWBb/53cfff3acb8c278798da6cbcb47a4623
- https://codepen.io/bramus/pen/GRVWKoM/ce55e1aedf09a927b93649e31cf63843
- https://codepen.io/bramus/pen/KKOWPVb/8fbc969ebad9a74541aef6e680588712
- https://codepen.io/bramus/pen/gOVmaRy/0f8f8648c50e9e50e8c11cfc7be5f2a3

As well as these demos:

- https://cdpn.io/pen/debug/qEBOwex
- https://cdpn.io/pen/debug/gbaEzyg/48cc33c91d9375d903bfe9885fb38cb1

Currently not all pages listed here can have their `@starting-style` rules debugged with Web Inspector.

[Radar WebKit Bug Importer]

<rdar://problem/163182220>

[Razvan Caliman]

Thank you for raising this, Bramus! 

The implementation in https://bugs.webkit.org/show_bug.cgi?id=294425 added support only for the standalone block variant of `@starting-style` (https://developer.mozilla.org/en-US/docs/Web/CSS/@starting-style#syntax)

Support for the nested variant isn't yet implemented, which is this bug.

[Razvan Caliman]

Created attachment 477167 [details]
Test case