Skip to content

Commit a5f7b4b

Browse files
kdy1alexander-akait
andauthoredDec 13, 2022
feat(css/compat): Support custom media queries (#6625)
Co-authored-by: alexander.akait <sheo13666q@gmail.com>
1 parent c4ab41e commit a5f7b4b

19 files changed

+1463
-70
lines changed
 

‎crates/swc_css_ast/src/at_rule.rs

+53-1
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
use is_macro::Is;
22
use string_enum::StringEnum;
33
use swc_atoms::{Atom, JsWord};
4-
use swc_common::{ast_node, EqIgnoreSpan, Span};
4+
use swc_common::{ast_node, util::take::Take, EqIgnoreSpan, Span};
55

66
use crate::{
77
CustomIdent, CustomPropertyName, DashedIdent, Declaration, Dimension, FamilyName, Function,
@@ -27,6 +27,15 @@ pub enum AtRuleName {
2727
Ident(Ident),
2828
}
2929

30+
impl PartialEq<str> for AtRuleName {
31+
fn eq(&self, other: &str) -> bool {
32+
match self {
33+
AtRuleName::DashedIdent(v) => *v == *other,
34+
AtRuleName::Ident(v) => *v == *other,
35+
}
36+
}
37+
}
38+
3039
#[ast_node]
3140
#[derive(Eq, Hash, Is, EqIgnoreSpan)]
3241
pub enum AtRulePrelude {
@@ -217,6 +226,19 @@ pub struct MediaQuery {
217226
pub condition: Option<Box<MediaConditionType>>,
218227
}
219228

229+
impl Take for MediaQuery {
230+
#[inline]
231+
fn dummy() -> Self {
232+
Self {
233+
span: Take::dummy(),
234+
modifier: Take::dummy(),
235+
media_type: Take::dummy(),
236+
keyword: Take::dummy(),
237+
condition: Take::dummy(),
238+
}
239+
}
240+
}
241+
220242
impl EqIgnoreSpan for MediaQuery {
221243
fn eq_ignore_span(&self, other: &Self) -> bool {
222244
self.modifier.eq_ignore_span(&other.modifier)
@@ -813,11 +835,23 @@ pub struct ExtensionName {
813835
}
814836

815837
impl EqIgnoreSpan for ExtensionName {
838+
#[inline]
816839
fn eq_ignore_span(&self, other: &Self) -> bool {
817840
self.value == other.value
818841
}
819842
}
820843

844+
impl Take for ExtensionName {
845+
#[inline]
846+
fn dummy() -> Self {
847+
Self {
848+
span: Take::dummy(),
849+
value: Default::default(),
850+
raw: Take::dummy(),
851+
}
852+
}
853+
}
854+
821855
#[ast_node("CustomMedia")]
822856
#[derive(Eq, Hash, EqIgnoreSpan)]
823857
pub struct CustomMediaQuery {
@@ -826,6 +860,17 @@ pub struct CustomMediaQuery {
826860
pub media: CustomMediaQueryMediaType,
827861
}
828862

863+
impl Take for CustomMediaQuery {
864+
#[inline]
865+
fn dummy() -> Self {
866+
Self {
867+
span: Take::dummy(),
868+
name: Take::dummy(),
869+
media: Take::dummy(),
870+
}
871+
}
872+
}
873+
829874
#[ast_node]
830875
#[derive(Eq, Hash, Is, EqIgnoreSpan)]
831876
pub enum CustomMediaQueryMediaType {
@@ -834,3 +879,10 @@ pub enum CustomMediaQueryMediaType {
834879
#[tag("MediaQueryList")]
835880
MediaQueryList(MediaQueryList),
836881
}
882+
883+
impl Take for CustomMediaQueryMediaType {
884+
#[inline]
885+
fn dummy() -> Self {
886+
Self::Ident(Take::dummy())
887+
}
888+
}

‎crates/swc_css_ast/src/value.rs

+18
Original file line numberDiff line numberDiff line change
@@ -20,12 +20,21 @@ pub struct Ident {
2020
}
2121

2222
impl EqIgnoreSpan for Ident {
23+
#[inline]
2324
fn eq_ignore_span(&self, other: &Self) -> bool {
2425
self.value == other.value
2526
}
2627
}
2728

29+
impl PartialEq<str> for Ident {
30+
#[inline]
31+
fn eq(&self, other: &str) -> bool {
32+
&*self.value == other
33+
}
34+
}
35+
2836
impl Take for Ident {
37+
#[inline]
2938
fn dummy() -> Self {
3039
Self {
3140
span: Default::default(),
@@ -45,6 +54,7 @@ pub struct CustomIdent {
4554
}
4655

4756
impl EqIgnoreSpan for CustomIdent {
57+
#[inline]
4858
fn eq_ignore_span(&self, other: &Self) -> bool {
4959
self.value == other.value
5060
}
@@ -60,11 +70,19 @@ pub struct DashedIdent {
6070
}
6171

6272
impl EqIgnoreSpan for DashedIdent {
73+
#[inline]
6374
fn eq_ignore_span(&self, other: &Self) -> bool {
6475
self.value == other.value
6576
}
6677
}
6778

79+
impl PartialEq<str> for DashedIdent {
80+
#[inline]
81+
fn eq(&self, other: &str) -> bool {
82+
&*self.value == other
83+
}
84+
}
85+
6886
#[ast_node("CustomPropertyName")]
6987
#[derive(Eq, Hash)]
7088
pub struct CustomPropertyName {

‎crates/swc_css_compat/src/compiler/custom_media.rs

+398
Large diffs are not rendered by default.

‎crates/swc_css_compat/src/compiler/mod.rs

+49-3
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,7 @@
1-
use swc_css_visit::VisitMut;
1+
use swc_css_ast::{AtRule, MediaCondition, MediaConditionWithoutOr, MediaQuery, Rule};
2+
use swc_css_visit::{VisitMut, VisitMutWith};
23

4+
use self::custom_media::CustomMediaHandler;
35
use crate::feature::Features;
46

57
mod custom_media;
@@ -9,6 +11,7 @@ mod custom_media;
911
pub struct Compiler {
1012
#[allow(unused)]
1113
c: Config,
14+
custom_media: CustomMediaHandler,
1215
}
1316

1417
#[derive(Debug)]
@@ -19,8 +22,51 @@ pub struct Config {
1922

2023
impl Compiler {
2124
pub fn new(config: Config) -> Self {
22-
Self { c: config }
25+
Self {
26+
c: config,
27+
custom_media: Default::default(),
28+
}
2329
}
2430
}
2531

26-
impl VisitMut for Compiler {}
32+
impl VisitMut for Compiler {
33+
fn visit_mut_at_rule(&mut self, n: &mut AtRule) {
34+
n.visit_mut_children_with(self);
35+
36+
if self.c.process.contains(Features::CUSTOM_MEDIA) {
37+
self.custom_media.store_custom_media(n);
38+
}
39+
}
40+
41+
fn visit_mut_media_query(&mut self, n: &mut MediaQuery) {
42+
n.visit_mut_children_with(self);
43+
44+
if self.c.process.contains(Features::CUSTOM_MEDIA) {
45+
self.custom_media.process_media_query(n);
46+
}
47+
}
48+
49+
fn visit_mut_media_condition(&mut self, n: &mut MediaCondition) {
50+
n.visit_mut_children_with(self);
51+
52+
if self.c.process.contains(Features::CUSTOM_MEDIA) {
53+
self.custom_media.process_media_condition(n);
54+
}
55+
}
56+
57+
fn visit_mut_media_condition_without_or(&mut self, n: &mut MediaConditionWithoutOr) {
58+
n.visit_mut_children_with(self);
59+
60+
if self.c.process.contains(Features::CUSTOM_MEDIA) {
61+
self.custom_media.process_media_condition_without_or(n);
62+
}
63+
}
64+
65+
fn visit_mut_rules(&mut self, n: &mut Vec<Rule>) {
66+
n.visit_mut_children_with(self);
67+
68+
if self.c.process.contains(Features::CUSTOM_MEDIA) {
69+
self.custom_media.process_rules(n);
70+
}
71+
}
72+
}

‎crates/swc_css_compat/src/feature.rs

+2-1
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@ use bitflags::bitflags;
22

33
bitflags! {
44
pub struct Features: u64 {
5-
const NESTING = 0b00000001;
5+
const NESTING = 1 << 0;
6+
const CUSTOM_MEDIA = 1 << 1;
67
}
78
}

‎crates/swc_css_compat/src/lib.rs

+2
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,6 @@
1+
#![feature(box_syntax)]
12
#![feature(box_patterns)]
3+
#![allow(clippy::boxed_local)]
24
#![allow(clippy::vec_box)]
35

46
pub mod compiler;
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,224 @@
1+
@custom-media --mq-a (max-width: 30em), (max-height: 30em);
2+
@custom-media --mq-b screen and (max-width: 30em);
3+
@custom-media --not-mq-a not all and (--mq-a);
4+
5+
@import url("narrow.css") supports(display: flex) screen and (--mq-a);
6+
@import url("narrow.css") supports(display: flex) (--mq-a);
7+
@import url("narrow.css") (--mq-a);
8+
9+
@media (--mq-a) {
10+
body {
11+
order: 1;
12+
}
13+
}
14+
15+
@media (--mq-b) {
16+
body {
17+
order: 1;
18+
}
19+
}
20+
21+
@media (--mq-a), (--mq-a) {
22+
body {
23+
order: 1;
24+
}
25+
}
26+
27+
@media not all and (--mq-a) {
28+
body {
29+
order: 2;
30+
}
31+
}
32+
33+
@media (--not-mq-a) {
34+
body {
35+
order: 1;
36+
}
37+
}
38+
39+
@media not all and (--not-mq-a) {
40+
body {
41+
order: 2;
42+
}
43+
}
44+
45+
@custom-media --not (not (min-width: 20px));
46+
47+
@media (--not) and (width > 1024px) {
48+
.a { color: green; }
49+
}
50+
51+
@custom-media --not1 (not (min-width: 20px)) and (min-width: 20px);
52+
53+
@media (--not1) and (width > 1024px) {
54+
.a { color: green; }
55+
}
56+
57+
@custom-media --or (min-width: 20px) or (min-width: 20px);
58+
59+
@media (--or) and (width > 1024px) {
60+
.a { color: green; }
61+
}
62+
63+
@custom-media --or1 (not (min-width: 20px)) or (min-width: 20px);
64+
65+
@media (--or1) and (width > 1024px) {
66+
.a { color: green; }
67+
}
68+
69+
@custom-media --and (min-width: 20px) and (min-width: 20px);
70+
71+
@media (--and) and (width > 1024px) {
72+
.a { color: green; }
73+
}
74+
75+
@custom-media --and1 (not (min-width: 20px)) and (min-width: 20px);
76+
77+
@media (--and1) and (width > 1024px) {
78+
.a { color: green; }
79+
}
80+
81+
/* TODO warning on such cases */
82+
@custom-media --circular-mq-a (--circular-mq-b);
83+
@custom-media --circular-mq-b (--circular-mq-a);
84+
85+
@media (--circular-mq-a) {
86+
body {
87+
order: 3;
88+
}
89+
}
90+
91+
@media (--circular-mq-b) {
92+
body {
93+
order: 4;
94+
}
95+
}
96+
97+
@media (--unresolved-mq) {
98+
body {
99+
order: 5;
100+
}
101+
}
102+
103+
@CUSTOM-MEDIA --CASE (max-width: 30em), (max-height: 30em);
104+
105+
@media (--CASE) {
106+
body {
107+
order: 1;
108+
}
109+
}
110+
111+
/* TODO do prescan */
112+
@media (--foo) {
113+
body {
114+
background-color: red;
115+
}
116+
}
117+
118+
@custom-media --foo print;
119+
120+
@custom-media --screen only screen;
121+
122+
@media (--screen) {
123+
body {
124+
background-color: red;
125+
}
126+
}
127+
128+
@custom-media --screen only screen;
129+
130+
@media only screen and (--screen) {
131+
body {
132+
background-color: red;
133+
}
134+
}
135+
136+
@media ((((((--mq-a)))))) {
137+
body {
138+
order: 1;
139+
}
140+
}
141+
142+
@custom-media --mq-d (max-width: 40em);
143+
144+
@media ((((((--mq-a))))) or ((((--mq-d))))) {
145+
body {
146+
order: 1;
147+
}
148+
}
149+
150+
@custom-media --mq-e (max-width: 40em), (max-height: 40em);
151+
152+
@media ((((((--mq-a))))) or ((((--mq-e))))) {
153+
body {
154+
order: 1;
155+
}
156+
}
157+
158+
159+
@media ((((((--mq-a)))))), ((((((--mq-a)))))) {
160+
body {
161+
order: 1;
162+
}
163+
}
164+
165+
@media ((((((--mq-a))))) or ((((--mq-e))))), ((((((--mq-a))))) or ((((--mq-e))))) {
166+
body {
167+
order: 1;
168+
}
169+
}
170+
171+
@media (--mq-a) or (--mq-e), (--mq-a) or (--mq-e) {
172+
body {
173+
order: 1;
174+
}
175+
}
176+
177+
@media ((((((--mq-a) or ((((((--mq-a))))))))))) {
178+
body {
179+
order: 1;
180+
}
181+
}
182+
183+
@media (not (--mq-a)) or (hover) {
184+
.a {
185+
color: red;
186+
}
187+
}
188+
189+
@media ((max-width: 30em) or (--mq-a)) {
190+
body {
191+
order: 1;
192+
}
193+
}
194+
195+
@media ((max-width: 30em) and (--mq-a)) {
196+
body {
197+
order: 1;
198+
}
199+
}
200+
201+
@media ((max-width: 30em) and (not (--mq-a))) {
202+
body {
203+
order: 1;
204+
}
205+
}
206+
207+
/* We can't lower the syntax here and should print a warning */
208+
@custom-media --screen screen and (max-width: 30em);
209+
@custom-media --print print and (max-width: 30em);
210+
211+
@media (--screen) or (--print) {
212+
.a {
213+
color: red;
214+
}
215+
}
216+
217+
/* We can't lower the syntax here and should print a warning */
218+
@custom-media --print print and (max-width: 30em);
219+
220+
@media screen and (--print) {
221+
.a {
222+
color: red;
223+
}
224+
}
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,163 @@
1+
@import url("narrow.css") supports(display: flex) screen and ((max-width: 30em) or (max-height: 30em));
2+
@import url("narrow.css") supports(display: flex) ((max-width: 30em) or (max-height: 30em));
3+
@import url("narrow.css") ((max-width: 30em) or (max-height: 30em));
4+
@media ((max-width: 30em) or (max-height: 30em)) {
5+
body {
6+
order: 1;
7+
}
8+
}
9+
@media screen and (max-width: 30em) {
10+
body {
11+
order: 1;
12+
}
13+
}
14+
@media ((max-width: 30em) or (max-height: 30em)), ((max-width: 30em) or (max-height: 30em)) {
15+
body {
16+
order: 1;
17+
}
18+
}
19+
@media not all and ((max-width: 30em) or (max-height: 30em)) {
20+
body {
21+
order: 2;
22+
}
23+
}
24+
@media not all and ((max-width: 30em) or (max-height: 30em)) {
25+
body {
26+
order: 1;
27+
}
28+
}
29+
@media not all and ((max-width: 30em) or (max-height: 30em)) {
30+
body {
31+
order: 2;
32+
}
33+
}
34+
@media (not (min-width: 20px)) and (width > 1024px) {
35+
.a {
36+
color: green;
37+
}
38+
}
39+
@media ((not (min-width: 20px)) and (min-width: 20px)) and (width > 1024px) {
40+
.a {
41+
color: green;
42+
}
43+
}
44+
@media ((min-width: 20px) or (min-width: 20px)) and (width > 1024px) {
45+
.a {
46+
color: green;
47+
}
48+
}
49+
@media ((not (min-width: 20px)) or (min-width: 20px)) and (width > 1024px) {
50+
.a {
51+
color: green;
52+
}
53+
}
54+
@media ((min-width: 20px) and (min-width: 20px)) and (width > 1024px) {
55+
.a {
56+
color: green;
57+
}
58+
}
59+
@media ((not (min-width: 20px)) and (min-width: 20px)) and (width > 1024px) {
60+
.a {
61+
color: green;
62+
}
63+
}
64+
@media (--circular-mq-b) {
65+
body {
66+
order: 3;
67+
}
68+
}
69+
@media (--circular-mq-b) {
70+
body {
71+
order: 4;
72+
}
73+
}
74+
@media (--unresolved-mq) {
75+
body {
76+
order: 5;
77+
}
78+
}
79+
@media ((max-width: 30em) or (max-height: 30em)) {
80+
body {
81+
order: 1;
82+
}
83+
}
84+
@media (--foo) {
85+
body {
86+
background-color: red;
87+
}
88+
}
89+
@media only screen {
90+
body {
91+
background-color: red;
92+
}
93+
}
94+
@media only screen {
95+
body {
96+
background-color: red;
97+
}
98+
}
99+
@media (((((((max-width: 30em) or (max-height: 30em))))))) {
100+
body {
101+
order: 1;
102+
}
103+
}
104+
@media (((((((max-width: 30em) or (max-height: 30em)))))) or ((((max-width: 40em))))) {
105+
body {
106+
order: 1;
107+
}
108+
}
109+
@media (((((((max-width: 30em) or (max-height: 30em)))))) or (((((max-width: 40em) or (max-height: 40em)))))) {
110+
body {
111+
order: 1;
112+
}
113+
}
114+
@media (((((((max-width: 30em) or (max-height: 30em))))))), (((((((max-width: 30em) or (max-height: 30em))))))) {
115+
body {
116+
order: 1;
117+
}
118+
}
119+
@media (((((((max-width: 30em) or (max-height: 30em)))))) or (((((max-width: 40em) or (max-height: 40em)))))), (((((((max-width: 30em) or (max-height: 30em)))))) or (((((max-width: 40em) or (max-height: 40em)))))) {
120+
body {
121+
order: 1;
122+
}
123+
}
124+
@media ((max-width: 30em) or (max-height: 30em)) or ((max-width: 40em) or (max-height: 40em)), ((max-width: 30em) or (max-height: 30em)) or ((max-width: 40em) or (max-height: 40em)) {
125+
body {
126+
order: 1;
127+
}
128+
}
129+
@media (((((((max-width: 30em) or (max-height: 30em)) or (((((((max-width: 30em) or (max-height: 30em)))))))))))) {
130+
body {
131+
order: 1;
132+
}
133+
}
134+
@media (not ((max-width: 30em) or (max-height: 30em))) or (hover) {
135+
.a {
136+
color: red;
137+
}
138+
}
139+
@media ((max-width: 30em) or ((max-width: 30em) or (max-height: 30em))) {
140+
body {
141+
order: 1;
142+
}
143+
}
144+
@media ((max-width: 30em) and ((max-width: 30em) or (max-height: 30em))) {
145+
body {
146+
order: 1;
147+
}
148+
}
149+
@media ((max-width: 30em) and (not ((max-width: 30em) or (max-height: 30em)))) {
150+
body {
151+
order: 1;
152+
}
153+
}
154+
@media print and (max-width: 30em) {
155+
.a {
156+
color: red;
157+
}
158+
}
159+
@media print and (max-width: 30em) {
160+
.a {
161+
color: red;
162+
}
163+
}

‎crates/swc_css_compat/tests/custom-media-query/basic.import.expect.css

Whitespace-only changes.
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,224 @@
1+
@custom-media --mq-a (max-width: 30em), (max-height: 30em);
2+
@custom-media --mq-b screen and (max-width: 30em);
3+
@custom-media --not-mq-a not all and (--mq-a);
4+
5+
@media (max-width: 30em),(max-height: 30em) {
6+
body {
7+
order: 1;
8+
}
9+
}
10+
11+
@media (--mq-a) {
12+
body {
13+
order: 1;
14+
}
15+
}
16+
17+
@media screen and (max-width: 30em) {
18+
body {
19+
order: 1;
20+
}
21+
}
22+
23+
@media (--mq-b) {
24+
body {
25+
order: 1;
26+
}
27+
}
28+
29+
@media (max-width: 30em),(max-height: 30em), (max-width: 30em), (max-height: 30em) {
30+
body {
31+
order: 1;
32+
}
33+
}
34+
35+
@media (--mq-a), (--mq-a) {
36+
body {
37+
order: 1;
38+
}
39+
}
40+
41+
@media not all and (max-width: 30em),not all and (max-height: 30em) {
42+
body {
43+
order: 2;
44+
}
45+
}
46+
47+
@media not all and (--mq-a) {
48+
body {
49+
order: 2;
50+
}
51+
}
52+
53+
@media not all and (max-width: 30em),not all and (max-height: 30em) {
54+
body {
55+
order: 1;
56+
}
57+
}
58+
59+
@media (--not-mq-a) {
60+
body {
61+
order: 1;
62+
}
63+
}
64+
65+
@media all and (max-width: 30em),all and (max-height: 30em) {
66+
body {
67+
order: 2;
68+
}
69+
}
70+
71+
@media not all and (--not-mq-a) {
72+
body {
73+
order: 2;
74+
}
75+
}
76+
77+
@custom-media --circular-mq-a (--circular-mq-b);
78+
@custom-media --circular-mq-b (--circular-mq-a);
79+
80+
@media (--circular-mq-a) {
81+
body {
82+
order: 3;
83+
}
84+
}
85+
86+
@media (--circular-mq-b) {
87+
body {
88+
order: 4;
89+
}
90+
}
91+
92+
@media (--unresolved-mq) {
93+
body {
94+
order: 5;
95+
}
96+
}
97+
98+
@custom-media --min (min-width: 320px);
99+
@custom-media --max (max-width: 640px);
100+
101+
@media (min-width: 320px) and (max-width: 640px) {
102+
body {
103+
order: 6;
104+
}
105+
}
106+
107+
@media (--min) and (--max) {
108+
body {
109+
order: 6;
110+
}
111+
}
112+
113+
@custom-media --concat (min-width: 320px) and (max-width: 640px);
114+
115+
@media (min-width: 320px) and (max-width: 640px) {
116+
body {
117+
order: 7;
118+
}
119+
}
120+
121+
@media (--concat) {
122+
body {
123+
order: 7;
124+
}
125+
}
126+
127+
@media (min-width: 320px) and (max-width: 640px) and (min-aspect-ratio: 16/9) {
128+
body {
129+
order: 8;
130+
}
131+
}
132+
133+
@media (--concat) and (min-aspect-ratio: 16/9) {
134+
body {
135+
order: 8;
136+
}
137+
}
138+
139+
@media (max-width: 30em),(max-height: 30em) {
140+
body {
141+
order: 1000;
142+
}
143+
}
144+
145+
@media ( --mq-a ) {
146+
body {
147+
order: 1000;
148+
}
149+
}
150+
151+
@media (max-width: 30em),(max-height: 30em) {
152+
body {
153+
order: 1001;
154+
}
155+
}
156+
157+
@media ( --mq-a ) {
158+
body {
159+
order: 1001;
160+
}
161+
}
162+
163+
@media (max-width: 30em),(max-height: 30em), (max-width: 30em), (max-height: 30em) {
164+
body {
165+
order: 1002;
166+
}
167+
}
168+
169+
@media ( --mq-a ), ( --mq-a ) {
170+
body {
171+
order: 1002;
172+
}
173+
}
174+
175+
@media (max-width: 30em),(max-height: 30em), (max-width: 30em), (max-height: 30em) {
176+
body {
177+
order: 1003;
178+
}
179+
}
180+
181+
@media ( --mq-a ), ( --mq-a ) {
182+
body {
183+
order: 1003;
184+
}
185+
}
186+
187+
@media (max-width: 30em),(max-height: 30em), (max-width: 30em), (max-height: 30em) {
188+
body {
189+
order: 1004;
190+
}
191+
}
192+
193+
@media ( --mq-a ), ( --mq-a ) {
194+
body {
195+
order: 1004;
196+
}
197+
}
198+
199+
@media (max-width: 30em),(max-height: 30em),
200+
(max-width: 30em),
201+
(max-height: 30em) {
202+
body {
203+
order: 1005;
204+
}
205+
}
206+
207+
@media (
208+
--mq-a
209+
),
210+
(
211+
--mq-a
212+
) {
213+
body {
214+
order: 1005;
215+
}
216+
}
217+
218+
@media (trailer--) {
219+
body {
220+
order: 1006;
221+
}
222+
}
223+
224+
@custom-media trailer-- (min-width: 320px);
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,110 @@
1+
@custom-media --🧑🏾‍🎤 (min-width: 1);
2+
3+
@media (--🧑🏾‍🎤) {
4+
.a {
5+
order: 1;
6+
}
7+
}
8+
9+
@custom-media --\(\)-escaped (min-width: 2);
10+
11+
@media (--\(\)-escaped) {
12+
.a {
13+
order: 2;
14+
}
15+
}
16+
17+
@custom-media --modern (min-width: 3), (min-width: 4);
18+
19+
@media (--modern) and (width > 1024px) {
20+
.a { order: 3; }
21+
}
22+
23+
@custom-media --test1 (color), (hover);
24+
25+
@media (--test1) and (width > 1024px) {
26+
.a { color: green; }
27+
}
28+
29+
@custom-media --test2 not (color), (hover);
30+
31+
@media (--test2) and (width > 1024px) {
32+
body { background: red; }
33+
}
34+
35+
@custom-media --test3 (color) and (min-width: 20px), (hover);
36+
37+
@media (--test3) and (min-height: 20px) {
38+
.a { color: green; }
39+
}
40+
41+
@custom-media --screen only screen;
42+
@custom-media --md-and-larger1 (--screen) and (width >= 570px);
43+
44+
@media (--md-and-larger1) {
45+
body {
46+
background-color: orange;
47+
}
48+
}
49+
50+
@custom-media --screen only screen;
51+
@custom-media --md-and-larger1 --screen and (width >= 570px);
52+
@custom-media --md-and-larger2 (--screen) and (width >= 570px);
53+
@custom-media --md-and-larger3 only screen and (width >= 570px);
54+
@custom-media --md-larger4 (width >=570px);
55+
@custom-media --md-smaller4 (width < 1000px);
56+
57+
@media (--md-and-larger1) {
58+
body {
59+
background-color: red;
60+
}
61+
}
62+
63+
@media (--md-and-larger2) {
64+
body {
65+
background-color: yellow;
66+
}
67+
}
68+
69+
@media (--md-and-larger3) {
70+
body {
71+
background-color: green;
72+
}
73+
}
74+
75+
@media (--screen) and (--md-larger4) {
76+
body {
77+
background-color: green;
78+
}
79+
}
80+
81+
@media (--screen) or (--md-larger4) {
82+
body {
83+
background-color: green;
84+
}
85+
}
86+
87+
@media not (--md-larger4) {
88+
body {
89+
background-color: green;
90+
}
91+
}
92+
93+
94+
@media (--screen) and (not (--md-larger4)) {
95+
body {
96+
background-color: green;
97+
}
98+
}
99+
100+
@media ((--screen) and (not (--md-larger4))) {
101+
body {
102+
background-color: green;
103+
}
104+
}
105+
106+
@media (--md-larger4) and (--md-smaller4) {
107+
body {
108+
background-color: green;
109+
}
110+
}
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,80 @@
1+
@media (min-width: 1) {
2+
.a {
3+
order: 1;
4+
}
5+
}
6+
@media (min-width: 2) {
7+
.a {
8+
order: 2;
9+
}
10+
}
11+
@media ((min-width: 3) or (min-width: 4)) and (width > 1024px) {
12+
.a {
13+
order: 3;
14+
}
15+
}
16+
@media ((color) or (hover)) and (width > 1024px) {
17+
.a {
18+
color: green;
19+
}
20+
}
21+
@media ((not (color)) or (hover)) and (width > 1024px) {
22+
body {
23+
background: red;
24+
}
25+
}
26+
@media (((color) and (min-width: 20px)) or (hover)) and (min-height: 20px) {
27+
.a {
28+
color: green;
29+
}
30+
}
31+
@media only screen and (width >= 570px) {
32+
body {
33+
background-color: orange;
34+
}
35+
}
36+
@media only screen and (width >= 570px) {
37+
body {
38+
background-color: red;
39+
}
40+
}
41+
@media only screen and (width >= 570px) {
42+
body {
43+
background-color: yellow;
44+
}
45+
}
46+
@media only screen and (width >= 570px) {
47+
body {
48+
background-color: green;
49+
}
50+
}
51+
@media only screen and (width >= 570px) {
52+
body {
53+
background-color: green;
54+
}
55+
}
56+
@media only screen and (width >= 570px) {
57+
body {
58+
background-color: green;
59+
}
60+
}
61+
@media not (width >= 570px) {
62+
body {
63+
background-color: green;
64+
}
65+
}
66+
@media only screen and (not (width >= 570px)) {
67+
body {
68+
background-color: green;
69+
}
70+
}
71+
@media only screen and ((not (width >= 570px))) {
72+
body {
73+
background-color: green;
74+
}
75+
}
76+
@media (width >= 570px) and (width < 1000px) {
77+
body {
78+
background-color: green;
79+
}
80+
}
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
@custom-media --small-viewport (max-width: 30em);
2+
3+
@media (--small-viewport) {
4+
/* styles for small viewport */
5+
}
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
@media (max-width: 30em) {}
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
@custom-media --small-viewport (max-width: 30em);
2+
3+
@media (max-width: 30em) {
4+
/* styles for small viewport */
5+
}
6+
7+
@media (--small-viewport) {
8+
/* styles for small viewport */
9+
}
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
@custom-media --mq-a (max-width: 30em), (max-height: 30em);
2+
@custom-media --mq-b screen and (max-width: 30em);
3+
@custom-media --not-mq-a not all and (--mq-a);
4+
@custom-media --circular-mq-a (--circular-mq-b);
5+
@custom-media --circular-mq-b (--circular-mq-a);
6+
@custom-media --min (min-width: 320px);
7+
@custom-media --max (max-width: 640px);
8+
@custom-media --concat (min-width: 320px) and (max-width: 640px);
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
{
2+
"custom-media": {
3+
"--mq-a": "(max-width: 30em), (max-height: 30em)",
4+
"--mq-b": "screen and (max-width: 30em)",
5+
"--not-mq-a": "not all and (--mq-a)",
6+
"--circular-mq-a": "(--circular-mq-b)",
7+
"--circular-mq-b": "(--circular-mq-a)",
8+
"--min": "(min-width: 320px)",
9+
"--max": "(max-width: 640px)",
10+
"--concat": "(min-width: 320px) and (max-width: 640px)"
11+
}
12+
}
+105
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,105 @@
1+
//! Tests ported from https://github.com/thysultan/stylis.js
2+
//!
3+
//! License is MIT, which is original license at the time of copying.
4+
//! Original test authors have copyright for their work.
5+
#![deny(warnings)]
6+
#![allow(clippy::needless_update)]
7+
8+
use std::path::PathBuf;
9+
10+
use swc_common::{errors::HANDLER, sync::Lrc, SourceFile};
11+
use swc_css_ast::Stylesheet;
12+
use swc_css_codegen::{
13+
writer::basic::{BasicCssWriter, BasicCssWriterConfig},
14+
CodegenConfig, Emit,
15+
};
16+
use swc_css_compat::{
17+
compiler::{Compiler, Config},
18+
feature::Features,
19+
nesting::nesting,
20+
};
21+
use swc_css_parser::{parse_file, parser::ParserConfig};
22+
use swc_css_visit::VisitMutWith;
23+
use testing::NormalizedOutput;
24+
25+
fn parse_stylesheet(fm: &Lrc<SourceFile>) -> Stylesheet {
26+
let mut errors = vec![];
27+
let ss: Stylesheet = parse_file(
28+
fm,
29+
ParserConfig {
30+
allow_wrong_line_comments: true,
31+
..Default::default()
32+
},
33+
&mut errors,
34+
)
35+
.unwrap();
36+
for err in errors {
37+
HANDLER.with(|handler| {
38+
err.to_diagnostics(handler).emit();
39+
});
40+
}
41+
42+
ss
43+
}
44+
45+
fn print_stylesheet(ss: &Stylesheet) -> String {
46+
let mut s = String::new();
47+
{
48+
let mut wr = BasicCssWriter::new(&mut s, None, BasicCssWriterConfig::default());
49+
let mut gen = swc_css_codegen::CodeGenerator::new(&mut wr, CodegenConfig { minify: false });
50+
51+
gen.emit(&ss).unwrap();
52+
}
53+
54+
s
55+
}
56+
57+
fn test_nesting(input: PathBuf, suffix: Option<&str>) {
58+
let parent = input.parent().unwrap();
59+
let output = match suffix {
60+
Some(suffix) => parent.join("output.".to_owned() + suffix + ".css"),
61+
_ => parent.join("output.css"),
62+
};
63+
64+
testing::run_test(false, |cm, _| {
65+
//
66+
let fm = cm.load_file(&input).unwrap();
67+
let mut ss = parse_stylesheet(&fm);
68+
69+
ss.visit_mut_with(&mut nesting());
70+
71+
let s = print_stylesheet(&ss);
72+
73+
NormalizedOutput::from(s).compare_to_file(&output).unwrap();
74+
75+
Ok(())
76+
})
77+
.unwrap();
78+
}
79+
80+
#[testing::fixture("tests/nesting/**/input.css")]
81+
fn test_nesting_without_env(input: PathBuf) {
82+
test_nesting(input, None)
83+
}
84+
85+
#[testing::fixture("tests/custom-media-query/**/*.css", exclude("expect.css"))]
86+
fn test_custom_media_query(input: PathBuf) {
87+
let output = input.with_extension("expect.css");
88+
89+
testing::run_test(false, |cm, _| {
90+
//
91+
let fm = cm.load_file(&input).unwrap();
92+
let mut ss = parse_stylesheet(&fm);
93+
94+
ss.visit_mut_with(&mut Compiler::new(Config {
95+
process: Features::CUSTOM_MEDIA,
96+
}));
97+
98+
let s = print_stylesheet(&ss);
99+
100+
NormalizedOutput::from(s).compare_to_file(&output).unwrap();
101+
102+
Ok(())
103+
})
104+
.unwrap();
105+
}

‎crates/swc_css_compat/tests/nesting.rs

-65
This file was deleted.

1 commit comments

Comments
 (1)

github-actions[bot] commented on Dec 13, 2022

@github-actions[bot]

Benchmark

Benchmark suite Current: a5f7b4b Previous: 8b2e1d1 Ratio
es/full/bugs-1 296770 ns/iter (± 8893) 295748 ns/iter (± 5977) 1.00
es/full/minify/libraries/antd 1769493389 ns/iter (± 32867930) 1679739698 ns/iter (± 10412366) 1.05
es/full/minify/libraries/d3 348633613 ns/iter (± 7522665) 321819129 ns/iter (± 2116496) 1.08
es/full/minify/libraries/echarts 1491180558 ns/iter (± 18659895) 1405121819 ns/iter (± 8529336) 1.06
es/full/minify/libraries/jquery 92163611 ns/iter (± 647813) 91155402 ns/iter (± 352702) 1.01
es/full/minify/libraries/lodash 110891861 ns/iter (± 1907971) 108454482 ns/iter (± 752254) 1.02
es/full/minify/libraries/moment 54636429 ns/iter (± 472180) 52456659 ns/iter (± 470173) 1.04
es/full/minify/libraries/react 19717949 ns/iter (± 243422) 19301029 ns/iter (± 138582) 1.02
es/full/minify/libraries/terser 272295220 ns/iter (± 6732785) 249529606 ns/iter (± 1824892) 1.09
es/full/minify/libraries/three 501038117 ns/iter (± 10342569) 454853033 ns/iter (± 5398279) 1.10
es/full/minify/libraries/typescript 3371090614 ns/iter (± 14694451) 3196954260 ns/iter (± 14112960) 1.05
es/full/minify/libraries/victory 756348382 ns/iter (± 22967499) 669683983 ns/iter (± 10211638) 1.13
es/full/minify/libraries/vue 139338900 ns/iter (± 2566896) 133081951 ns/iter (± 807444) 1.05
es/full/codegen/es3 27731 ns/iter (± 43) 27782 ns/iter (± 34) 1.00
es/full/codegen/es5 27718 ns/iter (± 76) 27869 ns/iter (± 69) 0.99
es/full/codegen/es2015 27746 ns/iter (± 67) 27900 ns/iter (± 70) 0.99
es/full/codegen/es2016 27689 ns/iter (± 88) 27794 ns/iter (± 119) 1.00
es/full/codegen/es2017 27654 ns/iter (± 73) 27798 ns/iter (± 169) 0.99
es/full/codegen/es2018 27654 ns/iter (± 57) 27798 ns/iter (± 82) 0.99
es/full/codegen/es2019 27679 ns/iter (± 54) 27797 ns/iter (± 144) 1.00
es/full/codegen/es2020 27697 ns/iter (± 53) 27756 ns/iter (± 95) 1.00
es/full/all/es3 169113246 ns/iter (± 2753658) 167604881 ns/iter (± 2499207) 1.01
es/full/all/es5 163787691 ns/iter (± 2044588) 158599238 ns/iter (± 3478194) 1.03
es/full/all/es2015 121785196 ns/iter (± 1553139) 119880577 ns/iter (± 783536) 1.02
es/full/all/es2016 120949053 ns/iter (± 1839472) 119352251 ns/iter (± 1338220) 1.01
es/full/all/es2017 120012908 ns/iter (± 1283518) 118546026 ns/iter (± 925479) 1.01
es/full/all/es2018 118735458 ns/iter (± 1288693) 117102442 ns/iter (± 1510660) 1.01
es/full/all/es2019 117433949 ns/iter (± 1675653) 115768114 ns/iter (± 1171190) 1.01
es/full/all/es2020 112669110 ns/iter (± 992375) 111305978 ns/iter (± 944165) 1.01
es/full/parser 524692 ns/iter (± 9411) 519247 ns/iter (± 8871) 1.01
es/full/base/fixer 21989 ns/iter (± 43) 21530 ns/iter (± 69) 1.02
es/full/base/resolver_and_hygiene 78012 ns/iter (± 276) 77998 ns/iter (± 138) 1.00
serialization of ast node 121 ns/iter (± 0) 122 ns/iter (± 0) 0.99
serialization of serde 125 ns/iter (± 0) 126 ns/iter (± 0) 0.99
css/minify/libraries/bootstrap 27332423 ns/iter (± 142671) 26975319 ns/iter (± 83976) 1.01
css/visitor/compare/clone 2076110 ns/iter (± 13864) 2076878 ns/iter (± 17032) 1.00
css/visitor/compare/visit_mut_span 2265474 ns/iter (± 3769) 2271660 ns/iter (± 10294) 1.00
css/visitor/compare/visit_mut_span_panic 2320891 ns/iter (± 12781) 2324806 ns/iter (± 5877) 1.00
css/visitor/compare/fold_span 2968557 ns/iter (± 14678) 2982437 ns/iter (± 18716) 1.00
css/visitor/compare/fold_span_panic 3132601 ns/iter (± 26302) 3116280 ns/iter (± 18628) 1.01
css/lexer/bootstrap_5_1_3 5217247 ns/iter (± 6771) 5175361 ns/iter (± 11039) 1.01
css/lexer/foundation_6_7_4 4399462 ns/iter (± 4315) 4387848 ns/iter (± 8932) 1.00
css/lexer/tailwind_3_1_1 825587 ns/iter (± 738) 822903 ns/iter (± 1988) 1.00
css/parser/bootstrap_5_1_3 20691717 ns/iter (± 92651) 20737384 ns/iter (± 31324) 1.00
css/parser/foundation_6_7_4 16503901 ns/iter (± 75957) 16600683 ns/iter (± 24351) 0.99
css/parser/tailwind_3_1_1 3186416 ns/iter (± 7432) 3192294 ns/iter (± 11575) 1.00
es/codegen/colors 322071 ns/iter (± 181672) 320642 ns/iter (± 179878) 1.00
es/codegen/large 1214203 ns/iter (± 650630) 1204379 ns/iter (± 646557) 1.01
es/codegen/with-parser/colors 46708 ns/iter (± 287) 46614 ns/iter (± 275) 1.00
es/codegen/with-parser/large 514686 ns/iter (± 1285) 516351 ns/iter (± 1095) 1.00
es/minify/libraries/antd 1552122181 ns/iter (± 17461366) 1459789358 ns/iter (± 8603267) 1.06
es/minify/libraries/d3 295349000 ns/iter (± 6804337) 279213650 ns/iter (± 1616911) 1.06
es/minify/libraries/echarts 1304080994 ns/iter (± 21326201) 1247198808 ns/iter (± 13304039) 1.05
es/minify/libraries/jquery 79671717 ns/iter (± 859110) 78903172 ns/iter (± 824418) 1.01
es/minify/libraries/lodash 99647653 ns/iter (± 1617206) 97049787 ns/iter (± 1017517) 1.03
es/minify/libraries/moment 47160661 ns/iter (± 628131) 45746771 ns/iter (± 251234) 1.03
es/minify/libraries/react 17537813 ns/iter (± 179437) 17277577 ns/iter (± 125660) 1.02
es/minify/libraries/terser 231516997 ns/iter (± 5296672) 219161570 ns/iter (± 4718234) 1.06
es/minify/libraries/three 426852078 ns/iter (± 17683045) 382240838 ns/iter (± 2926674) 1.12
es/minify/libraries/typescript 2916217052 ns/iter (± 18042167) 2760663081 ns/iter (± 14741160) 1.06
es/minify/libraries/victory 637320892 ns/iter (± 17561772) 584211895 ns/iter (± 7886213) 1.09
es/minify/libraries/vue 121421422 ns/iter (± 1335235) 118129739 ns/iter (± 1441011) 1.03
es/visitor/compare/clone 2410822 ns/iter (± 10407) 2426669 ns/iter (± 19470) 0.99
es/visitor/compare/visit_mut_span 2800208 ns/iter (± 10802) 2798518 ns/iter (± 6445) 1.00
es/visitor/compare/visit_mut_span_panic 2848878 ns/iter (± 8774) 2835358 ns/iter (± 4045) 1.00
es/visitor/compare/fold_span 3959688 ns/iter (± 25081) 3934973 ns/iter (± 8673) 1.01
es/visitor/compare/fold_span_panic 4142506 ns/iter (± 19049) 4074329 ns/iter (± 10165) 1.02
es/lexer/colors 17264 ns/iter (± 32) 17424 ns/iter (± 39) 0.99
es/lexer/angular 8214758 ns/iter (± 23467) 8274279 ns/iter (± 21674) 0.99
es/lexer/backbone 1070123 ns/iter (± 2843) 1080714 ns/iter (± 2088) 0.99
es/lexer/jquery 5940307 ns/iter (± 6348) 5984769 ns/iter (± 10008) 0.99
es/lexer/jquery mobile 9154217 ns/iter (± 6316) 9216831 ns/iter (± 10540) 0.99
es/lexer/mootools 4654164 ns/iter (± 6616) 4704044 ns/iter (± 7748) 0.99
es/lexer/underscore 892743 ns/iter (± 521) 899183 ns/iter (± 1693) 0.99
es/lexer/three 27801144 ns/iter (± 76543) 28043351 ns/iter (± 63944) 0.99
es/lexer/yui 5043012 ns/iter (± 6206) 5087972 ns/iter (± 8299) 0.99
es/parser/colors 30651 ns/iter (± 147) 30653 ns/iter (± 142) 1.00
es/parser/angular 15789661 ns/iter (± 381800) 15426123 ns/iter (± 195391) 1.02
es/parser/backbone 2317995 ns/iter (± 10364) 2304906 ns/iter (± 16474) 1.01
es/parser/jquery 12621529 ns/iter (± 162228) 12549540 ns/iter (± 104357) 1.01
es/parser/jquery mobile 20260730 ns/iter (± 366628) 19657247 ns/iter (± 217839) 1.03
es/parser/mootools 9604879 ns/iter (± 34092) 9552219 ns/iter (± 36978) 1.01
es/parser/underscore 1959452 ns/iter (± 12610) 1955392 ns/iter (± 12997) 1.00
es/parser/three 60965085 ns/iter (± 646136) 58194066 ns/iter (± 845626) 1.05
es/parser/yui 9606784 ns/iter (± 82544) 9541795 ns/iter (± 39593) 1.01
es/preset-env/usage/builtin_type 141204 ns/iter (± 31642) 141239 ns/iter (± 31966) 1.00
es/preset-env/usage/property 21342 ns/iter (± 77) 21151 ns/iter (± 77) 1.01
es/resolver/typescript 121504465 ns/iter (± 1077328) 119879371 ns/iter (± 2187264) 1.01
es/fixer/typescript 97103323 ns/iter (± 1140390) 92786260 ns/iter (± 1020079) 1.05
es/hygiene/typescript 192607321 ns/iter (± 1160254) 181318432 ns/iter (± 1504121) 1.06
es/resolver_with_hygiene/typescript 327533969 ns/iter (± 2913489) 309297765 ns/iter (± 2962187) 1.06
es/visitor/base-perf/module_clone 74071 ns/iter (± 1459) 73947 ns/iter (± 1459) 1.00
es/visitor/base-perf/fold_empty 85952 ns/iter (± 715) 85091 ns/iter (± 1823) 1.01
es/visitor/base-perf/fold_noop_impl_all 86761 ns/iter (± 1662) 85790 ns/iter (± 1662) 1.01
es/visitor/base-perf/fold_noop_impl_vec 88202 ns/iter (± 1543) 85062 ns/iter (± 1352) 1.04
es/visitor/base-perf/boxing_boxed_clone 54 ns/iter (± 0) 54 ns/iter (± 0) 1
es/visitor/base-perf/boxing_unboxed_clone 58 ns/iter (± 0) 58 ns/iter (± 0) 1
es/visitor/base-perf/boxing_boxed 99 ns/iter (± 0) 100 ns/iter (± 0) 0.99
es/visitor/base-perf/boxing_unboxed 102 ns/iter (± 0) 101 ns/iter (± 0) 1.01
es/visitor/base-perf/visit_contains_this 3541 ns/iter (± 58) 3361 ns/iter (± 66) 1.05
es/base/parallel/resolver/typescript 5469680780 ns/iter (± 253436070) 5578208401 ns/iter (± 325642175) 0.98
es/base/parallel/hygiene/typescript 2250782137 ns/iter (± 19078476) 2189117707 ns/iter (± 29845054) 1.03
misc/visitors/time-complexity/time 5 93 ns/iter (± 0) 92 ns/iter (± 0) 1.01
misc/visitors/time-complexity/time 10 293 ns/iter (± 1) 301 ns/iter (± 2) 0.97
misc/visitors/time-complexity/time 15 601 ns/iter (± 1) 606 ns/iter (± 8) 0.99
misc/visitors/time-complexity/time 20 1124 ns/iter (± 2) 1121 ns/iter (± 3) 1.00
misc/visitors/time-complexity/time 40 6105 ns/iter (± 169) 6014 ns/iter (± 25) 1.02
misc/visitors/time-complexity/time 60 15181 ns/iter (± 33) 15135 ns/iter (± 24) 1.00
es/full-target/es2016 187140 ns/iter (± 650) 187552 ns/iter (± 558) 1.00
es/full-target/es2017 181752 ns/iter (± 427) 180666 ns/iter (± 512) 1.01
es/full-target/es2018 170564 ns/iter (± 569) 169760 ns/iter (± 257) 1.00
es2020_nullish_coalescing 65935 ns/iter (± 8158) 65624 ns/iter (± 153) 1.00
es2020_optional_chaining 95327 ns/iter (± 6415) 93928 ns/iter (± 284) 1.01
es2022_class_properties 92912 ns/iter (± 176) 91612 ns/iter (± 166) 1.01
es2018_object_rest_spread 71300 ns/iter (± 155) 70106 ns/iter (± 146) 1.02
es2019_optional_catch_binding 60593 ns/iter (± 93) 59827 ns/iter (± 144) 1.01
es2017_async_to_generator 60926 ns/iter (± 133) 60206 ns/iter (± 470) 1.01
es2016_exponentiation 64489 ns/iter (± 225) 63729 ns/iter (± 180) 1.01
es2015_arrow 69612 ns/iter (± 209) 68289 ns/iter (± 262) 1.02
es2015_block_scoped_fn 65431 ns/iter (± 210) 64745 ns/iter (± 108) 1.01
es2015_block_scoping 137730 ns/iter (± 9048) 141580 ns/iter (± 9842) 0.97
es2015_classes 116047 ns/iter (± 388) 114812 ns/iter (± 305) 1.01
es2015_computed_props 60156 ns/iter (± 139) 59948 ns/iter (± 377) 1.00
es2015_destructuring 115165 ns/iter (± 401) 114141 ns/iter (± 423) 1.01
es2015_duplicate_keys 63052 ns/iter (± 64) 62394 ns/iter (± 211) 1.01
es2015_parameters 78786 ns/iter (± 192) 77883 ns/iter (± 185) 1.01
es2015_fn_name 65941 ns/iter (± 445) 65424 ns/iter (± 594) 1.01
es2015_for_of 63350 ns/iter (± 171) 62732 ns/iter (± 157) 1.01
es2015_instanceof 62337 ns/iter (± 103) 61705 ns/iter (± 121) 1.01
es2015_shorthand_property 60315 ns/iter (± 203) 59989 ns/iter (± 175) 1.01
es2015_spread 60143 ns/iter (± 201) 59825 ns/iter (± 70) 1.01
es2015_sticky_regex 61378 ns/iter (± 98) 60984 ns/iter (± 139) 1.01
es2015_typeof_symbol 61694 ns/iter (± 231) 61099 ns/iter (± 118) 1.01
es/transform/baseline/base 51156 ns/iter (± 114) 50549 ns/iter (± 146) 1.01
es/transform/baseline/common_reserved_word 61806 ns/iter (± 154) 61300 ns/iter (± 122) 1.01
es/transform/baseline/common_typescript 143660 ns/iter (± 8027) 140775 ns/iter (± 365) 1.02
es/target/es3 169396 ns/iter (± 538) 167943 ns/iter (± 233) 1.01
es/target/es2015 629267 ns/iter (± 955) 630852 ns/iter (± 2500) 1.00
es/target/es2016 64204 ns/iter (± 177) 63897 ns/iter (± 200) 1.00
es/target/es2017 60911 ns/iter (± 135) 60552 ns/iter (± 81) 1.01
es/target/es2018 80993 ns/iter (± 310) 80215 ns/iter (± 107) 1.01
es/target/es2020 132001 ns/iter (± 221) 131147 ns/iter (± 229) 1.01
babelify-only 659800 ns/iter (± 1548) 673375 ns/iter (± 1206) 0.98
parse_and_babelify_angular 43855584 ns/iter (± 746964) 42107163 ns/iter (± 351321) 1.04
parse_and_babelify_backbone 5433238 ns/iter (± 73024) 5310943 ns/iter (± 19196) 1.02
parse_and_babelify_jquery 33612770 ns/iter (± 420612) 31858532 ns/iter (± 298888) 1.06
parse_and_babelify_jquery_mobile 57915026 ns/iter (± 1971139) 54823883 ns/iter (± 971743) 1.06
parse_and_babelify_mootools 35259234 ns/iter (± 629242) 32840200 ns/iter (± 282825) 1.07
parse_and_babelify_underscore 4360593 ns/iter (± 43712) 4279300 ns/iter (± 31925) 1.02
parse_and_babelify_yui 34670273 ns/iter (± 702765) 32333916 ns/iter (± 475548) 1.07
html/minify/document/css_spec 42411063 ns/iter (± 549039) 41802296 ns/iter (± 346392) 1.01
html/minify/document/github 17427703 ns/iter (± 163050) 17246167 ns/iter (± 99885) 1.01
html/minify/document/stackoverflow 15565424 ns/iter (± 40957) 15471075 ns/iter (± 45709) 1.01
html/minify/document_fragment/css_spec 40211651 ns/iter (± 602968) 39406352 ns/iter (± 149452) 1.02
html/minify/document_fragment/github 16623816 ns/iter (± 68755) 16564255 ns/iter (± 53754) 1.00
html/minify/document_fragment/stackoverflow 15024254 ns/iter (± 106062) 15147964 ns/iter (± 46139) 0.99
html/document/visitor/compare/clone 336975 ns/iter (± 2054) 340973 ns/iter (± 2591) 0.99
html/document/visitor/compare/visit_mut_span 363882 ns/iter (± 2499) 363314 ns/iter (± 2133) 1.00
html/document/visitor/compare/visit_mut_span_panic 379523 ns/iter (± 2101) 375073 ns/iter (± 1952) 1.01
html/document/visitor/compare/fold_span 407010 ns/iter (± 2656) 402141 ns/iter (± 2078) 1.01
html/document/visitor/compare/fold_span_panic 467155 ns/iter (± 2456) 458838 ns/iter (± 2238) 1.02
html/document_fragment/visitor/compare/clone 338822 ns/iter (± 1700) 338608 ns/iter (± 2601) 1.00
html/document_fragment/visitor/compare/visit_mut_span 363165 ns/iter (± 2021) 363116 ns/iter (± 1928) 1.00
html/document_fragment/visitor/compare/visit_mut_span_panic 369006 ns/iter (± 2211) 372329 ns/iter (± 1612) 0.99
html/document_fragment/visitor/compare/fold_span 400490 ns/iter (± 2198) 403842 ns/iter (± 2468) 0.99
html/document_fragment/visitor/compare/fold_span_panic 464116 ns/iter (± 1357) 461601 ns/iter (± 1570) 1.01
html/lexer/css_2021_spec 15658685 ns/iter (± 34112) 15579806 ns/iter (± 45269) 1.01
html/lexer/github_com_17_05_2022 6069639 ns/iter (± 24942) 6034506 ns/iter (± 12875) 1.01
html/lexer/stackoverflow_com_17_05_2022 5691382 ns/iter (± 9721) 5652919 ns/iter (± 8520) 1.01
html/parser/parser_document/css_2021_spec 25973672 ns/iter (± 385362) 25295451 ns/iter (± 65063) 1.03
html/parser/parser_document/github_com_17_05_2022 8742091 ns/iter (± 19242) 8737493 ns/iter (± 14010) 1.00
html/parser/parser_document/stackoverflow_com_17_05_2022 7701199 ns/iter (± 18278) 7698070 ns/iter (± 8214) 1.00
html/parser/parser_document_fragment/css_2021_spec 25942828 ns/iter (± 351304) 25355499 ns/iter (± 105616) 1.02
html/parser/parser_document_fragment/github_com_17_05_2022 8744842 ns/iter (± 19463) 8744979 ns/iter (± 43929) 1.00
html/parser/parser_document_fragment/stackoverflow_com_17_05_2022 7698011 ns/iter (± 23174) 7706177 ns/iter (± 56091) 1.00

This comment was automatically generated by workflow using github-action-benchmark.

Please sign in to comment.