1751188 - Implement at-rule for use with @supports

Status: ASSIGNED

(Core :: CSS Parsing and Computation, enhancement)

Description

[Bramus]

Steps to reproduce:

As per CSS WG Decision [1]: Implement at-rule function for use with @supports

Syntax:

/* Just the at-rule name, which returns whether this is a recognized at-rule name at all. */
@supports(at-rule(@foo)) {
  /* @foo is supported */
}

/* An at-rule name accompanied by a descriptor declaration, which returns whether the at-rule is recognized, and the given descriptor successfully parses as part of that at-rule.*/
@supports(at-rule(@foo; desc: val)) {
  /* @foo with the descriptor `desc` and value `val` is supported */
}

Note that there's a follow-up issue [2] to extend at-rule() with a third syntax which allows passing in an entire at-rule into at-rule().

/* An entire at-rule, which returns whether or not the at-rule as a whole, when parsed as the first and only content in a fresh stylesheet, is valid or dropped. If the at-rule is valid but drops some of its contents as invalid, such as an unknown descriptor, this will still return true. */
@supports(at-rule(@foo bar {baz: qux})) {
  /* The entire at-rule is supported */
}

It also supports
At the moment, this third syntax is still a WIP.

^[1] https://github.com/w3c/csswg-drafts/issues/2463#issuecomment-1016720310
^[2] https://github.com/w3c/csswg-drafts/issues/6966

Comment 1

[Bramus]

FYI: I am seeing an uptick in requests for this, especially with @property becoming interoperable soon: authors want to detect this. Another request was to detect @starting-style support.

Comment 2

[Pascal Duez [:pldz]]

With CSS scoping and the @scope at-rule reaching Firefox stable (146) in a few days, that would be very handy to be able to detect its support and apply a fallback.

Comment 3

[Sajid Anwar [:sajidanwar]]

Attachment: Bug 1751188 - Implement at-rule() function for CSS @supports. r=#style

Comment 4

[Phabricator Automation]

Comment on attachment 9620942 [details]
Bug 1751188 - Implement at-rule() function for CSS @supports. r=#style

Revision D315884 was moved to bug 2060754. Setting attachment 9620942 [details] to obsolete.

Comment 5

[Sajid Anwar [:sajidanwar]]

Intent to Prototype: https://groups.google.com/a/mozilla.org/g/dev-platform/c/rm53qxu-8xU