feat(css_parser): support @font-face (#1097)

crates/biome_css_parser/src/lexer/mod.rs

@@ -770,6 +770,7 @@ impl<'src> CssLexer<'src> {
  b"charset" => CHARSET_KW,
  b"color-profile" => COLOR_PROFILE_KW,
  b"counter-style" => COUNTER_STYLE_KW,
+ b"font-face" => FONT_FACE_KW,
  _ => IDENT,
  }
  }

crates/biome_css_parser/src/syntax/at_rule/font_face.rs

@@ -0,0 +1,29 @@
+use crate::parser::CssParser;
+use crate::syntax::parse_or_recover_rule_block;
+use biome_css_syntax::CssSyntaxKind::*;
+use biome_css_syntax::T;
+use biome_parser::parsed_syntax::ParsedSyntax::Present;
+use biome_parser::prelude::ParsedSyntax::Absent;
+use biome_parser::prelude::*;
+
+#[inline]
+pub(crate) fn is_at_font_face_at_rule(p: &mut CssParser) -> bool {
+ p.at(T![font_face])
+}
+
+#[inline]
+pub(crate) fn parse_font_face_at_rule(p: &mut CssParser) -> ParsedSyntax {
+ if !is_at_font_face_at_rule(p) {
+ return Absent;
+ }
+
+ let m = p.start();
+
+ p.bump(T![font_face]);
+
+ if parse_or_recover_rule_block(p).is_err() {
+ return Present(m.complete(p, CSS_BOGUS_AT_RULE));
+ }
+
+ Present(m.complete(p, CSS_FONT_FACE_AT_RULE))
+}

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

@@ -1,6 +1,7 @@
 mod charset;
 mod color_profile;
 mod counter_style;
+mod font_face;
 
 use crate::parser::CssParser;
 use crate::syntax::at_rule::charset::{is_at_charset_at_rule, parse_charset_at_rule};
@@ -10,6 +11,7 @@ use crate::syntax::at_rule::color_profile::{
 use crate::syntax::at_rule::counter_style::{
  is_at_counter_style_at_rule, parse_counter_style_at_rule,
 };
+use crate::syntax::at_rule::font_face::{is_at_font_face_at_rule, parse_font_face_at_rule};
 use crate::syntax::parse_error::expected_any_at_rule;
 use biome_css_syntax::CssSyntaxKind::*;
 use biome_css_syntax::T;
@@ -51,6 +53,8 @@ pub(crate) fn parse_any_at_rule(p: &mut CssParser) -> ParsedSyntax {
  parse_color_profile_at_rule(p)
  } else if is_at_counter_style_at_rule(p) {
  parse_counter_style_at_rule(p)
+ } else if is_at_font_face_at_rule(p) {
+ parse_font_face_at_rule(p)
  } else {
  Absent
  }

crates/biome_css_parser/tests/css_test_suite/error/at_rule/at_rule_font_face_error.css

@@ -0,0 +1,3 @@
+@font-face foo {}
+@font-face foo;
+@font-face ;

crates/biome_css_parser/tests/css_test_suite/error/at_rule/at_rule_font_face_error.css.snap

@@ -0,0 +1,220 @@
+---
+source: crates/biome_css_parser/tests/spec_test.rs
+expression: snapshot
+---
+
+## Input
+
+```css
+@font-face foo {}
+@font-face foo;
+@font-face ;
+```
+
+
+## AST
+
+```
+CssRoot {
+ bom_token: missing (optional),
+ rules: CssRuleList [
+ CssAtRule {
+ at_token: AT@0..1 "@" [] [],
+ rule: CssBogusAtRule {
+ items: [
+ FONT_FACE_KW@1..11 "font-face" [] [Whitespace(" ")],
+ ],
+ },
+ },
+ CssRule {
+ prelude: CssSelectorList [
+ CssCompoundSelector {
+ nesting_selector_token: missing (optional),
+ simple_selector: CssTypeSelector {
+ namespace: missing (optional),
+ ident: CssIdentifier {
+ value_token: IDENT@11..15 "foo" [] [Whitespace(" ")],
+ },
+ },
+ sub_selectors: CssSubSelectorList [],
+ },
+ ],
+ block: CssBlock {
+ l_curly_token: L_CURLY@15..16 "{" [] [],
+ declaration_list: CssDeclarationList [],
+ r_curly_token: R_CURLY@16..17 "}" [] [],
+ },
+ },
+ CssAtRule {
+ at_token: AT@17..19 "@" [Newline("\n")] [],
+ rule: CssBogusAtRule {
+ items: [
+ FONT_FACE_KW@19..29 "font-face" [] [Whitespace(" ")],
+ ],
+ },
+ },
+ CssBogusRule {
+ items: [
+ CssSelectorList [
+ CssCompoundSelector {
+ nesting_selector_token: missing (optional),
+ simple_selector: CssTypeSelector {
+ namespace: missing (optional),
+ ident: CssIdentifier {
+ value_token: IDENT@29..32 "foo" [] [],
+ },
+ },
+ sub_selectors: CssSubSelectorList [],
+ },
+ missing separator,
+ CssBogusSelector {
+ items: [
+ SEMICOLON@32..33 ";" [] [],
+ ],
+ },
+ ],
+ ],
+ },
+ CssAtRule {
+ at_token: AT@33..35 "@" [Newline("\n")] [],
+ rule: CssBogusAtRule {
+ items: [
+ FONT_FACE_KW@35..45 "font-face" [] [Whitespace(" ")],
+ CssBogusBody {
+ items: [
+ SEMICOLON@45..46 ";" [] [],
+ ],
+ },
+ ],
+ },
+ },
+ ],
+ eof_token: EOF@46..46 "" [] [],
+}
+```
+
+## CST
+
+```
+0: [email protected]
+ 0: (empty)
+ 1: [email protected]
+ 0: [email protected]
+ 0: [email protected] "@" [] []
+ 1: [email protected]
+ 0: [email protected] "font-face" [] [Whitespace(" ")]
+ 1: [email protected]
+ 0: [email protected]
+ 0: [email protected]
+ 0: (empty)
+ 1: [email protected]
+ 0: (empty)
+ 1: [email protected]
+ 0: [email protected] "foo" [] [Whitespace(" ")]
+ 2: [email protected]
+ 1: [email protected]
+ 0: [email protected] "{" [] []
+ 1: CSS_DECLARATION_LIST@16..16
+ 2: R_CURLY@16..17 "}" [] []
+ 2: CSS_AT_RULE@17..29
+ 0: AT@17..19 "@" [Newline("\n")] []
+ 1: CSS_BOGUS_AT_RULE@19..29
+ 0: FONT_FACE_KW@19..29 "font-face" [] [Whitespace(" ")]
+ 3: CSS_BOGUS_RULE@29..33
+ 0: CSS_SELECTOR_LIST@29..33
+ 0: CSS_COMPOUND_SELECTOR@29..32
+ 0: (empty)
+ 1: CSS_TYPE_SELECTOR@29..32
+ 0: (empty)
+ 1: CSS_IDENTIFIER@29..32
+ 0: IDENT@29..32 "foo" [] []
+ 2: CSS_SUB_SELECTOR_LIST@32..32
+ 1: (empty)
+ 2: CSS_BOGUS_SELECTOR@32..33
+ 0: SEMICOLON@32..33 ";" [] []
+ 4: CSS_AT_RULE@33..46
+ 0: AT@33..35 "@" [Newline("\n")] []
+ 1: CSS_BOGUS_AT_RULE@35..46
+ 0: FONT_FACE_KW@35..45 "font-face" [] [Whitespace(" ")]
+ 1: CSS_BOGUS_BODY@45..46
+ 0: SEMICOLON@45..46 ";" [] []
+ 2: EOF@46..46 "" [] []
+
+```
+
+## Diagnostics
+
+```
+at_rule_font_face_error.css:1:12 parse ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+ × Expected a body but instead found 'foo'.
+ 
+ > 1 │ @font-face foo {}
+ │ ^^^
+ 2 │ @font-face foo;
+ 3 │ @font-face ;
+ 
+ i Expected a body here.
+ 
+ > 1 │ @font-face foo {}
+ │ ^^^
+ 2 │ @font-face foo;
+ 3 │ @font-face ;
+ 
+at_rule_font_face_error.css:2:12 parse ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+ × Expected a body but instead found 'foo'.
+ 
+ 1 │ @font-face foo {}
+ > 2 │ @font-face foo;
+ │ ^^^
+ 3 │ @font-face ;
+ 
+ i Expected a body here.
+ 
+ 1 │ @font-face foo {}
+ > 2 │ @font-face foo;
+ │ ^^^
+ 3 │ @font-face ;
+ 
+at_rule_font_face_error.css:2:15 parse ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+ × expected `,` but instead found `;`
+ 
+ 1 │ @font-face foo {}
+ > 2 │ @font-face foo;
+ │ ^
+ 3 │ @font-face ;
+ 
+ i Remove ;
+ 
+at_rule_font_face_error.css:3:1 parse ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+ × expected `,` but instead found `@`
+ 
+ 1 │ @font-face foo {}
+ 2 │ @font-face foo;
+ > 3 │ @font-face ;
+ │ ^
+ 
+ i Remove @
+ 
+at_rule_font_face_error.css:3:12 parse ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+ × Expected a body but instead found ';'.
+ 
+ 1 │ @font-face foo {}
+ 2 │ @font-face foo;
+ > 3 │ @font-face ;
+ │ ^
+ 
+ i Expected a body here.
+ 
+ 1 │ @font-face foo {}
+ 2 │ @font-face foo;
+ > 3 │ @font-face ;
+ │ ^
+ 
+```
+
+

crates/biome_css_parser/tests/css_test_suite/ok/at_rule/at_rule_font_face.css

@@ -0,0 +1 @@
+@font-face {}

crates/biome_css_parser/tests/css_test_suite/ok/at_rule/at_rule_font_face.css.snap

@@ -0,0 +1,53 @@
+---
+source: crates/biome_css_parser/tests/spec_test.rs
+expression: snapshot
+---
+
+## Input
+
+```css
+@font-face {}
+```
+
+
+## AST
+
+```
+CssRoot {
+ bom_token: missing (optional),
+ rules: CssRuleList [
+ CssAtRule {
+ at_token: AT@0..1 "@" [] [],
+ rule: CssFontFaceAtRule {
+ font_face_token: FONT_FACE_KW@1..11 "font-face" [] [Whitespace(" ")],
+ block: CssBlock {
+ l_curly_token: L_CURLY@11..12 "{" [] [],
+ declaration_list: CssDeclarationList [],
+ r_curly_token: R_CURLY@12..13 "}" [] [],
+ },
+ },
+ },
+ ],
+ eof_token: EOF@13..13 "" [] [],
+}
+```
+
+## CST
+
+```
+0: [email protected]
+ 0: (empty)
+ 1: [email protected]
+ 0: [email protected]
+ 0: [email protected] "@" [] []
+ 1: [email protected]
+ 0: [email protected] "font-face" [] [Whitespace(" ")]
+ 1: [email protected]
+ 0: [email protected] "{" [] []
+ 1: CSS_DECLARATION_LIST@12..12
+ 2: R_CURLY@12..13 "}" [] []
+ 2: EOF@13..13 "" [] []
+
+```
+
+