From 9002fb69eca8ec967d7f6a8798187cbba6b9aa9a Mon Sep 17 00:00:00 2001 From: owjs3901 Date: Mon, 3 Nov 2025 15:18:26 +0900 Subject: [PATCH 1/2] Fix global css issue --- .changeset/clever-teeth-itch.md | 5 ++++ libs/extractor/src/css_utils.rs | 28 ++++++++++++++++--- libs/extractor/src/lib.rs | 17 +++++++++++ ...lobal_css_with_template_literal-9.snap.new | 16 +++++++++++ 4 files changed, 62 insertions(+), 4 deletions(-) create mode 100644 .changeset/clever-teeth-itch.md create mode 100644 libs/extractor/src/snapshots/extractor__tests__extract_global_css_with_template_literal-9.snap.new diff --git a/.changeset/clever-teeth-itch.md b/.changeset/clever-teeth-itch.md new file mode 100644 index 00000000..53051d77 --- /dev/null +++ b/.changeset/clever-teeth-itch.md @@ -0,0 +1,5 @@ +--- +'@devup-ui/wasm': patch +--- + +Fix global css issue diff --git a/libs/extractor/src/css_utils.rs b/libs/extractor/src/css_utils.rs index c1c6be7f..3082ee6a 100644 --- a/libs/extractor/src/css_utils.rs +++ b/libs/extractor/src/css_utils.rs @@ -149,18 +149,30 @@ pub fn optimize_css_block(css: &str) -> String { .join("}") .split(";") .map(|s| { - if !s.contains(":") { - s.trim().to_string() + println!("s: {}", s); + let parts = s.split("{").collect::>(); + let first_part = if parts.len() == 1 { + "".to_string() } else { - let mut iter = s.split(":"); + format!("{}{{", parts.first().unwrap().trim()) + }; + println!("first_part: {}", first_part); + let last_part = parts.last().unwrap().trim(); + if !last_part.contains(":") { + println!("last_part: {}", last_part); + format!("{first_part}{last_part}") + } else { + let mut iter = last_part.split(":"); let property = iter.next().unwrap().trim(); let value = iter.next().unwrap().trim(); + + println!("property: {}, value: {}", property, value); let value = if check_multi_css_optimize(property.split("{").last().unwrap()) { optimize_mutli_css_value(value) } else { value.to_string() }; - format!("{property}:{value}") + format!("{first_part}{property}:{value}") } }) .collect::>() @@ -224,6 +236,14 @@ mod tests { "ul{font-family:\"Roboto Hello\",sans-serif}" )] #[case("section{ }", "section{}")] + #[case(":root{ }", ":root{}")] + #[case(":root{ background: red; }", ":root{background:red}")] + #[case( + ":root, :section{ background: red; }", + ":root,:section{background:red}" + )] + #[case("*:hover{ background: red; }", "*:hover{background:red}")] + #[case(":root {color-scheme: light dark }", ":root{color-scheme:light dark}")] fn test_optimize_css_block(#[case] input: &str, #[case] expected: &str) { assert_eq!(optimize_css_block(input), expected); } diff --git a/libs/extractor/src/lib.rs b/libs/extractor/src/lib.rs index 94dbacb2..8f7e217c 100644 --- a/libs/extractor/src/lib.rs +++ b/libs/extractor/src/lib.rs @@ -6227,6 +6227,23 @@ globalCss({ r#"import { globalCss } from "@devup-ui/core"; globalCss` ` + "#, + ExtractOption { + package: "@devup-ui/core".to_string(), + css_dir: "@devup-ui/core".to_string(), + single_css: true, + import_main_css: false + } + ) + .unwrap() + )); + + reset_class_map(); + assert_debug_snapshot!(ToBTreeSet::from( + extract( + "test.tsx", + r#"import { globalCss } from "@devup-ui/core"; + globalCss`:root {color-scheme: light dark}` "#, ExtractOption { package: "@devup-ui/core".to_string(), diff --git a/libs/extractor/src/snapshots/extractor__tests__extract_global_css_with_template_literal-9.snap.new b/libs/extractor/src/snapshots/extractor__tests__extract_global_css_with_template_literal-9.snap.new new file mode 100644 index 00000000..38c48b56 --- /dev/null +++ b/libs/extractor/src/snapshots/extractor__tests__extract_global_css_with_template_literal-9.snap.new @@ -0,0 +1,16 @@ +--- +source: libs/extractor/src/lib.rs +assertion_line: 6242 +expression: "ToBTreeSet::from(extract(\"test.tsx\",\nr#\"import { globalCss } from \"@devup-ui/core\";\n globalCss`:root {color-scheme: light dark}`\n \"#,\nExtractOption\n{\n package: \"@devup-ui/core\".to_string(), css_dir:\n \"@devup-ui/core\".to_string(), single_css: true, import_main_css: false\n}).unwrap())" +--- +ToBTreeSet { + styles: { + Css( + ExtractCss { + css: ":root{color-scheme", + file: "test.tsx", + }, + ), + }, + code: "import \"@devup-ui/core/devup-ui.css\";\n;\n", +} From 211e7abaa0d72ebc3ba59209835dd987dc38905d Mon Sep 17 00:00:00 2001 From: owjs3901 Date: Mon, 3 Nov 2025 15:25:06 +0900 Subject: [PATCH 2/2] Update snapshot --- ...or__tests__extract_global_css_with_template_literal-9.snap} | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) rename libs/extractor/src/snapshots/{extractor__tests__extract_global_css_with_template_literal-9.snap.new => extractor__tests__extract_global_css_with_template_literal-9.snap} (89%) diff --git a/libs/extractor/src/snapshots/extractor__tests__extract_global_css_with_template_literal-9.snap.new b/libs/extractor/src/snapshots/extractor__tests__extract_global_css_with_template_literal-9.snap similarity index 89% rename from libs/extractor/src/snapshots/extractor__tests__extract_global_css_with_template_literal-9.snap.new rename to libs/extractor/src/snapshots/extractor__tests__extract_global_css_with_template_literal-9.snap index 38c48b56..04921366 100644 --- a/libs/extractor/src/snapshots/extractor__tests__extract_global_css_with_template_literal-9.snap.new +++ b/libs/extractor/src/snapshots/extractor__tests__extract_global_css_with_template_literal-9.snap @@ -1,13 +1,12 @@ --- source: libs/extractor/src/lib.rs -assertion_line: 6242 expression: "ToBTreeSet::from(extract(\"test.tsx\",\nr#\"import { globalCss } from \"@devup-ui/core\";\n globalCss`:root {color-scheme: light dark}`\n \"#,\nExtractOption\n{\n package: \"@devup-ui/core\".to_string(), css_dir:\n \"@devup-ui/core\".to_string(), single_css: true, import_main_css: false\n}).unwrap())" --- ToBTreeSet { styles: { Css( ExtractCss { - css: ":root{color-scheme", + css: ":root{color-scheme:light dark}", file: "test.tsx", }, ),