feat: parse general enclosed

crates/swc_css_ast/src/at_rule/support.rs

@@ -1,6 +1,6 @@
 use swc_common::{ast_node, Span};
 
-use crate::{Declaration, SimpleBlock};
+use crate::{Declaration, Function, SimpleBlock};
 
 #[ast_node("SupportsRule")]
 pub struct SupportsRule {
@@ -55,11 +55,23 @@ pub enum SupportsInParens {
 
     #[tag("SupportsFeature")]
     Feature(SupportsFeature),
-    // TODO <general-enclosed>
+
+    #[tag("GeneralEnclosed")]
+    GeneralEnclosed(GeneralEnclosed),
 }
 
 #[ast_node]
 pub enum SupportsFeature {
     #[tag("Declaration")]
     Declaration(Declaration),
+    #[tag("Function")]
+    Function(Function),
+}
+
+#[ast_node]
+pub enum GeneralEnclosed {
+    #[tag("Function")]
+    Function(Function),
+    #[tag("SimpleBlock")]
+    SimpleBlock(SimpleBlock),
 }

crates/swc_css_ast/src/value.rs

@@ -2,7 +2,7 @@ use string_enum::StringEnum;
 use swc_atoms::JsWord;
 use swc_common::{ast_node, EqIgnoreSpan, Span};
 
-use crate::{SimpleBlock, TokenAndSpan};
+use crate::{ComplexSelector, SimpleBlock, TokenAndSpan};
 
 #[ast_node]
 pub enum Value {
@@ -48,6 +48,9 @@ pub enum Value {
     #[tag("Urange")]
     Urange(Urange),
 
+    #[tag("ComplexSelector")]
+    ComplexSelector(ComplexSelector),
+
     #[tag("PreservedToken")]
     PreservedToken(TokenAndSpan),
 }

crates/swc_css_codegen/src/lib.rs

@@ -534,18 +534,30 @@ where
                 punct!(self, ")");
             }
             SupportsInParens::Feature(n) => emit!(self, n),
+            SupportsInParens::GeneralEnclosed(n) => emit!(self, n),
         }
     }
 
     #[emitter]
     fn emit_supports_feature(&mut self, n: &SupportsFeature) -> Result {
-        punct!(self, "(");
-
         match n {
-            SupportsFeature::Declaration(n) => emit!(self, n),
+            SupportsFeature::Declaration(n) => {
+                punct!(self, "(");
+
+                emit!(self, n);
+
+                punct!(self, ")");
+            }
+            SupportsFeature::Function(n) => emit!(self, n),
         }
+    }
 
-        punct!(self, ")");
+    #[emitter]
+    fn emit_general_enclosed(&mut self, n: &GeneralEnclosed) -> Result {
+        match n {
+            GeneralEnclosed::Function(n) => emit!(self, n),
+            GeneralEnclosed::SimpleBlock(n) => emit!(self, n),
+        }
     }
 
     #[emitter]
@@ -783,6 +795,7 @@ where
             Value::Url(n) => emit!(self, n),
             Value::Delimiter(n) => emit!(self, n),
             Value::Urange(n) => emit!(self, n),
+            Value::ComplexSelector(n) => emit!(self, n),
             Value::PreservedToken(n) => emit!(self, n),
         }
     }

crates/swc_css_codegen/tests/fixture/at-rules/supports/3/output.css

@@ -13,7 +13,23 @@ a {
 color: red;
 }
 }
-@supports ( --x y , z ) { a { color: red; } }
-@supports ( --x ) { a { color: red; } }
-@supports ( ) { a { color: red; } }
-@supports ( . --x : y , z ) { a { color: red; } }
+@supports ( --x y , z ) {
+a {
+color: red;
+}
+}
+@supports ( --x ) {
+a {
+color: red;
+}
+}
+@supports ( ) {
+a {
+color: red;
+}
+}
+@supports ( . --x : y , z ) {
+a {
+color: red;
+}
+}

crates/swc_css_parser/src/parser/at_rule.rs

@@ -912,21 +912,36 @@ where
     fn parse(&mut self) -> PResult<SupportsInParens> {
         let state = self.input.state();
 
-        expect!(self, "(");
+        match self.parse() {
+            Ok(feature) => Ok(SupportsInParens::Feature(feature)),
+            Err(_) => {
+                self.input.reset(&state);
 
-        self.input.skip_ws()?;
+                let mut parse_condition = || {
+                    expect!(self, "(");
 
-        if !is!(self, "(") && !is_case_insensitive_ident!(self, "not") {
-            self.input.reset(&state);
+                    let condition = self.parse()?;
 
-            return Ok(SupportsInParens::Feature(self.parse()?));
-        }
+                    expect!(self, ")");
 
-        let condition = SupportsInParens::SupportsCondition(self.parse()?);
+                    Ok(SupportsInParens::SupportsCondition(condition))
+                };
 
-        expect!(self, ")");
+                match parse_condition() {
+                    Ok(condition) => Ok(condition),
+                    Err(_) => {
+                        self.input.reset(&state);
 
-        Ok(condition)
+                        match self.parse() {
+                            Ok(general_enclosed) => {
+                                Ok(SupportsInParens::GeneralEnclosed(general_enclosed))
+                            }
+                            Err(err) => Err(err),
+                        }
+                    }
+                }
+            }
+        }
     }
 }
 
@@ -935,17 +950,63 @@ where
     I: ParserInput,
 {
     fn parse(&mut self) -> PResult<SupportsFeature> {
-        expect!(self, "(");
+        match cur!(self) {
+            tok!("(") => {
+                bump!(self);
 
-        self.input.skip_ws()?;
+                self.input.skip_ws()?;
 
-        let declaration = self.parse()?;
+                let declaration = self.parse()?;
 
-        self.input.skip_ws()?;
+                self.input.skip_ws()?;
 
-        expect!(self, ")");
+                expect!(self, ")");
+
+                Ok(SupportsFeature::Declaration(declaration))
+            }
+            Token::Function { value, .. } if &*value.to_lowercase() == "selector" => {
+                let ctx = Ctx {
+                    in_supports_at_rule: true,
+                    ..self.ctx
+                };
+                let function = self.with_ctx(ctx).parse_as::<Function>()?;
 
-        Ok(SupportsFeature::Declaration(declaration))
+                Ok(SupportsFeature::Function(function))
+            }
+            _ => {
+                let span = self.input.cur_span()?;
+
+                Err(Error::new(
+                    span,
+                    ErrorKind::Expected("'(' or 'function' token"),
+                ))
+            }
+        }
+    }
+}
+
+impl<I> Parse<GeneralEnclosed> for Parser<I>
+where
+    I: ParserInput,
+{
+    fn parse(&mut self) -> PResult<GeneralEnclosed> {
+        match cur!(self) {
+            tok!("function") => Ok(GeneralEnclosed::Function(self.parse()?)),
+            tok!("(") => {
+                bump!(self);
+
+                // TODO validate on first ident
+                Ok(GeneralEnclosed::SimpleBlock(self.parse_simple_block(')')?))
+            }
+            _ => {
+                let span = self.input.cur_span()?;
+
+                Err(Error::new(
+                    span,
+                    ErrorKind::Expected("function or '(' token"),
+                ))
+            }
+        }
     }
 }
 
@@ -1585,6 +1646,7 @@ where
         let ctx = Ctx {
             in_page_at_rule: true,
             grammar: Grammar::DeclarationList,
+            ..self.ctx
         };
         let block = self.with_ctx(ctx).parse_as::<SimpleBlock>()?;
 

crates/swc_css_parser/src/parser/mod.rs

@@ -48,6 +48,7 @@ impl Default for Grammar {
 struct Ctx {
     grammar: Grammar,
 
+    in_supports_at_rule: bool,
     in_page_at_rule: bool,
 }
 

crates/swc_css_parser/src/parser/value/mod.rs

@@ -485,6 +485,15 @@ where
                     self.input.skip_ws()?;
                 }
             }
+            "selector" if self.ctx.in_supports_at_rule => {
+                self.input.skip_ws()?;
+
+                let selector = Value::ComplexSelector(self.parse()?);
+
+                values.push(selector);
+
+                self.input.skip_ws()?;
+            }
             _ => loop {
                 self.input.skip_ws()?;
 

crates/swc_css_parser/tests/fixture/at-rule/supports/input.css

@@ -35,3 +35,86 @@
 @supports ((transition-property: color) OR (animation-name: foo)) AND (transform: rotate(10deg)) {}
 @supports (transition-property: color) OR ((animation-name: foo) AND (transform: rotate(10deg))) {}
 @supports (NOT (display: flex)) {}
+
+@supports selector(col || td) {
+    col.selected || td {
+        background: tan;
+    }
+}
+
+@supports selector(:focus-visible) {
+    a:focus-visible {
+        background: yellow;
+    }
+}
+
+@supports (--element(".minwidth")) {
+    [--self] {
+        background: greenyellow;
+    }
+}
+
+@supports (ident: 1) {
+    * { background: red; }
+}
+
+@supports ((ident: 1)) {
+    * { background: red; }
+}
+
+@supports (ident "str") {
+    * { background: red; }
+}
+
+@supports ((ident "str")) {
+    * { background: red; }
+}
+
+@supports func(10, 20, 40) {
+    * { background: red; }
+}
+
+@supports (func(10, 20, 40)) {
+    * { background: red; }
+}
+
+@supports (   func(   10   ,   20   ,   40   )  ) {
+    * { background: red; }
+}
+
+@supports (animation-name: test) {
+    @-custom-keyframe anim {
+        from {
+            color: black;
+        }
+        to {
+            color: white
+        }
+    }
+}
+
+@supports (--var) {
+    * { background: red; }
+}
+
+@supports (--foo: green) {
+    body {
+        color: var(--varName);
+    }
+}
+
+@supports not selector(:is(a, b)) {
+    ul > li,
+    ol > li {
+        color: red;
+    }
+}
+
+@supports selector(:nth-child(1n of a, b)) {
+    :is(
+      :nth-child(1n of ul, ol) a,
+      details > summary
+  ) {
+      color: red
+    }
+}