fix(css): parse scroll-state and general-enclosed queries

.changeset/fix-false-positive-container-query-diagnostics.md

@@ -0,0 +1,10 @@
+---
+"@biomejs/biome": patch
+---
+
+Fixed [#9253](https://github.com/biomejs/biome/issues/9253): removed false-positive diagnostics for valid `@container`/`@supports` general-enclosed queries.
+
+```css
+@container scroll-state(scrolled: bottom) { }
+@supports foo(bar: baz) { }
+```

crates/biome_css_formatter/tests/specs/css/scss/at-rule/container-general-enclosed.scss

@@ -0,0 +1,17 @@
+@container (foo(bar: baz)) {
+  .a { color: red; }
+}
+
+@container (foo(bar: baz)) and (width > 100px) {
+  .b { color: blue; }
+}
+
+@container (foo(url("a.svg" namespace.fn(test)))) {
+  .c { color: green; }
+}
+
+@container  main-layout  and( test )  {  }
+
+@container  main-layout  or( test )  {  }
+
+@container  main-layout  foo( url("a.svg" fn(test) ) )  {  }

crates/biome_css_formatter/tests/specs/css/scss/at-rule/container-general-enclosed.scss.snap

@@ -0,0 +1,70 @@
+---
+source: crates/biome_formatter_test/src/snapshot_builder.rs
+assertion_line: 212
+info: css/scss/at-rule/container-general-enclosed.scss
+---
+
+# Input
+
+```scss
+@container (foo(bar: baz)) {
+  .a { color: red; }
+}
+
+@container (foo(bar: baz)) and (width > 100px) {
+  .b { color: blue; }
+}
+
+@container (foo(url("a.svg" namespace.fn(test)))) {
+  .c { color: green; }
+}
+
+@container  main-layout  and( test )  {  }
+
+@container  main-layout  or( test )  {  }
+
+@container  main-layout  foo( url("a.svg" fn(test) ) )  {  }
+
+```
+
+
+=============================
+
+# Outputs
+
+## Output 1
+
+-----
+Indent style: Tab
+Indent width: 2
+Line ending: LF
+Line width: 80
+Quote style: Double Quotes
+Trailing newline: true
+-----
+
+```scss
+@container (foo(bar: baz)) {
+  .a { color: red; }
+}
+
+@container (foo(bar: baz)) and (width > 100px) {
+  .b { color: blue; }
+}
+
+@container (foo(url("a.svg"namespace.fn(test)))) {
+	.c {
+		color: green;
+	}
+}
+
+@container main-layout and(test) {
+}
+
+@container main-layout or(test) {
+}
+
+@container main-layout foo(url("a.svg"fn(test))) {
+}
+
+```

crates/biome_css_formatter/tests/specs/css/scss/at-rule/supports-general-enclosed.scss

@@ -0,0 +1,11 @@
+@supports foo(bar: baz) {
+  .a { color: red; }
+}
+
+@supports (foo(bar: baz)) and (display: grid) {
+  .b { display: grid; }
+}
+
+@supports foo(url("a.svg" namespace.fn(test))) {
+  .c { color: green; }
+}

crates/biome_css_formatter/tests/specs/css/scss/at-rule/supports-general-enclosed.scss.snap

@@ -0,0 +1,59 @@
+---
+source: crates/biome_formatter_test/src/snapshot_builder.rs
+assertion_line: 212
+info: css/scss/at-rule/supports-general-enclosed.scss
+---
+
+# Input
+
+```scss
+@supports foo(bar: baz) {
+  .a { color: red; }
+}
+
+@supports (foo(bar: baz)) and (display: grid) {
+  .b { display: grid; }
+}
+
+@supports foo(url("a.svg" namespace.fn(test))) {
+  .c { color: green; }
+}
+
+```
+
+
+=============================
+
+# Outputs
+
+## Output 1
+
+-----
+Indent style: Tab
+Indent width: 2
+Line ending: LF
+Line width: 80
+Quote style: Double Quotes
+Trailing newline: true
+-----
+
+```scss
+@supports foo(bar: baz) {
+	.a {
+		color: red;
+	}
+}
+
+@supports (foo(bar: baz)) and (display: grid) {
+	.b {
+		display: grid;
+	}
+}
+
+@supports foo(url("a.svg"namespace.fn(test))) {
+	.c {
+		color: green;
+	}
+}
+
+```

crates/biome_css_parser/src/syntax/at_rule/container/mod.rs

@@ -12,9 +12,10 @@ use crate::syntax::at_rule::error::{
 use crate::syntax::at_rule::feature::{expected_any_query_feature, parse_any_query_feature};
 use crate::syntax::block::parse_conditional_block;
 use crate::syntax::parse_error::expected_non_css_wide_keyword_identifier;
-use crate::syntax::value::function::is_nth_at_function;
+use crate::syntax::value::function::{is_at_any_css_function, is_nth_at_css_function};
 use crate::syntax::{
-    is_at_declaration, parse_custom_identifier, parse_declaration, parse_regular_identifier,
+    is_at_declaration, parse_any_css_value, parse_custom_identifier, parse_declaration,
+    parse_regular_identifier,
 };
 use biome_css_syntax::CssSyntaxKind::*;
 use biome_css_syntax::{CssSyntaxKind, T};
@@ -116,7 +117,7 @@ pub(crate) fn parse_any_container_query(p: &mut CssParser) -> ParsedSyntax {
     if is_at_container_not_query(p) {
         parse_container_not_query(p)
     } else {
-        parse_any_container_query_in_parens(p).map(|lhs| match p.cur() {
+        parse_any_container_query_in_parens(p, None).map(|lhs| match p.cur() {
             T![and] => parse_container_and_query(p, lhs),
             T![or] => parse_container_or_query(p, lhs),
             _ => lhs,
@@ -141,7 +142,7 @@ fn parse_container_and_query(p: &mut CssParser, lhs: CompletedMarker) -> Complet
     let m = lhs.precede(p);
     p.bump(T![and]);
 
-    let recovery_result = parse_any_container_query_in_parens(p)
+    let recovery_result = parse_any_container_query_in_parens(p, Some(T![and]))
         .or_recover(
             p,
             &AnyInParensChainParseRecovery::new(T![and]),
@@ -177,7 +178,7 @@ fn parse_container_or_query(p: &mut CssParser, lhs: CompletedMarker) -> Complete
     let m = lhs.precede(p);
     p.bump(T![or]);
 
-    let recovery_result = parse_any_container_query_in_parens(p)
+    let recovery_result = parse_any_container_query_in_parens(p, Some(T![or]))
         .or_recover(
             p,
             &AnyInParensChainParseRecovery::new(T![or]),
@@ -205,7 +206,7 @@ fn is_at_container_not_query(p: &mut CssParser) -> bool {
 
 #[inline]
 fn is_at_container_scroll_state_query(p: &mut CssParser) -> bool {
-    is_nth_at_function(p, 0) && p.cur_text().eq_ignore_ascii_case("scroll-state")
+    is_nth_at_css_function(p, 0) && p.cur_text().eq_ignore_ascii_case("scroll-state")
 }
 
 #[inline]
@@ -404,7 +405,7 @@ fn parse_container_not_query(p: &mut CssParser) -> ParsedSyntax {
     let m = p.start();
 
     p.bump(T![not]);
-    parse_any_container_query_in_parens(p)
+    parse_any_container_query_in_parens(p, None)
         .or_recover(
             p,
             &AnyQueryParseRecovery,
@@ -416,7 +417,10 @@ fn parse_container_not_query(p: &mut CssParser) -> ParsedSyntax {
 }
 
 #[inline]
-pub(crate) fn parse_any_container_query_in_parens(p: &mut CssParser) -> ParsedSyntax {
+pub(crate) fn parse_any_container_query_in_parens(
+    p: &mut CssParser,
+    chain_token: Option<CssSyntaxKind>,
+) -> ParsedSyntax {
     if is_at_container_style_query_in_parens(p) {
         parse_container_style_query_in_parens(p)
     } else if is_at_container_query_in_parens(p) {
@@ -425,6 +429,17 @@ pub(crate) fn parse_any_container_query_in_parens(p: &mut CssParser) -> ParsedSy
         parse_container_size_feature_in_parens(p)
     } else if is_at_container_scroll_state_query(p) {
         parse_container_scroll_state_query(p)
+    } else if is_at_any_css_function(p) {
+        // Here we're inside a <general-enclosed> branch,
+        // which means that the parser is at unknown syntax.
+        //
+        // If we're inside a chain, we can try to recover over a chain token.
+        if let Some(chain_token) = chain_token
+            && p.at(chain_token)
+        {
+            return Absent;
+        }
+        parse_any_css_value(p)
     } else {
         Absent
     }

crates/biome_css_parser/src/syntax/at_rule/supports/mod.rs

@@ -8,7 +8,7 @@ use crate::syntax::at_rule::supports::error::{
 use crate::syntax::block::parse_conditional_block;
 use crate::syntax::parse_error::{expected_declaration, expected_selector};
 use crate::syntax::selector::parse_selector;
-use crate::syntax::{is_nth_at_identifier, parse_any_value, parse_declaration};
+use crate::syntax::{is_nth_at_identifier, parse_any_css_value, parse_declaration};
 use biome_css_syntax::CssSyntaxKind::*;
 use biome_css_syntax::{CssSyntaxKind, T};
 use biome_parser::parse_recovery::ParseRecovery;
@@ -230,7 +230,7 @@ fn parse_any_supports_condition_in_parens(
         {
             return Absent;
         }
-        parse_any_value(p)
+        parse_any_css_value(p)
     }
 }