| Summary: | [css-cascade] Proximity for implicit scopes seems to be ignored for rules with zero specificity | ||||||
|---|---|---|---|---|---|---|---|
| Product: | WebKit | Reporter: | Nathan Knowler <nathan> | ||||
| Component: | CSS | Assignee: | Matthieu Dubet <m_dubet> | ||||
| Status: | RESOLVED FIXED | ||||||
| Severity: | Normal | CC: | kizmarh, koivisto, m_dubet, nathan, obrufau, webkit-bug-importer | ||||
| Priority: | P2 | Keywords: | HasReduction, InRadar | ||||
| Version: | Safari 17 | ||||||
| Hardware: | All | ||||||
| OS: | All | ||||||
| See Also: | https://github.com/web-platform-tests/wpt/pull/45205 | ||||||
| Attachments: |
|
||||||
Pull request: https://github.com/WebKit/WebKit/pull/25918 Committed 276345@main (7b99ea4ee244): <https://commits.webkit.org/276345@main> Reviewed commits have been landed. Closing PR #25918 and removing active labels. |
Created attachment 470334 [details] Reduced test case for implicit scope’s proximity being override by explicit scope when selectors have zero specificity. When an implicit `@scope` (i.e. a scope within an embedded style without an explicit scope root) is used and it contains a rule that has a sum of zero specificity (0,0,0) like the universal selector (i.e. `*`) or a selector wrapped with the `:where()` pseudo-class function, it seems like less proximate scopes with the same specificity can override the local scope. The only workaround is to bump the specificity of the selector used in the local scope. From what I’ve observed: - Other properties for the same selector with zero specificity inside the implicit scope where there is no conflict apply fine. - Order of appearance does not seem to cause any difference (e.g. ordering the less proximate explicit scope rule before or after the implicit one), so I assume this is a problem with how scope proximity is being determined for this situation.