Skip to content

Commit f0dec4d

Browse files
owjs3901owjs3901
committed
Update snapshot
1 parent fd52016 commit f0dec4d

4 files changed

Lines changed: 283 additions & 0 deletions

File tree

‎libs/extractor/src/lib.rs‎

Lines changed: 55 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -9500,6 +9500,61 @@ globalCss({
95009500
));
95019501
}
95029502

9503+
#[test]
9504+
#[serial]
9505+
fn test_global_css_with_layer() {
9506+
// Test globalCss with @layer property
9507+
reset_class_map();
9508+
assert_debug_snapshot!(ToBTreeSet::from(
9509+
extract(
9510+
"test.tsx",
9511+
r#"import {globalCss} from '@devup-ui/core'
9512+
globalCss({
9513+
"*": {
9514+
"@layer": "reset",
9515+
margin: 0,
9516+
padding: 0
9517+
}
9518+
})
9519+
"#,
9520+
ExtractOption {
9521+
package: "@devup-ui/core".to_string(),
9522+
css_dir: "@devup-ui/core".to_string(),
9523+
single_css: false,
9524+
import_main_css: false
9525+
}
9526+
)
9527+
.unwrap()
9528+
));
9529+
9530+
// Test globalCss with @layer for multiple selectors
9531+
reset_class_map();
9532+
assert_debug_snapshot!(ToBTreeSet::from(
9533+
extract(
9534+
"test.tsx",
9535+
r#"import {globalCss} from '@devup-ui/core'
9536+
globalCss({
9537+
"*": {
9538+
"@layer": "reset",
9539+
boxSizing: "border-box"
9540+
},
9541+
body: {
9542+
"@layer": "base",
9543+
fontFamily: "sans-serif"
9544+
}
9545+
})
9546+
"#,
9547+
ExtractOption {
9548+
package: "@devup-ui/core".to_string(),
9549+
css_dir: "@devup-ui/core".to_string(),
9550+
single_css: false,
9551+
import_main_css: false
9552+
}
9553+
)
9554+
.unwrap()
9555+
));
9556+
}
9557+
95039558
// ============================================================================
95049559
// VANILLA-EXTRACT API TESTS
95059560
// ============================================================================

‎libs/extractor/src/snapshots/extractor__tests__global_css_with_layer-2.snap‎

Lines changed: 47 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,47 @@
1+
---
2+
source: libs/extractor/src/lib.rs
3+
expression: "ToBTreeSet::from(extract(\"test.tsx\",\nr#\"import {globalCss} from '@devup-ui/core'\nglobalCss({\n \"*\": {\n \"@layer\": \"reset\",\n boxSizing: \"border-box\"\n },\n body: {\n \"@layer\": \"base\",\n fontFamily: \"sans-serif\"\n }\n})\n\"#,\nExtractOption\n{\n package: \"@devup-ui/core\".to_string(), css_dir:\n \"@devup-ui/core\".to_string(), single_css: false, import_main_css: false\n}).unwrap())"
4+
---
5+
ToBTreeSet {
6+
styles: {
7+
Static(
8+
ExtractStaticStyle {
9+
property: "box-sizing",
10+
value: "border-box",
11+
level: 0,
12+
selector: Some(
13+
Global(
14+
"*",
15+
"test.tsx",
16+
),
17+
),
18+
style_order: Some(
19+
0,
20+
),
21+
layer: Some(
22+
"reset",
23+
),
24+
},
25+
),
26+
Static(
27+
ExtractStaticStyle {
28+
property: "font-family",
29+
value: "sans-serif",
30+
level: 0,
31+
selector: Some(
32+
Global(
33+
"body",
34+
"test.tsx",
35+
),
36+
),
37+
style_order: Some(
38+
0,
39+
),
40+
layer: Some(
41+
"base",
42+
),
43+
},
44+
),
45+
},
46+
code: "import \"@devup-ui/core/devup-ui-0.css\";\n;\n",
47+
}

‎libs/extractor/src/snapshots/extractor__tests__global_css_with_layer.snap‎

Lines changed: 47 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,47 @@
1+
---
2+
source: libs/extractor/src/lib.rs
3+
expression: "ToBTreeSet::from(extract(\"test.tsx\",\nr#\"import {globalCss} from '@devup-ui/core'\nglobalCss({\n \"*\": {\n \"@layer\": \"reset\",\n margin: 0,\n padding: 0\n }\n})\n\"#,\nExtractOption\n{\n package: \"@devup-ui/core\".to_string(), css_dir:\n \"@devup-ui/core\".to_string(), single_css: false, import_main_css: false\n}).unwrap())"
4+
---
5+
ToBTreeSet {
6+
styles: {
7+
Static(
8+
ExtractStaticStyle {
9+
property: "margin",
10+
value: "0",
11+
level: 0,
12+
selector: Some(
13+
Global(
14+
"*",
15+
"test.tsx",
16+
),
17+
),
18+
style_order: Some(
19+
0,
20+
),
21+
layer: Some(
22+
"reset",
23+
),
24+
},
25+
),
26+
Static(
27+
ExtractStaticStyle {
28+
property: "padding",
29+
value: "0",
30+
level: 0,
31+
selector: Some(
32+
Global(
33+
"*",
34+
"test.tsx",
35+
),
36+
),
37+
style_order: Some(
38+
0,
39+
),
40+
layer: Some(
41+
"reset",
42+
),
43+
},
44+
),
45+
},
46+
code: "import \"@devup-ui/core/devup-ui-0.css\";\n;\n",
47+
}

‎libs/extractor/src/vanilla_extract.rs‎

Lines changed: 134 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2172,4 +2172,138 @@ export const lightTheme = createTheme(vars, {
21722172
assert_eq!(result.len(), 1);
21732173
assert_eq!(result[0], ("fontStyle".to_string(), "null".to_string()));
21742174
}
2175+
2176+
#[test]
2177+
fn test_collected_styles_to_code_with_classes_composition() {
2178+
let mut collected = CollectedStyles::default();
2179+
// Add base style
2180+
collected.styles.insert(
2181+
"base".to_string(),
2182+
StyleEntry {
2183+
json: r#"{"padding":"8px"}"#.to_string(),
2184+
exported: false,
2185+
bases: Vec::new(),
2186+
},
2187+
);
2188+
// Add composed style with bases
2189+
collected.styles.insert(
2190+
"composed".to_string(),
2191+
StyleEntry {
2192+
json: r#"{"color":"red"}"#.to_string(),
2193+
exported: true,
2194+
bases: vec!["base".to_string()],
2195+
},
2196+
);
2197+
2198+
let class_map: std::collections::HashMap<String, String> = [
2199+
("base".to_string(), "a".to_string()),
2200+
("composed".to_string(), "b".to_string()),
2201+
]
2202+
.into_iter()
2203+
.collect();
2204+
2205+
let code =
2206+
super::collected_styles_to_code_with_classes(&collected, "@devup-ui/react", &class_map);
2207+
assert!(code.contains("import { css } from '@devup-ui/react'"));
2208+
// The composed style should have both base and own styles merged
2209+
assert!(code.contains("padding"));
2210+
assert!(code.contains("color"));
2211+
}
2212+
2213+
#[test]
2214+
fn test_collected_styles_to_code_with_theme_vars() {
2215+
let mut collected = CollectedStyles::default();
2216+
// Theme with vars_name and vars_object_json
2217+
collected.themes.insert(
2218+
"themeClass".to_string(),
2219+
super::ThemeEntry {
2220+
class_name: "f0_theme".to_string(),
2221+
css_vars: vec![("--color-primary".to_string(), "blue".to_string())],
2222+
exported: true,
2223+
vars_name: Some("vars".to_string()),
2224+
vars_object_json: Some(
2225+
r#"{"color":{"primary":"var(--color-primary)"}}"#.to_string(),
2226+
),
2227+
},
2228+
);
2229+
2230+
let code = super::collected_styles_to_code(&collected, "@devup-ui/react");
2231+
assert!(code.contains("export const [themeClass, vars] = [\"f0_theme\""));
2232+
}
2233+
2234+
#[test]
2235+
fn test_collected_styles_to_code_with_theme_no_vars() {
2236+
let mut collected = CollectedStyles::default();
2237+
// Theme without vars (two-arg createTheme)
2238+
collected.themes.insert(
2239+
"darkTheme".to_string(),
2240+
super::ThemeEntry {
2241+
class_name: "f1_darkTheme".to_string(),
2242+
css_vars: vec![("--color-primary".to_string(), "white".to_string())],
2243+
exported: true,
2244+
vars_name: None,
2245+
vars_object_json: None,
2246+
},
2247+
);
2248+
2249+
let code = super::collected_styles_to_code(&collected, "@devup-ui/react");
2250+
assert!(code.contains("export const darkTheme = \"f1_darkTheme\""));
2251+
}
2252+
2253+
#[test]
2254+
fn test_collected_styles_to_code_with_keyframes() {
2255+
let mut collected = CollectedStyles::default();
2256+
collected.keyframes.insert(
2257+
"fadeIn".to_string(),
2258+
StyleEntry {
2259+
json: r#"{"from":{"opacity":"0"},"to":{"opacity":"1"}}"#.to_string(),
2260+
exported: true,
2261+
bases: Vec::new(),
2262+
},
2263+
);
2264+
2265+
let code = super::collected_styles_to_code(&collected, "@devup-ui/react");
2266+
assert!(code.contains("import { keyframes } from '@devup-ui/react'"));
2267+
assert!(code.contains("export const fadeIn = keyframes"));
2268+
}
2269+
2270+
#[test]
2271+
fn test_collected_styles_to_code_with_global_styles() {
2272+
let mut collected = CollectedStyles::default();
2273+
collected
2274+
.global_styles
2275+
.push(("body".to_string(), r#"{"margin":"0"}"#.to_string()));
2276+
2277+
let code = super::collected_styles_to_code(&collected, "@devup-ui/react");
2278+
assert!(code.contains("import { globalCss } from '@devup-ui/react'"));
2279+
assert!(code.contains("globalCss({ \"body\":"));
2280+
}
2281+
2282+
#[test]
2283+
fn test_collected_styles_to_code_composition() {
2284+
let mut collected = CollectedStyles::default();
2285+
// Add base style
2286+
collected.styles.insert(
2287+
"baseStyle".to_string(),
2288+
StyleEntry {
2289+
json: r#"{"padding":"16px","margin":"8px"}"#.to_string(),
2290+
exported: false,
2291+
bases: Vec::new(),
2292+
},
2293+
);
2294+
// Add composed style
2295+
collected.styles.insert(
2296+
"buttonStyle".to_string(),
2297+
StyleEntry {
2298+
json: r#"{"background":"blue"}"#.to_string(),
2299+
exported: true,
2300+
bases: vec!["baseStyle".to_string()],
2301+
},
2302+
);
2303+
2304+
let code = super::collected_styles_to_code(&collected, "@devup-ui/react");
2305+
// Both base and own styles should be present in the composed style
2306+
assert!(code.contains("padding"));
2307+
assert!(code.contains("background"));
2308+
}
21752309
}

0 commit comments

Comments
 (0)