[meta] Support multiple comma-separated queries in @container rules
Categories
(Core :: CSS Parsing and Computation, enhancement)
Tracking
()
People
(Reporter: jfkthame, Unassigned)
References
(Blocks 2 open bugs)
Details
(Keywords: meta)
E.g. @container style(--foo: bar), --container style(--foo: bar) { ... }, as seen in multiple-style-containers-comma-separated-queries.html in the interop-2026 list of tests.
| Reporter | ||
Comment 1•2 months ago
|
||
I think this basically requires enhancing ContainerCondition to hold a list of container names and rules, or alternatively leave ContainerCondition as-is and extend ContainerRule to allow a list of ContainerConditions. (And either way, update the associated parsing and matching code to handle the list.)
Comment 2•2 months ago
|
||
Doing just a bit of investigation, I see two obvious things that need to be done.
It seems the easiest to change ContainerRule::condition to be something like a Box<[]> or smallvec to hold the set of conditions:
https://searchfox.org/firefox-main/rev/1f43fe5ffadde0b6898daf607cabb3335dd75d6f/servo/components/style/stylesheets/container_rule.rs#39
Parsing needs implementation, though this looks pretty easy to implement just by making the change to ContainerRule and then working bottom-up to the parser code from there.
Possibly add support to query number of conditions and get by index in glue, or this should assemble the entire CSS text? The spec seems a little odd in how this should work...
https://searchfox.org/firefox-main/rev/1f43fe5ffadde0b6898daf607cabb3335dd75d6f/servo/ports/geckolib/glue.rs#3486
It seems like maybe the spec either hasn't caught up to this feature yet for the DOM API given how containerQuery is specified? Or should it actually return the comma-separated list? The spec indicates it returns a single container query, but the rules can have multiple queries. It seems strange to me but I might be missing something in the spec that does clarify to me.
https://drafts.csswg.org/css-conditional-5/#the-csscontainerrule-interface
This also seems a little incompatible with the wording of the conditionText in CSSConditionRule, since that implies a single condition?
https://www.w3.org/TR/css-conditional-3/#cssconditionrule
Given that the spec specifically says the conditionText of a ContainerRule should be the concatenation of containerName and containerQuery, it seems like an oversight that getting multiple queries sounds impossible.
| Reporter | ||
Comment 3•2 months ago
|
||
Yes, there's a spec issue to be sorted out for the CSSOM APIs here; see https://github.com/w3c/csswg-drafts/issues/10845. We should try to nudge that forwards -- once we have implementation work going on to support multiple conditions, that should provide some incentive to get it resolved.
| Reporter | ||
Updated•2 months ago
|
| Reporter | ||
Comment 4•2 months ago
|
||
Given the currently-open spec issue regarding the CSSContainerRule interface, let's make this a metabug for the overall feature, and split out implementation bugs for parsing and matching (which I think are ready to be implemented, and will make the current WPT test pass) and for the update to interfaces, which depends on getting the spec issue resolved.
| Reporter | ||
Comment 5•1 month ago
|
||
Closing, as this is now implemented, and the relevant WPTs are passing.
Description
•