[css-pseudo-4] Add a pseudo-element to style all highlight pseudo-elements

[dbaron]

A proposal I made during the discussion in #6641 (comment) is that, given the model proposed in #6641 for how custom properties work on highlight pseudo-elements, is that we should have a pseudo-element that matches all of the highlight pseudo elements. (This means both the Higlight Pseudos and Custom Highlight Pseudos.)

This is a slightly new concept because it means that when an implementation resolves the ::selection pseudo-element (for example), it needs to look at selectors involving ::selection and also the selectiors involving this new pseudo-element. Or, to think about it another way, this is sort of like a pseudo-element alias. That said, I think that still seems like a relatively straightforward feature.

This feature would make it easier for authors who are changing custom properties in a subtree to make sure that those custom properties will work correctly across all the highlight pseudo-elements, without needing to know exactly which highlight pseudo-elements will use the custom properties that they're modifying.

[dbaron]

Two possible names for such a pseudo-element might be ::all-highlights or ::any-highlight, though I'm sure there are other options.

[fantasai]

Naming-wise it should be ::any-highlight rather than ::all-highlights, for consistency with ::any-link.

However, I'm not convinced this is a good idea. It makes sense for custom properties, but as far as non-custom properties go, it's highly unlikely that the author should be styling all the UA-defined highlights (including ones we haven't defined yet) in the same way.

Having ::highlight() match all custom highlights would make sense, though.

[bramus]

(#) This feature would make it easier for authors who are changing custom properties in a subtree to make sure that those custom properties will work correctly across all the highlight pseudo-elements, without needing to know exactly which highlight pseudo-elements will use the custom properties that they're modifying.

In #9909 (comment) I came to the suggestion to have all custom-pseudos inherit their custom properties from their originating element.

I’m not sure what the performance implications would be there, but it would solve the core problem once and for all.

(#) Having ::highlight() match all custom highlights would make sense, though.

For View Transitions we use * to denote “any of these”. I think it would make sense to use the same pattern for ::highlight() as well – i.e. ::highlight(*).

We would also need to adopt to specificity calculation rules as well:

• * = Add 0,0,0
• Not * = Add 0,0,1

[LeaVerou]

As @tabatkins mentioned in #6641 (comment) this is a much broader issue than highlights. The real author need here is to be able to define document-wide custom property values that are available everywhere.

I think instead of introducing more ad-hoc pseudo-elements, we should introduce a pseudo-element or @rule that allows this. Or adopt @tabatkins’s proposal and special case the root, paving the cowpaths.