Re: [csswg-drafts] [css-pseudo-4] Add a pseudo-element to style all highlight pseudo-elements (#9091)

The CSS Working Group just discussed `[css-pseudo-4] Add a pseudo-element to style all highlight pseudo-elements`, and agreed to the following:

* `RESOLVED: Add * to highlight pseudo`
* `RESOLVED: Specificity of * in highlight pseudo is 0`

<details><summary>The full IRC log of that discussion</summary>
&lt;kbabbitt> schenney: context: the custom highlight api and css styling<br>
&lt;kbabbitt> ... each highlight has an ident and a style in css<br>
&lt;kbabbitt> ... and when you use the JS api to add that highlight ident to a range<br>
&lt;kbabbitt> ... everything in that range gets that style<br>
&lt;kbabbitt> ... this issue was raised in relation to custom props<br>
&lt;kbabbitt> .. subsequent changes made that go away<br>
&lt;kbabbitt> ... but it's sitll that if you want to apply certain props to all custom highlights<br>
&lt;kbabbitt> ... you need to repeat for every identifier in your JS<br>
&lt;kbabbitt> ... proposal is to have a special * identifier in CSS so that you can have ::highlight[*]<br>
&lt;kbabbitt> ... which would supplyu props to all custom highlights in the page<br>
&lt;kbabbitt> ... use case: underline type for all custom highlights but each ident might have a different color<br>
&lt;kbabbitt> ... was specifically raised in the issue<br>
&lt;kbabbitt> ... another use case is if you did in CSS highlight * and give it a bunch of props<br>
&lt;kbabbitt> .. then could register different IDs in JS<br>
&lt;kbabbitt> ... and they would all get highlighting from the * highlight<br>
&lt;kbabbitt> ... that would allow diff idents in JS to represent different ranges<br>
&lt;kbabbitt> ... I think this is totally reasonable, and implemented, and would address some developer pain points<br>
&lt;kbabbitt> ... one question: how exactly we deal with the case where there is both * matching all highlight props and a specific ident with a conflicting property<br>
&lt;kbabbitt> ... how to resolve?<br>
&lt;kbabbitt> ... thoughts?<br>
&lt;TabAtkins> q+<br>
&lt;astearns> ack TabAtkins<br>
&lt;kbabbitt> TabAtkins: for the 2nd quiestion of opposing styles<br>
&lt;kbabbitt> ... what seems bvious to me is to do this at style resolution time<br>
&lt;kbabbitt> ... but that's not how you described it here<br>
&lt;kizu> q+<br>
&lt;kbabbitt> ... spelling highlight would receive highlight spelling style since it's more specific than hoghlight *<br>
&lt;kbabbitt> ... both rules apply to spelling element same as if you had 2 spelling rules with contradictory styles<br>
&lt;kbabbitt> schenney: that's the way I understood it<br>
&lt;kbabbitt> ... bramus put in comments implying what TabAtkins just said<br>
&lt;kbabbitt> ... that would not address the case where * has some props and a specific ident has a different set of props<br>
&lt;kbabbitt> ... first question I had was, as far as specificity, does it apply per peroptery within a highlight?<br>
&lt;kbabbitt> ... or does it apply to entire pseudo?<br>
&lt;kbabbitt> TabAtkins: rule is what has specificity<br>
&lt;kbabbitt> ... props that rule applies cascade using rule's specificity<br>
&lt;kbabbitt> ... multiple rules applyikng the same thing, look at selector, that determins which shared props win<br>
&lt;lea> +1 for `::highlight()` or even `::highlight`. I think ideally all functional pseudos should have parameter-less versions. I would be surprised to see that styling `::spelling-error` though, I'd expect that styles all custom highlights and nothing more<br>
&lt;kbabbitt> schenney: I believe that means we could apply bramus's specificity suggestion<br>
&lt;kbabbitt> ... then at style resolution time it would fall through<br>
&lt;kbabbitt> ... (not what I said in my final comment)<br>
&lt;kbabbitt> TabAtkins: right<br>
&lt;kbabbitt> ... it should be exactly the same as if ::spelling-error { color: red } add div::spelling-error {color:blue}<br>
&lt;lea> q+<br>
&lt;kbabbitt> schenney: OK. bramus's suggestion will address<br>
&lt;astearns> ack dbaron<br>
&lt;ntim> This should just match VT functional pseudos for specificity<br>
&lt;kbabbitt> dbaron: was also going to say that the cascade is the normal way to resolve this<br>
&lt;kbabbitt> ... still 2 choices to do it<br>
&lt;kbabbitt> ... you do have the choice of whether to say the ident inside of highlight contributes to specificity where * doesn't<br>
&lt;kbabbitt> ... could define that in different ways but might be constrained by compat<br>
&lt;kbabbitt> ... sounds like that might have been bramus's proposal<br>
&lt;kbabbitt> schenney: thats fundamentally what bramus was getting at<br>
&lt;kbabbitt> ... to paraphrase: highlight with ident has higher specificity than highlight with *<br>
&lt;kbabbitt> dbaron: that's probably one option, modulo compat constraints<br>
&lt;kbabbitt> ... we could say for example taht the ident inside highlight is equivalent to class or tagname specificity<br>
&lt;kbabbitt> ... assuming they have same other stuff in selector, ident would win over *<br>
&lt;kbabbitt> ... the other option is don't try to differentiate based on specificity<br>
&lt;kbabbitt> ... devs could still make one override another by order<br>
&lt;kbabbitt> ... or something else in selector<br>
&lt;astearns> ack kizu<br>
&lt;kbabbitt> kizu: did we consider making a general version not just a functional highlgyt><br>
&lt;kbabbitt> ... were also considering functional version specifies something more specific<br>
&lt;kbabbitt> ... what if we just drop () and it's just highlight?<br>
&lt;TabAtkins> q+ about specificity<br>
&lt;TabAtkins> sighhhhhh<br>
&lt;TabAtkins> ack about<br>
&lt;TabAtkins> ack specificity<br>
&lt;kbabbitt> schenney: that's a question of syntax we use, we could use that to define custom highlight rules<br>
&lt;lea> +1 (in fact, I proposed this above). I think the implied semantics are slightly different though, so need to ask a Q about that<br>
&lt;TabAtkins> q+ to talk about specificity<br>
&lt;kbabbitt> ... bramus thought the * syntax was good because it aligns with similar types of functions<br>
&lt;kbabbitt> ... in view transitions and scroll marker groups<br>
&lt;kbabbitt> ... would be consistent<br>
&lt;astearns> ack lea<br>
&lt;kbabbitt> lea: question: is this pseudo element intended to style every highlight?<br>
&lt;kbabbitt> ... or including spelling error or just custom highlights?<br>
&lt;kbabbitt> schenney: just custom highlight swhich have this problem due to idents<br>
&lt;kbabbitt> lea: agree with kizu that having a version without () makes sense<br>
&lt;ntim> q+<br>
&lt;kbabbitt> ... it's a pattern we've supported before where we allow no parens in functional pseudoes<br>
&lt;kbabbitt> ... bare highlight pseudo might imply to some that it also affects spelling error<br>
&lt;kbabbitt> ... whereas parens makes it more clear<br>
&lt;kbabbitt> ... as a general design principle, if we have () also good to have a version without<br>
&lt;astearns> ack TabAtkins<br>
&lt;Zakim> TabAtkins, you wanted to talk about specificity<br>
&lt;kbabbitt> TabAtkins: re: specificity I don't think there's any back compat issues<br>
&lt;kbabbitt> ... given that highlights are terminal<br>
&lt;kbabbitt> ... we could set whatever specificity we want<br>
&lt;kbabbitt> ... and it wouldn't affect any existing highlight pseudo<br>
&lt;kbabbitt> ... some amount before pseudo, some for pseudo, that's it<br>
&lt;kbabbitt> ... we could still say highlight with a tag is element equivalent, with a * is * equivalent<br>
&lt;astearns> ack ntim<br>
&lt;dbaron> +1 to tab, I was confusing myself earlier :-)<br>
&lt;kbabbitt> ntim: I think we should aim for consistency with view transitions pseudos<br>
&lt;kbabbitt> ... especially functional once<br>
&lt;kbabbitt> s/once/ones/<br>
&lt;kbabbitt> ... where you have to specify either * or ident<br>
&lt;kbabbitt> ... for specificity it should also be consistent with v-t<br>
&lt;kbabbitt> schenney: I couldn't find anything about v-t * specificity or how it would work<br>
&lt;kbabbitt> ... where * and ident could apply to same<br>
&lt;kbabbitt> TabAtkins: in v-t 1 section ??<br>
&lt;kbabbitt> ... talks about pseudos in general<br>
&lt;emilio> https://drafts.csswg.org/css-view-transitions-1/#named-view-transition-pseudo<br>
&lt;kbabbitt> s/??/3.2.1/<br>
&lt;kbabbitt> schenney: did it talk about *?<br>
&lt;dbaron> or https://www.w3.org/TR/css-view-transitions-1/#named-view-transition-pseudo<br>
&lt;kbabbitt> TabAtkins: [quotes spec]<br>
&lt;kbabbitt> ntim: what I said also implies that I don't think we should add a version without parens<br>
&lt;kbabbitt> ... unless we have one for v-t<br>
&lt;kbabbitt> astearns: I think we're converging on allowing * for highlight pseudo<br>
&lt;kbabbitt> ... that applies no specificty, on v-t model<br>
&lt;kbabbitt> ... objections?<br>
&lt;kbabbitt> RESOLVED: Add * to highlight pseudo<br>
&lt;kbabbitt> astearns: whether we have a version without parens can be a separate issue<br>
&lt;kbabbitt> bramus: should we also resolve that specificity is 0?<br>
&lt;kbabbitt> RESOLVED: Specificity of * in highlight pseudo is 0<br>
&lt;kbabbitt> astearns: we are following the v-t model<br>
</details>


-- 
GitHub Notification of comment by css-meeting-bot
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/9091#issuecomment-2773255154 using your GitHub account


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

Received on Wednesday, 2 April 2025 17:30:02 UTC