fix(css/modules): Fix :local and :global (#7600)

**Related issue:** - Close #7599.
swc-project · Jun 30, 2023 · f0ab5b3 · f0ab5b3 · github-actions · Jun 30, 2023
1 parent 3aee9a2
commit f0ab5b3
Show file tree

Hide file tree

Showing 4 changed files with 29 additions and 0 deletions.
diff --git a/crates/swc_css_modules/src/lib.rs b/crates/swc_css_modules/src/lib.rs
@@ -510,6 +510,13 @@ where
                                         self.data.is_in_local_pseudo_class = old_inside;
                                     }
                                 } else {
+                                    if sel_index > 0 {
+                                        if let Some(n) = n.as_mut_compound_selector() {
+                                            n.subclass_selectors =
+                                                n.subclass_selectors.split_at(sel_index).0.to_vec();
+                                        }
+                                        new_children.push(n);
+                                    }
                                     self.data.is_global_mode = false;
                                 }
 
@@ -530,6 +537,13 @@ where
                                         new_children.extend(complex_selector_children);
                                     }
                                 } else {
+                                    if sel_index > 0 {
+                                        if let Some(n) = n.as_mut_compound_selector() {
+                                            n.subclass_selectors =
+                                                n.subclass_selectors.split_at(sel_index).0.to_vec();
+                                        }
+                                        new_children.push(n);
+                                    }
                                     self.data.is_global_mode = true;
                                 }
 

diff --git a/crates/swc_css_modules/tests/fixture/issues/issuse-7599.compiled.css b/crates/swc_css_modules/tests/fixture/issues/issuse-7599.compiled.css
@@ -0,0 +1,2 @@
+.__local__my-class {}
+.__local__my-class {}
diff --git a/crates/swc_css_modules/tests/fixture/issues/issuse-7599.css b/crates/swc_css_modules/tests/fixture/issues/issuse-7599.css
@@ -0,0 +1,5 @@
+.my-class:global {
+}
+.my-class:local{
+
+}
diff --git a/crates/swc_css_modules/tests/fixture/issues/issuse-7599.transform.json b/crates/swc_css_modules/tests/fixture/issues/issuse-7599.transform.json
@@ -0,0 +1,8 @@
+{
+  "my-class": [
+    {
+      "type": "local",
+      "name": "__local__my-class"
+    }
+  ]
+}
Benchmark suite	Current: `f0ab5b3`	Previous: `ac02b84`	Ratio
`es/full/bugs-1`	`313546` ns/iter (`± 8173`)	`314733` ns/iter (`± 7794`)	`1.00`
`es/full/minify/libraries/antd`	`1507702712` ns/iter (`± 20353836`)	`1527937474` ns/iter (`± 18348948`)	`0.99`
`es/full/minify/libraries/d3`	`325601071` ns/iter (`± 6344435`)	`330980667` ns/iter (`± 2860634`)	`0.98`
`es/full/minify/libraries/echarts`	`1222050220` ns/iter (`± 9557951`)	`1257687524` ns/iter (`± 4105448`)	`0.97`
`es/full/minify/libraries/jquery`	`96271341` ns/iter (`± 376307`)	`97069995` ns/iter (`± 207179`)	`0.99`
`es/full/minify/libraries/lodash`	`115472280` ns/iter (`± 288292`)	`115016780` ns/iter (`± 675323`)	`1.00`
`es/full/minify/libraries/moment`	`56417716` ns/iter (`± 292297`)	`56711753` ns/iter (`± 100796`)	`0.99`
`es/full/minify/libraries/react`	`20313365` ns/iter (`± 76257`)	`20376897` ns/iter (`± 34866`)	`1.00`
`es/full/minify/libraries/terser`	`250292041` ns/iter (`± 1779173`)	`256637044` ns/iter (`± 880926`)	`0.98`
`es/full/minify/libraries/three`	`447196214` ns/iter (`± 3444679`)	`460335438` ns/iter (`± 2359066`)	`0.97`
`es/full/minify/libraries/typescript`	`3036686984` ns/iter (`± 27407657`)	`3086688754` ns/iter (`± 11759619`)	`0.98`
`es/full/minify/libraries/victory`	`661652668` ns/iter (`± 8398461`)	`680700784` ns/iter (`± 2804293`)	`0.97`
`es/full/minify/libraries/vue`	`139656263` ns/iter (`± 363133`)	`141738090` ns/iter (`± 784085`)	`0.99`
`es/full/codegen/es3`	`37261` ns/iter (`± 101`)	`36974` ns/iter (`± 89`)	`1.01`
`es/full/codegen/es5`	`37210` ns/iter (`± 101`)	`36801` ns/iter (`± 77`)	`1.01`
`es/full/codegen/es2015`	`37227` ns/iter (`± 77`)	`36855` ns/iter (`± 132`)	`1.01`
`es/full/codegen/es2016`	`37193` ns/iter (`± 63`)	`36925` ns/iter (`± 86`)	`1.01`
`es/full/codegen/es2017`	`37216` ns/iter (`± 71`)	`36910` ns/iter (`± 90`)	`1.01`
`es/full/codegen/es2018`	`37146` ns/iter (`± 177`)	`36845` ns/iter (`± 107`)	`1.01`
`es/full/codegen/es2019`	`37201` ns/iter (`± 118`)	`36853` ns/iter (`± 83`)	`1.01`
`es/full/codegen/es2020`	`37175` ns/iter (`± 74`)	`36833` ns/iter (`± 40`)	`1.01`
`es/full/all/es3`	`178752798` ns/iter (`± 623178`)	`178606717` ns/iter (`± 649226`)	`1.00`
`es/full/all/es5`	`170495486` ns/iter (`± 486023`)	`170248582` ns/iter (`± 757907`)	`1.00`
`es/full/all/es2015`	`126797054` ns/iter (`± 511922`)	`127623936` ns/iter (`± 419158`)	`0.99`
`es/full/all/es2016`	`126396005` ns/iter (`± 364144`)	`125911889` ns/iter (`± 475048`)	`1.00`
`es/full/all/es2017`	`125035905` ns/iter (`± 391363`)	`125296535` ns/iter (`± 421483`)	`1.00`
`es/full/all/es2018`	`123555520` ns/iter (`± 457525`)	`123091465` ns/iter (`± 585484`)	`1.00`
`es/full/all/es2019`	`122905194` ns/iter (`± 423746`)	`122815173` ns/iter (`± 481241`)	`1.00`
`es/full/all/es2020`	`118271618` ns/iter (`± 631836`)	`118027032` ns/iter (`± 867219`)	`1.00`
`es/full/parser`	`513625` ns/iter (`± 6377`)	`514241` ns/iter (`± 6521`)	`1.00`
`es/full/base/fixer`	`19117` ns/iter (`± 158`)	`19183` ns/iter (`± 75`)	`1.00`
`es/full/base/resolver_and_hygiene`	`95500` ns/iter (`± 213`)	`92905` ns/iter (`± 215`)	`1.03`
`serialization of serde`	`303` ns/iter (`± 0`)	`297` ns/iter (`± 0`)	`1.02`
`css/minify/libraries/bootstrap`	`30936579` ns/iter (`± 85033`)	`31520864` ns/iter (`± 90224`)	`0.98`
`css/visitor/compare/clone`	`2146033` ns/iter (`± 21123`)	`2036560` ns/iter (`± 9932`)	`1.05`
`css/visitor/compare/visit_mut_span`	`2275169` ns/iter (`± 20338`)	`2166914` ns/iter (`± 15171`)	`1.05`
`css/visitor/compare/visit_mut_span_panic`	`2348252` ns/iter (`± 19081`)	`2236043` ns/iter (`± 13582`)	`1.05`
`css/visitor/compare/fold_span`	`3069520` ns/iter (`± 9749`)	`2952696` ns/iter (`± 12705`)	`1.04`
`css/visitor/compare/fold_span_panic`	`3256806` ns/iter (`± 11193`)	`3134874` ns/iter (`± 20633`)	`1.04`
`css/lexer/bootstrap_5_1_3`	`4742460` ns/iter (`± 2934`)	`4813940` ns/iter (`± 4339`)	`0.99`
`css/lexer/foundation_6_7_4`	`3994633` ns/iter (`± 1598`)	`4051802` ns/iter (`± 5018`)	`0.99`
`css/lexer/tailwind_3_1_1`	`760591` ns/iter (`± 433`)	`773368` ns/iter (`± 426`)	`0.98`
`css/parser/bootstrap_5_1_3`	`20673816` ns/iter (`± 34075`)	`20678899` ns/iter (`± 36107`)	`1.00`
`css/parser/foundation_6_7_4`	`16748539` ns/iter (`± 68498`)	`16622744` ns/iter (`± 22722`)	`1.01`
`css/parser/tailwind_3_1_1`	`3207690` ns/iter (`± 13405`)	`3221720` ns/iter (`± 4472`)	`1.00`
`es/codegen/colors`	`734810` ns/iter (`± 398706`)	`739696` ns/iter (`± 401320`)	`0.99`
`es/codegen/large`	`2975045` ns/iter (`± 1557695`)	`2990179` ns/iter (`± 1568313`)	`0.99`
`es/codegen/with-parser/colors`	`49553` ns/iter (`± 153`)	`49445` ns/iter (`± 141`)	`1.00`
`es/codegen/with-parser/large`	`518326` ns/iter (`± 749`)	`516363` ns/iter (`± 1466`)	`1.00`
`es/minify/libraries/antd`	`1322954164` ns/iter (`± 14237754`)	`1380063002` ns/iter (`± 13431994`)	`0.96`
`es/minify/libraries/d3`	`279861232` ns/iter (`± 2286395`)	`292482581` ns/iter (`± 709704`)	`0.96`
`es/minify/libraries/echarts`	`1063393696` ns/iter (`± 8673744`)	`1111598017` ns/iter (`± 4492568`)	`0.96`
`es/minify/libraries/jquery`	`84370334` ns/iter (`± 206029`)	`85277185` ns/iter (`± 121788`)	`0.99`
`es/minify/libraries/lodash`	`103193705` ns/iter (`± 428318`)	`104328213` ns/iter (`± 243289`)	`0.99`
`es/minify/libraries/moment`	`49556584` ns/iter (`± 97418`)	`50381467` ns/iter (`± 254742`)	`0.98`
`es/minify/libraries/react`	`18184069` ns/iter (`± 46053`)	`18284356` ns/iter (`± 39906`)	`0.99`
`es/minify/libraries/terser`	`213800618` ns/iter (`± 621988`)	`223666322` ns/iter (`± 1790898`)	`0.96`
`es/minify/libraries/three`	`376434042` ns/iter (`± 7915185`)	`393906864` ns/iter (`± 1203504`)	`0.96`
`es/minify/libraries/typescript`	`2639036302` ns/iter (`± 11021417`)	`2692990488` ns/iter (`± 10591475`)	`0.98`
`es/minify/libraries/victory`	`553618264` ns/iter (`± 4901079`)	`595248535` ns/iter (`± 9086228`)	`0.93`
`es/minify/libraries/vue`	`124540879` ns/iter (`± 415410`)	`127571308` ns/iter (`± 613366`)	`0.98`
`es/visitor/compare/clone`	`2086718` ns/iter (`± 3550`)	`2100669` ns/iter (`± 21450`)	`0.99`
`es/visitor/compare/visit_mut_span`	`2415798` ns/iter (`± 21556`)	`2439239` ns/iter (`± 9252`)	`0.99`
`es/visitor/compare/visit_mut_span_panic`	`2472278` ns/iter (`± 8196`)	`2473324` ns/iter (`± 12247`)	`1.00`
`es/visitor/compare/fold_span`	`3500358` ns/iter (`± 4105`)	`3512093` ns/iter (`± 11797`)	`1.00`
`es/visitor/compare/fold_span_panic`	`3639353` ns/iter (`± 8868`)	`3665074` ns/iter (`± 7996`)	`0.99`
`es/lexer/colors`	`13428` ns/iter (`± 121`)	`13511` ns/iter (`± 33`)	`0.99`
`es/lexer/angular`	`6247010` ns/iter (`± 6677`)	`6295684` ns/iter (`± 24524`)	`0.99`
`es/lexer/backbone`	`818109` ns/iter (`± 2008`)	`820975` ns/iter (`± 2632`)	`1.00`
`es/lexer/jquery`	`4658003` ns/iter (`± 5296`)	`4693221` ns/iter (`± 4181`)	`0.99`
`es/lexer/jquery mobile`	`7138189` ns/iter (`± 18902`)	`7203933` ns/iter (`± 9196`)	`0.99`
`es/lexer/mootools`	`3654426` ns/iter (`± 4099`)	`3687107` ns/iter (`± 3136`)	`0.99`
`es/lexer/underscore`	`685655` ns/iter (`± 2777`)	`695360` ns/iter (`± 2015`)	`0.99`
`es/lexer/three`	`21652015` ns/iter (`± 22566`)	`21917937` ns/iter (`± 31666`)	`0.99`
`es/lexer/yui`	`4101020` ns/iter (`± 2904`)	`4131733` ns/iter (`± 13300`)	`0.99`
`es/parser/colors`	`29337` ns/iter (`± 119`)	`29048` ns/iter (`± 91`)	`1.01`
`es/parser/angular`	`14338933` ns/iter (`± 48960`)	`14310620` ns/iter (`± 85507`)	`1.00`
`es/parser/backbone`	`2133095` ns/iter (`± 12254`)	`2116117` ns/iter (`± 9637`)	`1.01`
`es/parser/jquery`	`11645779` ns/iter (`± 52331`)	`11602821` ns/iter (`± 59643`)	`1.00`
`es/parser/jquery mobile`	`17817052` ns/iter (`± 23947`)	`17930180` ns/iter (`± 113183`)	`0.99`
`es/parser/mootools`	`8888926` ns/iter (`± 22762`)	`8810692` ns/iter (`± 19764`)	`1.01`
`es/parser/underscore`	`1841379` ns/iter (`± 8946`)	`1818597` ns/iter (`± 8279`)	`1.01`
`es/parser/three`	`49907741` ns/iter (`± 596476`)	`51597535` ns/iter (`± 89974`)	`0.97`
`es/parser/yui`	`8887073` ns/iter (`± 54006`)	`8841046` ns/iter (`± 39760`)	`1.01`
`es/preset-env/usage/builtin_type`	`143763` ns/iter (`± 33743`)	`143690` ns/iter (`± 32972`)	`1.00`
`es/preset-env/usage/property`	`19154` ns/iter (`± 42`)	`18790` ns/iter (`± 74`)	`1.02`
`es/resolver/typescript`	`96017266` ns/iter (`± 709860`)	`99834240` ns/iter (`± 661581`)	`0.96`
`es/fixer/typescript`	`67963022` ns/iter (`± 705650`)	`70104963` ns/iter (`± 725560`)	`0.97`
`es/hygiene/typescript`	`145259141` ns/iter (`± 862940`)	`150185195` ns/iter (`± 633615`)	`0.97`
`es/resolver_with_hygiene/typescript`	`304590316` ns/iter (`± 2939345`)	`316328523` ns/iter (`± 1305889`)	`0.96`
`es/visitor/base-perf/module_clone`	`61392` ns/iter (`± 195`)	`61242` ns/iter (`± 235`)	`1.00`
`es/visitor/base-perf/fold_empty`	`65016` ns/iter (`± 261`)	`65080` ns/iter (`± 382`)	`1.00`
`es/visitor/base-perf/fold_noop_impl_all`	`65315` ns/iter (`± 325`)	`65818` ns/iter (`± 272`)	`0.99`
`es/visitor/base-perf/fold_noop_impl_vec`	`65295` ns/iter (`± 402`)	`65814` ns/iter (`± 318`)	`0.99`
`es/visitor/base-perf/boxing_boxed_clone`	`60` ns/iter (`± 0`)	`56` ns/iter (`± 0`)	`1.07`
`es/visitor/base-perf/boxing_unboxed_clone`	`39` ns/iter (`± 0`)	`40` ns/iter (`± 0`)	`0.97`
`es/visitor/base-perf/boxing_boxed`	`116` ns/iter (`± 0`)	`110` ns/iter (`± 0`)	`1.05`
`es/visitor/base-perf/boxing_unboxed`	`83` ns/iter (`± 0`)	`77` ns/iter (`± 0`)	`1.08`
`es/visitor/base-perf/visit_empty`	`0` ns/iter (`± 0`)	`0` ns/iter (`± 0`)	`NaN`
`es/visitor/base-perf/visit_contains_this`	`2635` ns/iter (`± 13`)	`2616` ns/iter (`± 83`)	`1.01`
`es/base/parallel/resolver/typescript`	`4768058000` ns/iter (`± 267537701`)	`4820444865` ns/iter (`± 315224953`)	`0.99`
`es/base/parallel/hygiene/typescript`	`1596438976` ns/iter (`± 13045405`)	`1577007734` ns/iter (`± 13190946`)	`1.01`
`misc/visitors/time-complexity/time 5`	`104` ns/iter (`± 2`)	`108` ns/iter (`± 0`)	`0.96`
`misc/visitors/time-complexity/time 10`	`282` ns/iter (`± 6`)	`267` ns/iter (`± 1`)	`1.06`
`misc/visitors/time-complexity/time 15`	`503` ns/iter (`± 0`)	`512` ns/iter (`± 9`)	`0.98`
`misc/visitors/time-complexity/time 20`	`900` ns/iter (`± 2`)	`916` ns/iter (`± 11`)	`0.98`
`misc/visitors/time-complexity/time 40`	`3571` ns/iter (`± 13`)	`3570` ns/iter (`± 7`)	`1.00`
`misc/visitors/time-complexity/time 60`	`7334` ns/iter (`± 23`)	`7669` ns/iter (`± 150`)	`0.96`
`es/full-target/es2016`	`236321` ns/iter (`± 515`)	`239356` ns/iter (`± 329`)	`0.99`
`es/full-target/es2017`	`223568` ns/iter (`± 353`)	`225846` ns/iter (`± 691`)	`0.99`
`es/full-target/es2018`	`211054` ns/iter (`± 536`)	`213347` ns/iter (`± 663`)	`0.99`
`es2020_nullish_coalescing`	`72231` ns/iter (`± 294`)	`72645` ns/iter (`± 371`)	`0.99`
`es2020_optional_chaining`	`83261` ns/iter (`± 255`)	`83950` ns/iter (`± 233`)	`0.99`
`es2022_class_properties`	`121332` ns/iter (`± 502`)	`120702` ns/iter (`± 312`)	`1.01`
`es2018_object_rest_spread`	`71242` ns/iter (`± 580`)	`71039` ns/iter (`± 218`)	`1.00`
`es2019_optional_catch_binding`	`63118` ns/iter (`± 150`)	`65014` ns/iter (`± 175`)	`0.97`
`es2017_async_to_generator`	`63672` ns/iter (`± 176`)	`65225` ns/iter (`± 198`)	`0.98`
`es2016_exponentiation`	`68259` ns/iter (`± 258`)	`70155` ns/iter (`± 317`)	`0.97`
`es2015_arrow`	`71718` ns/iter (`± 334`)	`72553` ns/iter (`± 245`)	`0.99`
`es2015_block_scoped_fn`	`68246` ns/iter (`± 150`)	`70161` ns/iter (`± 327`)	`0.97`
`es2015_block_scoping`	`129265` ns/iter (`± 548`)	`130338` ns/iter (`± 465`)	`0.99`