Re: [csswg-drafts] [selectors] Pseudo-class to indicate when a slot has content (#6867)

> does a single whitespace text node match :has-slotted?

Agree that this is a nasty foot gun that needs to be addressed. It's not exclusively a CSS issue since it prevents fallback content from displaying. Ideally we'd solve the core issue and _not_ just add a CSS bandaid, but I propose the following in the interests of making concrete progress:

1. keep `has-slotted(...)`: and you can combine with `:not(:has-slotted(...))` to detect elements not selected
2. add `has-slotted-empty`: this matches the same as :empty is [specified](https://drafts.csswg.org/selectors-4/#the-empty-pseudo) and not as it's [implemented](https://developer.mozilla.org/en-US/docs/Web/CSS/:empty) (assuming it will be possible to actually match spec?). **This means it *would* match if whitespace-only nodes are assigned.**

If we don't get this right, the following would show a red box and that seems, to me, a bit absurd.

```html
<x-foo>
  <template shadowrootmode="open">
    <style>
      slot:has-slotted { 
       display: block; 
       height: 20px; 
       background: red;
      }
    </style>
    <slot></slot>
  </template>
</x-foo>
```

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


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

Received on Monday, 23 September 2024 15:41:34 UTC