290584 2025-03-27 16:36:55 -0700 Invalid nested selectors cause subsequent property-value pair to be ignored 2025-03-28 09:44:17 -0700 1 1 1 Unclassified WebKit CSS Safari 18 Mac (Apple Silicon) macOS 15 RESOLVED DUPLICATE 285114 https://bugs.webkit.org/show_bug.cgi?id=285114 P2 Normal --- 1 lx2798 m_dubet karlcow koivisto lwarlow m_dubet oldest_to_newest 2106640 0 lx2798 2025-03-27 16:36:55 -0700 Suppose you have the following nested selector: ``` div { font-weight: bold; &::-foo-bar { font-size: 50px; } color: blue; text-transform: uppercase; } ``` The nested `&::-foo-bar` rule is invalid and ignored (which is expected), but so is `color: blue`. The `text-transform: uppercase` seems to be processed just fine though. It's as if there's some logic invalidating everything up to the next `;` after an invalid selector. This bug also invalidates any immediately subsequent nested rule as well, which is particularly annoying because one use case for nested rules is to handle Mozilla-specific `-moz-` selectors: ``` input[type="range"] { &::-moz-range-thumb { /* some styling */ } &::-webkit-slider-thumb { /* some styling */ } } ``` In this case, the invalid (from WebKit's perspective) `-moz-range-thumb` also invalidates the `-webkit-slider-thumb` (and any nested rule or property-value after that until a `;` is encountered). Repro at https://codepen.io/andrewfong/pen/RNwYqLr This bug does not seem to happen with Mozilla and Chrome. 2106649 1 lwarlow 2025-03-27 16:57:56 -0700 From a quick search it seems to be https://searchfox.org/wubkat/source/Source/WebCore/css/parser/CSSParserImpl.cpp#1453 which needs changing. 2106836 2 m_dubet 2025-03-28 09:44:17 -0700 Hi, Thank you for the bug report. It seems to be a duplicate of 285114 Safari Technology Preview and Chrome Dev are displaying the same result in the codepen. *** This bug has been marked as a duplicate of bug 285114 ***