Re: [w3ctag/design-reviews] Early design review of light-DOM CSS Scope proposal (#593)

> @LeaVerou yeah, I've been working on this today, and came to a similar conclusion.
> 
> * `:to(.c)` doesn't work alone because it doesn't match anything
> * But `:donut(.a / .c)` would have some potential
> 
> I put together a [codepen example](https://codepen.io/mirisuzanne/pen/jOVNJoj) as I was working. It's slightly different from your example, in that I do match the lower-boundary itself, but not descendants of the lower boundary. That's the proposed pattern, used by scoping tools today.

I don't quite understand how to read the pen, but one of the questions in it is whether we can desugar to `:not(.lower-boundary *)`. That doesn't work without `:scope`, as I explained in my previous comment. 

> You can also see some JS there. Given the ability to reference the root `element` with `:scope` in JS, `@scope (.a) to (.c) { * { ... } }` can be represented by `a.querySelectorAll(":not(:scope .c *)")`.

That can only be applied to a single element, so in the common case where you have multiple scope roots, you still have to iterate over them. 

> The `@scope` proposal would allow multiple lower-boundaries. I imagine that could be represented by chaining the pseudo-class?
> 
> ```css
> :donut(.a / .c):donut(.a / .x) {
>   /* establish both .c and .x as lower boundaries */
> }
> ```

Not a huge fan of the repetition of the scope root. No reason to disallow selector lists as the lower boundary (or even both), there is precedent of pseudo-classes accepting selector lists.
 
> > Aside: What does `@scope (S) to (S)` match, where S is any selector? Does it match nothing?
> 
> In my current proposal, lower boundary selectors would only match descendants of the scope, so:
> 
> ```
> <s>
>   <p>This is matched as part of the outer scope</p>
>   <s> <!-- lower-boundary of outer scope, and root of inner scope -->
>     <p>This is not part of the outer scope, but it does match as part of the inner scope</p>
>   </s>
> </s>
> ```
> 
> (I suppose that means it would match the same as `@scope (S)` without a lower boundary…)

I think you perhaps misunderstood my question. `S` was a variable that could be any selector, not a type selector. E.g. what does `@scope (.foo) to (.foo)` match? It seems to me that it would match `.foo` and not its descendants, but I'm not sure.

-- 
You are receiving this because you are subscribed to this thread.
Reply to this email directly or view it on GitHub:
https://github.com/w3ctag/design-reviews/issues/593#issuecomment-770766794