Re: [csswg-drafts] [css-pseudo-4] Proxying pseudo-elements as "real" (`<slot>`) elements (#12575)

One interesting thing this can enable is using pseudo-elements as invokers.
```html
    <html>
      <slot pseudo="::view-transition-group(thing)" command="show-popover" commandfor="">
    </html>
```

> A few questions:
> 
> * I'll cite [@flackr](https://github.com/flackr) from [How to handle addEventListener on `CSSPseudoElement`? #12163 (comment)](https://github.com/w3c/csswg-drafts/issues/12163#issuecomment-3175171832):
> 
> > Not all pseudo-elements are trivially replaced with real elements. There are many use cases where they are dynamically generated, even according to layout as in the carousel use case where you get a ::column::scroll-marker for each page of content which depends on the layout of the box (e.g. [chrome.dev/carousel/horizontal/pages](https://chrome.dev/carousel/horizontal/pages/), [codepen.io/flackr/pen/yLmyPEV](https://codepen.io/flackr/pen/yLmyPEV)). Developers cannot simply provide real elements because they don't know how many or which items are in each column.

I think it's OK if there is one element that represents all of them and receives all the events, with enough querying options to reflect which column/scroll-marker etc. it is. We can have the indexed thing on a case-by-case basis if the listener needs this in advance for some reason.

> * Will there be a way to understand that the pseudo "exists"? For CSSPseudoElement there is a plan for [Add a property to the `CSSPseudoElement` IDL interface to determine if a pseudo element "exists" #12158](https://github.com/w3c/csswg-drafts/issues/12158).

Sure, an element that is a proxy to a pseudo-element can have a boolean attribute getter for this.



> I'm also skeptical to re-using `<slot>`. Even if you introduce a new attribute, for instance `pseudo`, there is an interaction issue with shadow dom slotting if the pseudo element is in a shadow tree:

Perhaps it can be any element, with `pseudo` (and potentially `pseudofor`) attribute.
These elements would have `display: none` by default, and would share anything semantic from the element and anything rendering/layout related from the pseudo-element.




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


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

Received on Thursday, 14 August 2025 14:20:32 UTC