Re: [csswg-drafts] [css-cascade-6] `&` matching inside the `@scope`, and its interaction with `:scope` (#9740)

> @bramus 
> > https://blog.kizu.dev/scope-selector-nuance/
> I don’t see the problem there, and think the stuff you described there is WAI.

I don't see a problem with it, I shared the link as a part of a question if selector can contain something that is outside of the scope. 

>> PROPOSED: `&` in `@scope` behaves as `:where(:scope)`.
> This feels weird to me, as it’s deviating from what `&` does in nesting.

But we're not exactly in the nesting case with the `@scope`: it is a new scenario, where we have some selector as a scoping root, _which contributes zero specificity_.

If we were to express

```css
@scope (.foo) {
    .bar {…}
}
```

as nesting equivalent right now (omitting the scoping nuances), it would be 

```css
:where(.foo) {
    .bar {…}
}
```

As the scoping root _does not_ contribute any specificity.

And the problem is this implicit “nesting”: having the specificity of this be different from 

```css
@scope (.foo) {
    & .bar {…}
}
```

is pretty weird, because right now the absence of `&` _does_ behave like an implicit `:where(:scope)` already. And if we want to have consistency with nesting, then having `.bar` and `& .bar` be fully equivalent will be less confusing. See https://codepen.io/kizu/pen/VYLJwzZ

So it would be great to make `.bar` and `& .bar` behave the same.

> One thing you could argue here instead, is whether using `@scope` should carve out a subtree based on `<scope-start>` and only consider that subtree in isolation when doing selector matching? Right now it doesn’t, but if it did then it would open up the door to possible performance gains for authors. It would also bypass the whole `.outer :scope .inner` situation.

I don't see the issue with the `.outer :scope .inner` specifically, and as @romainmenke I see the utility of this. If we'd want to have a way to clarify that some part of a selector should target _only_ something inside the scope, this is a different problem, likely covered by https://github.com/w3c/csswg-drafts/issues/9841 (where it is similar with `:has()` checking for something in the donut).



-- 
GitHub Notification of comment by kizu
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/9740#issuecomment-3031933625 using your GitHub account


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

Received on Thursday, 3 July 2025 11:33:22 UTC