[css-pseudo] Allow custom Properties in ::selection pseudos (revisited) (original) (raw)

Chromium continues to try to ship the Highlight Inheritance model for selection. The third attempt has failed because CSS pre-processing and generation tools create ::selection rules like this:

div::selection { --my-opacity: 1; background-color: rgb(0 0 0/var(--my-opacity)); }

In #6264 we allowed custom properties on highlight pseudos.

Then in #6641 we also said that all custom properties should be copied from the root for the root::selection, and then start adding those in the ::selection inheritance path.

This proved insufficient when launched in Chromium because many sites rely on ::selection inheriting custom properties from their originating elements. So we discussed disallowing custom properties in highlights and inheriting from the originating elements, and resolved to do that in #9909.

@tabatkins commented in #6641 that the example above must be allowed for their support. @LeaVerou also raised the same concern in one of the issues above. I did not pay enough attention to that. So the change from #9909 broke many many major sites.

To make it possible to ship highlight inheritance for ::selection, and bring ::selection implementations into line with other highlight pseudos, I believe we need this ...

::selection pseudo elements inherit custom properties from their originating-element and then apply custom properties from the ::selection rule itself. Custom properties from ::selection rules apply only within that rule, and are not inherited by descendants.

My current thinking is that we limit this behavior to ::selection and not other highlight pseudos, as a back-compatibility requirement. It's not a strongly held position.

Proposing async resolution but feel free to add to the agenda. 4 week time limit given holidays.

@delan @fantasai @frivoal