refactor(css/parser): many fixes

crates/swc_css_codegen/src/lib.rs

@@ -1473,7 +1473,11 @@ where
         }
 
         if is_custom_property {
-            self.emit_list(&n.value, ListFormat::NotDelimited)?;
+            self.with_ctx(Ctx {
+                in_list_of_component_values: true,
+                ..self.ctx
+            })
+            .emit_list(&n.value, ListFormat::NotDelimited)?;
         } else {
             self.emit_list_of_component_values_inner(
                 &n.value,

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

@@ -1,4 +1,4 @@
-@supports (--x: y , z ) {
+@supports (--x: y , z) {
   a {
     color: red;
   }

crates/swc_css_codegen/tests/fixture/declaration/custom-properties/output.css

@@ -1,11 +1,11 @@
 div {
   --y: ;
-  --x: var(--y) ;
+  --x: var(--y);
   --z: 0px;
   --foo: if(x > 5) this.width = 10;
   --bar: ;
   --bar2: ;
-  --yz: foo  !important;
+  --yz: foo!important;
 }
 div {
   width: var(--a,);
@@ -59,10 +59,10 @@ div {
   --x: y;
 }
 * {
-  --x: y ;
+  --x: y;
 }
 * {
-  --x: y, ;
+  --x: y,;
 }
 * {
   --x: var(y,);
@@ -74,7 +74,7 @@ div {
   --x: (y);
 }
 * {
-  --x: (y) ;
+  --x: (y);
 }
 * {
   --x: (y);
@@ -89,7 +89,7 @@ div {
   --x: f(y);
 }
 * {
-  --x: f(y) ;
+  --x: f(y);
 }
 * {
   --x: f(y);
@@ -104,7 +104,7 @@ div {
   --x: [y];
 }
 * {
-  --x: [y] ;
+  --x: [y];
 }
 * {
   --x: [y];
@@ -119,7 +119,7 @@ div {
   --x: {y};
 }
 * {
-  --x: {y} ;
+  --x: {y};
 }
 * {
   --x: {y};
@@ -130,7 +130,7 @@ div {
 * {
   --x: { y};
 }
-@supports (--x: y , z ) {
+@supports (--x: y , z) {
   a {
     color: red;
   }

crates/swc_css_codegen/tests/fixture/declaration/important/output.css

@@ -1,5 +1,5 @@
 :root {
-  --foo: red !important;
+  --foo: red!important;
   --foo: red!important;
 }
 div {
@@ -24,7 +24,8 @@ a {
   }
 }
 .foo {
-  color: red !ie;}
+  color: red !ie;
+}
 * {
   --x: !important;
 }

crates/swc_css_codegen/tests/fixture/preserved-token/custom-properties/output.css

@@ -17,10 +17,10 @@
   --x: y;
 }
 * {
-  --x: y ;
+  --x: y;
 }
 * {
-  --x: y, ;
+  --x: y,;
 }
 * {
   --x: var(y,);
@@ -29,7 +29,7 @@
   --x: (y);
 }
 * {
-  --x: (y) ;
+  --x: (y);
 }
 * {
   --x: (y);
@@ -44,7 +44,7 @@
   --x: f(y);
 }
 * {
-  --x: f(y) ;
+  --x: f(y);
 }
 * {
   --x: f(y);
@@ -59,7 +59,7 @@
   --x: [y];
 }
 * {
-  --x: [y] ;
+  --x: [y];
 }
 * {
   --x: [y];
@@ -74,7 +74,7 @@
   --x: {y};
 }
 * {
-  --x: {y} ;
+  --x: {y};
 }
 * {
   --x: {y};

crates/swc_css_codegen/tests/fixture/qualified_rule/recovery/output.css

@@ -23,7 +23,7 @@ $bad: rule;
 a {
   div.major { color: blue } color: red }
 a {
-  div: hover { color: blue } color:red;
+  div: hover { color: blue } color: red;
 }
 a {
   div: hover { color: blue };

crates/swc_css_codegen/tests/fixture/qualified_rule/recovery/output.min.css

@@ -1,4 +1,4 @@
 {}{color:red}#broken# {color:red}$bad{color:red}$bad {color:red}$bad foo{color:red}$bad foo {color:red}$bad: rule;
 
 
-a {div.major { color: blue } color: red }a{div:hover{ color: blue }color:red}a{div:hover{ color: blue };color:red}
+a {div.major { color: blue } color: red }a{div:hover { color: blue } color: red}a{div:hover{ color: blue };color:red}

crates/swc_css_codegen/tests/fixture/style-blocks-contents/hacks/output.css

@@ -135,7 +135,8 @@ body:first-of-type .selector {}
   |property: value;color: red;
 }
 .selector {
-  property: value !ie;}
+  property: value !ie;
+}
 @media screen\9  {}
 @media \0screen\,screen\9  {}
 @media \0screen {}

crates/swc_css_codegen/tests/fixture/values/url/1/output.css

@@ -45,7 +45,8 @@ div {
   background: url('\"foo\"');
 }
 .bar {
-  background: url(http://example.com/image.svg param(--color var(--primary-color)));}
+  background: url(http://example.com/image.svg param(--color var(--primary-color);
+}
 .baz {
   background: url("http://example.com/image.svg" param(--color var(--primary-color)));
 }

crates/swc_css_lints/src/rules/unit_no_unknown.rs

@@ -48,4 +48,21 @@ impl Visit for UnitNoUnknown {
 
         unknown_dimension.visit_children_with(self);
     }
+
+    fn visit_component_value(&mut self, component_value: &ComponentValue) {
+        if let ComponentValue::PreservedToken(
+            token_and_span @ TokenAndSpan {
+                token: Token::Dimension { unit, .. },
+                ..
+            },
+        ) = component_value
+        {
+            if self.ignored_units.iter().all(|item| !item.is_match(unit)) {
+                let message = format!("Unexpected unknown unit \"{}\".", unit);
+                self.ctx.report(token_and_span, message);
+            }
+        }
+
+        component_value.visit_children_with(self);
+    }
 }

crates/swc_css_lints/tests/rules/fail/unit-no-unknown/default/output.stderr

@@ -26,7 +26,7 @@
   x Unexpected unknown unit "pix".
    ,-[$DIR/tests/rules/fail/unit-no-unknown/default/input.css:5:1]
  5 | a { color: rgb(255pix, 0, 51); }
-   :                   ^^^
+   :                ^^^^^^
    `----
 
   x Unexpected unknown unit "pix".