Re: [csswg-drafts] [css-cascade] may need to define cascading order between sibling encapsulation contexts (#10889)

The CSS Working Group just discussed `[css-cascade] may need to define cascading order between sibling encapsulation contexts`.

<details><summary>The full IRC log of that discussion</summary>
&lt;emilio> dbaron: one of the steps in the cascade, between origin and specificity<br>
&lt;emilio> ... (don't remember how it interacts with layers)<br>
&lt;emilio> ... is that rules based on tree scopes cascade separately<br>
&lt;emilio> ... so rules from outside the shadow root generally wins, except !important which goes the other way around<br>
&lt;emilio> ... there's spec text that assumes that only tree scopes relevant to styling are outside / inside<br>
&lt;emilio> ... but in some edge cases you can have sibling scopes<br>
&lt;emilio> ... one of these is if we allow ::part() after ::slotted()<br>
&lt;emilio> ... the other is the /slotted/ combinator<br>
&lt;emilio> ... so in these cases you have stuff in one shadow tree that affects styles in a sibling shadow tree<br>
&lt;emilio> ... the cascade spec is not clear about this<br>
&lt;emilio> ... I don't really have a solution, thinking about this makes my head hurt<br>
&lt;emilio> ... for an impl perspective is probably easier not to cascade them together<br>
&lt;emilio> ... because having them together may be painful<br>
&lt;emilio> ... the problem here is we don't define what happens<br>
&lt;emilio> ... I don't have very strong opinions<br>
&lt;emilio> q+<br>
&lt;dandclark> q+<br>
&lt;emilio> Rossen: tab seems to propose tree order<br>
&lt;astearns> ack lea<br>
&lt;Zakim> lea, you wanted to say, it's definitely not high priority. Q: if we decide to not allow it now, is that something we can revisit later or will we run into web compat?<br>
&lt;lea> q+<br>
&lt;Rossen9> ack emilio<br>
&lt;dandclark> emilio: The shadow incluuding tree order thing makes sense except I don't know how to define !important in that case beacuse there's no inside or outside. Not clear if it should be reversed or not, that seems weird. So don't have clear answer.<br>
&lt;emilio> dandclark: Was going to agree with tab<br>
&lt;emilio> ... it generalizes that definition<br>
&lt;emilio> ... but agree with emilio that it seems weird to do the reverse from !important<br>
&lt;Rossen9> ack dandclark<br>
&lt;Rossen9> ack lea<br>
&lt;emilio> ... unclear if there's something better<br>
&lt;emilio> lea: not quite sure I understand so might be off<br>
&lt;emilio> ... not sure how making slotted a combinator relates to this<br>
&lt;emilio> ... the whole point was to circumvent some of the issues<br>
&lt;emilio> ... wouldn't it be the same as<br>
&lt;emilio> ... you're using regular selectors to target the slotted elements<br>
&lt;emilio> ... so regular cascade rules should apply<br>
&lt;emilio> ... if it's about styling inside and outside we have :host and regular selectors too<br>
&lt;emilio> ... maybe I'm misunderstanding<br>
&lt;emilio> q+<br>
&lt;emilio> dbaron: I think it'd be the /slotted/ combinator in combination with ::part or something else<br>
&lt;Rossen9> ack emilio<br>
&lt;emilio> dbaron: I think I was thinking was something like /slotted/ element::part(foo) from inside a component<br>
&lt;dandclark> emilio: No because the outside is not a sibliing<br>
&lt;emilio> ... then slotted looks at the parent tree scope, and ::part() could be a child of the parent tree scope (thus a sibling)<br>
&lt;emilio> lea: wouldn't that be the same as targetting the part from outside?<br>
&lt;emilio> emilio: no because outside scope wouldn't be a sibling<br>
&lt;emilio> dbaron: the other possibility is that some of the rules are not desirable with ::slotted()<br>
&lt;emilio> lea: that's a big motivation for the slotted combinator<br>
&lt;lea> that any CSS you include in ::slotted() has lower precedence than litterally any other CSS, including the universal selector, CSS resets, generic type selectors etc<br>
&lt;emilio> q+<br>
&lt;lea> unless you use !important, which is too strong<br>
&lt;Rossen9> ack emilio<br>
&lt;dandclark> emilio: I am confused because the slotting behavior doesn't fix that layout<br>
&lt;emilio> lea: my understanding was that ::slotted() behaves like this because it's a pseudo of the slot<br>
&lt;emilio> emilio: that's not correct<br>
&lt;emilio> lea: so this is the reason ::slotted() doesn't work?<br>
&lt;emilio> dbaron: yes, the reason ::slotted() is so weak is this rule about encapsulation context<br>
&lt;emilio> ... which I think makes sense for ::part()<br>
&lt;emilio> ... but maybe it's not the right decision for ::slotted()<br>
&lt;emilio> lea: but now we cannot change ::slotted() because of webcompat<br>
&lt;emilio> ... so /slotted/ would work<br>
&lt;emilio> ... btw I chatted with rniwa, and his implementation concerns are about targetting descendants and other elements<br>
&lt;emilio> ... but if we restrict what comes after to a compound selector he's fine with it<br>
&lt;emilio> q+<br>
&lt;Rossen9> ack emilio<br>
&lt;lea> q+<br>
&lt;dandclark> emilio: So that is correct, that was an implementation issue, but making @@@ doesn't help as long as we don't change the cascade spec in subtle ways.<br>
&lt;Rossen9> ack lea<br>
&lt;emilio> lea: it's clear we need to fix both<br>
&lt;keithamus> s/@@@/slotted combinator<br>
&lt;emilio> ... but we probably can't change how ::slotted() behaves because webcompat<br>
&lt;emilio> q+<br>
&lt;dandclark> emilio: I am not sure that's necessarily true. Does need some investigation . RIght now in the cascade spec all @@@ have hte same behavior. So it would feel weird to change the behavior only because multiple selectors can match<br>
&lt;dandclark> ...we could try to fix the cascade spec<br>
&lt;dandclark> ...but that's sort of tangential to this issue<br>
&lt;dandclark> ...but should do that if that's what we really want<br>
&lt;lea> https://github.com/w3c/csswg-drafts/issues/7922#issuecomment-2380098440<br>
&lt;emilio> lea: there are a lot of other things that need to be fixed, see ^<br>
&lt;keithamus> q+<br>
&lt;dandclark> emilio: Seems there's no clear consensus<br>
&lt;emilio> ack emilio<br>
&lt;Rossen9> ack keithamus<br>
&lt;emilio> keithamus: Can you style `:has()` with a combinator? So you'd do `:has(/slotted/ something)`<br>
&lt;emilio> lea: yeah `:has()` supports relative selectors<br>
&lt;emilio> ... first example in mdn<br>
&lt;emilio> Rossen9: let's take this back to the issue<br>
</details>


-- 
GitHub Notification of comment by css-meeting-bot
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/10889#issuecomment-2380301569 using your GitHub account


-- 
Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config

Received on Saturday, 28 September 2024 00:05:15 UTC