Skip to content

Commit 5f42630

Browse files
denbezrukovdyc3ematipico
authored
fix(css_parser): use a conditional block for the @starting-style at-rule (#6553)
Co-authored-by: Emanuele Stoppa <[email protected]> Co-authored-by: dyc3 <[email protected]> Co-authored-by: ematipico <[email protected]>
1 parent fd68458 commit 5f42630

12 files changed

Lines changed: 181 additions & 173 deletions

File tree

‎.changeset/moody-suns-exist.md‎

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
---
2+
"@biomejs/biome": patch
3+
---
4+
5+
Fixed [#6547](https://github.com/biomejs/biome/issues/6547). Now the Biome CSS parser correctly parses `@starting-style` when it's used inside other at-rules. The following example doesn't raise an error anymore:
6+
7+
```css
8+
@layer my-demo-layer {
9+
@starting-style {
10+
div.showing {
11+
background-color: red;
12+
}
13+
}
14+
}
15+
```

‎crates/biome_css_factory/src/generated/node_factory.rs‎

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎crates/biome_css_factory/src/generated/syntax_factory.rs‎

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎crates/biome_css_formatter/src/css/any/mod.rs‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -65,7 +65,6 @@ pub(crate) mod rule_block;
6565
pub(crate) mod scope_range;
6666
pub(crate) mod selector;
6767
pub(crate) mod simple_selector;
68-
pub(crate) mod starting_style_block;
6968
pub(crate) mod sub_selector;
7069
pub(crate) mod supports_and_combinable_condition;
7170
pub(crate) mod supports_condition;

‎crates/biome_css_formatter/src/css/any/starting_style_block.rs‎

Lines changed: 0 additions & 16 deletions
This file was deleted.

‎crates/biome_css_formatter/src/generated.rs‎

Lines changed: 0 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -8695,31 +8695,6 @@ impl IntoFormat<CssFormatContext> for biome_css_syntax::AnyCssSimpleSelector {
86958695
)
86968696
}
86978697
}
8698-
impl AsFormat<CssFormatContext> for biome_css_syntax::AnyCssStartingStyleBlock {
8699-
type Format<'a> = FormatRefWithRule<
8700-
'a,
8701-
biome_css_syntax::AnyCssStartingStyleBlock,
8702-
crate::css::any::starting_style_block::FormatAnyCssStartingStyleBlock,
8703-
>;
8704-
fn format(&self) -> Self::Format<'_> {
8705-
FormatRefWithRule::new(
8706-
self,
8707-
crate::css::any::starting_style_block::FormatAnyCssStartingStyleBlock::default(),
8708-
)
8709-
}
8710-
}
8711-
impl IntoFormat<CssFormatContext> for biome_css_syntax::AnyCssStartingStyleBlock {
8712-
type Format = FormatOwnedWithRule<
8713-
biome_css_syntax::AnyCssStartingStyleBlock,
8714-
crate::css::any::starting_style_block::FormatAnyCssStartingStyleBlock,
8715-
>;
8716-
fn into_format(self) -> Self::Format {
8717-
FormatOwnedWithRule::new(
8718-
self,
8719-
crate::css::any::starting_style_block::FormatAnyCssStartingStyleBlock::default(),
8720-
)
8721-
}
8722-
}
87238698
impl AsFormat<CssFormatContext> for biome_css_syntax::AnyCssSubSelector {
87248699
type Format<'a> = FormatRefWithRule<
87258700
'a,

‎crates/biome_css_parser/src/syntax/at_rule/starting_style.rs‎

Lines changed: 3 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
use crate::parser::CssParser;
2-
use crate::syntax::block::{parse_declaration_block, parse_rule_block};
2+
use crate::syntax::block::parse_conditional_block;
33
use biome_css_syntax::CssSyntaxKind::*;
44
use biome_css_syntax::T;
55
use biome_parser::parsed_syntax::ParsedSyntax::Present;
@@ -35,7 +35,7 @@ pub(crate) fn is_at_starting_style_at_rule(p: &mut CssParser) -> bool {
3535
/// // Inside a selector
3636
/// selector {
3737
/// @starting-style {
38-
/// /* declarations */
38+
/// /* declarations or rules */
3939
/// }
4040
/// }
4141
/// ```
@@ -49,11 +49,7 @@ pub(crate) fn parse_starting_style_at_rule(p: &mut CssParser) -> ParsedSyntax {
4949

5050
p.bump(T![starting_style]);
5151

52-
if p.state().is_nesting_block {
53-
parse_declaration_block(p);
54-
} else {
55-
parse_rule_block(p);
56-
};
52+
parse_conditional_block(p);
5753

5854
Present(m.complete(p, CSS_STARTING_STYLE_AT_RULE))
5955
}

‎crates/biome_css_parser/tests/css_test_suite/ok/at_rule/at_rule_starting_style.css‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -13,3 +13,12 @@
1313
}
1414
}
1515
}
16+
17+
18+
@layer my-demo-layer {
19+
@starting-style {
20+
div.showing {
21+
background-color: red;
22+
}
23+
}
24+
}

‎crates/biome_css_parser/tests/css_test_suite/ok/at_rule/at_rule_starting_style.css.snap‎

Lines changed: 148 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -21,6 +21,15 @@ expression: snapshot
2121
}
2222
}
2323
24+
25+
@layer my-demo-layer {
26+
@starting-style {
27+
div.showing {
28+
background-color: red;
29+
}
30+
}
31+
}
32+
2433
```
2534

2635

@@ -93,9 +102,9 @@ CssRoot {
93102
at_token: AT@74..78 "@" [Newline("\n"), Whitespace("\t\t")] [],
94103
rule: CssStartingStyleAtRule {
95104
starting_style_token: STARTING_STYLE_KW@78..93 "starting-style" [] [Whitespace(" ")],
96-
block: CssDeclarationBlock {
105+
block: CssDeclarationOrRuleBlock {
97106
l_curly_token: L_CURLY@93..94 "{" [] [],
98-
declarations: CssDeclarationList [
107+
items: CssDeclarationOrRuleList [
99108
CssDeclarationWithSemicolon {
100109
declaration: CssDeclaration {
101110
property: CssGenericProperty {
@@ -170,17 +179,97 @@ CssRoot {
170179
},
171180
},
172181
},
182+
CssAtRule {
183+
at_token: AT@168..172 "@" [Newline("\n"), Newline("\n"), Newline("\n")] [],
184+
rule: CssLayerAtRule {
185+
layer_token: LAYER_KW@172..178 "layer" [] [Whitespace(" ")],
186+
layer: CssLayerDeclaration {
187+
references: CssLayerReferenceList [
188+
CssLayerNameList [
189+
CssIdentifier {
190+
value_token: IDENT@178..192 "my-demo-layer" [] [Whitespace(" ")],
191+
},
192+
],
193+
],
194+
block: CssRuleBlock {
195+
l_curly_token: L_CURLY@192..193 "{" [] [],
196+
rules: CssRuleList [
197+
CssAtRule {
198+
at_token: AT@193..196 "@" [Newline("\n"), Whitespace("\t")] [],
199+
rule: CssStartingStyleAtRule {
200+
starting_style_token: STARTING_STYLE_KW@196..211 "starting-style" [] [Whitespace(" ")],
201+
block: CssDeclarationOrRuleBlock {
202+
l_curly_token: L_CURLY@211..212 "{" [] [],
203+
items: CssDeclarationOrRuleList [
204+
CssNestedQualifiedRule {
205+
prelude: CssRelativeSelectorList [
206+
CssRelativeSelector {
207+
combinator: missing (optional),
208+
selector: CssCompoundSelector {
209+
nesting_selectors: CssNestedSelectorList [],
210+
simple_selector: CssTypeSelector {
211+
namespace: missing (optional),
212+
ident: CssIdentifier {
213+
value_token: IDENT@212..218 "div" [Newline("\n"), Whitespace("\t\t")] [],
214+
},
215+
},
216+
sub_selectors: CssSubSelectorList [
217+
CssClassSelector {
218+
dot_token: DOT@218..219 "." [] [],
219+
name: CssCustomIdentifier {
220+
value_token: IDENT@219..227 "showing" [] [Whitespace(" ")],
221+
},
222+
},
223+
],
224+
},
225+
},
226+
],
227+
block: CssDeclarationOrRuleBlock {
228+
l_curly_token: L_CURLY@227..228 "{" [] [],
229+
items: CssDeclarationOrRuleList [
230+
CssDeclarationWithSemicolon {
231+
declaration: CssDeclaration {
232+
property: CssGenericProperty {
233+
name: CssIdentifier {
234+
value_token: IDENT@228..248 "background-color" [Newline("\n"), Whitespace("\t\t\t")] [],
235+
},
236+
colon_token: COLON@248..250 ":" [] [Whitespace(" ")],
237+
value: CssGenericComponentValueList [
238+
CssIdentifier {
239+
value_token: IDENT@250..253 "red" [] [],
240+
},
241+
],
242+
},
243+
important: missing (optional),
244+
},
245+
semicolon_token: SEMICOLON@253..254 ";" [] [],
246+
},
247+
],
248+
r_curly_token: R_CURLY@254..258 "}" [Newline("\n"), Whitespace("\t\t")] [],
249+
},
250+
},
251+
],
252+
r_curly_token: R_CURLY@258..261 "}" [Newline("\n"), Whitespace("\t")] [],
253+
},
254+
},
255+
},
256+
],
257+
r_curly_token: R_CURLY@261..263 "}" [Newline("\n")] [],
258+
},
259+
},
260+
},
261+
},
173262
],
174-
eof_token: EOF@168..169 "" [Newline("\n")] [],
263+
eof_token: EOF@263..264 "" [Newline("\n")] [],
175264
}
176265
```
177266

178267
## CST
179268

180269
```
181-
0: CSS_ROOT@0..169
270+
0: CSS_ROOT@0..264
182271
0: (empty)
183-
1: CSS_RULE_LIST@0..168
272+
1: CSS_RULE_LIST@0..263
184273
0: [email protected]
185274
0: [email protected] "@" [] []
186275
1: [email protected]
@@ -228,9 +317,9 @@ CssRoot {
228317
0: AT@74..78 "@" [Newline("\n"), Whitespace("\t\t")] []
229318
1: CSS_STARTING_STYLE_AT_RULE@78..132
230319
0: STARTING_STYLE_KW@78..93 "starting-style" [] [Whitespace(" ")]
231-
1: CSS_DECLARATION_BLOCK@93..132
320+
1: CSS_DECLARATION_OR_RULE_BLOCK@93..132
232321
0: L_CURLY@93..94 "{" [] []
233-
1: CSS_DECLARATION_LIST@94..128
322+
1: CSS_DECLARATION_OR_RULE_LIST@94..128
234323
0: CSS_DECLARATION_WITH_SEMICOLON@94..128
235324
0: CSS_DECLARATION@94..127
236325
0: CSS_GENERIC_PROPERTY@94..127
@@ -272,6 +361,57 @@ CssRoot {
272361
2: R_CURLY@159..163 "}" [Newline("\n"), Whitespace("\t\t")] []
273362
2: R_CURLY@163..166 "}" [Newline("\n"), Whitespace("\t")] []
274363
2: R_CURLY@166..168 "}" [Newline("\n")] []
275-
2: EOF@168..169 "" [Newline("\n")] []
364+
1: CSS_AT_RULE@168..263
365+
0: AT@168..172 "@" [Newline("\n"), Newline("\n"), Newline("\n")] []
366+
1: CSS_LAYER_AT_RULE@172..263
367+
0: LAYER_KW@172..178 "layer" [] [Whitespace(" ")]
368+
1: CSS_LAYER_DECLARATION@178..263
369+
0: CSS_LAYER_REFERENCE_LIST@178..192
370+
0: CSS_LAYER_NAME_LIST@178..192
371+
0: CSS_IDENTIFIER@178..192
372+
0: IDENT@178..192 "my-demo-layer" [] [Whitespace(" ")]
373+
1: CSS_RULE_BLOCK@192..263
374+
0: L_CURLY@192..193 "{" [] []
375+
1: CSS_RULE_LIST@193..261
376+
0: CSS_AT_RULE@193..261
377+
0: AT@193..196 "@" [Newline("\n"), Whitespace("\t")] []
378+
1: CSS_STARTING_STYLE_AT_RULE@196..261
379+
0: STARTING_STYLE_KW@196..211 "starting-style" [] [Whitespace(" ")]
380+
1: CSS_DECLARATION_OR_RULE_BLOCK@211..261
381+
0: L_CURLY@211..212 "{" [] []
382+
1: CSS_DECLARATION_OR_RULE_LIST@212..258
383+
0: CSS_NESTED_QUALIFIED_RULE@212..258
384+
0: CSS_RELATIVE_SELECTOR_LIST@212..227
385+
0: CSS_RELATIVE_SELECTOR@212..227
386+
0: (empty)
387+
1: CSS_COMPOUND_SELECTOR@212..227
388+
0: CSS_NESTED_SELECTOR_LIST@212..212
389+
1: CSS_TYPE_SELECTOR@212..218
390+
0: (empty)
391+
1: CSS_IDENTIFIER@212..218
392+
0: IDENT@212..218 "div" [Newline("\n"), Whitespace("\t\t")] []
393+
2: CSS_SUB_SELECTOR_LIST@218..227
394+
0: CSS_CLASS_SELECTOR@218..227
395+
0: DOT@218..219 "." [] []
396+
1: CSS_CUSTOM_IDENTIFIER@219..227
397+
0: IDENT@219..227 "showing" [] [Whitespace(" ")]
398+
1: CSS_DECLARATION_OR_RULE_BLOCK@227..258
399+
0: L_CURLY@227..228 "{" [] []
400+
1: CSS_DECLARATION_OR_RULE_LIST@228..254
401+
0: CSS_DECLARATION_WITH_SEMICOLON@228..254
402+
0: CSS_DECLARATION@228..253
403+
0: CSS_GENERIC_PROPERTY@228..253
404+
0: CSS_IDENTIFIER@228..248
405+
0: IDENT@228..248 "background-color" [Newline("\n"), Whitespace("\t\t\t")] []
406+
1: COLON@248..250 ":" [] [Whitespace(" ")]
407+
2: CSS_GENERIC_COMPONENT_VALUE_LIST@250..253
408+
0: CSS_IDENTIFIER@250..253
409+
0: IDENT@250..253 "red" [] []
410+
1: (empty)
411+
1: SEMICOLON@253..254 ";" [] []
412+
2: R_CURLY@254..258 "}" [Newline("\n"), Whitespace("\t\t")] []
413+
2: R_CURLY@258..261 "}" [Newline("\n"), Whitespace("\t")] []
414+
2: R_CURLY@261..263 "}" [Newline("\n")] []
415+
2: EOF@263..264 "" [Newline("\n")] []
276416
277417
```

0 commit comments

Comments
 (0)