Skip to content

Commit a14f6bc

Browse files
RobinMalfaitdepfu[bot]
RobinMalfait
authored and
depfu[bot]
committed
update tests to reflect Lightning CSS update
The main things I'm seeing right now are: 1. Some selectors are broken up into multiple selectors, especially when there are pseudo classes involved where the output is unknown. For example `::ng-deep, ::v-deep {}` will be split into `::ng-deep {}, ::v-deep {}` 2. It looks like a lot of selectors were dropped, however after looking at them in more detail I noticed that they were _duplicated_ before. This means that now the output will be smaller in these cases!
1 parent 91fb37c commit a14f6bc

File tree

4 files changed

+71
-161
lines changed

4 files changed

+71
-161
lines changed

‎tests/apply.test.js

Lines changed: 6 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2073,8 +2073,12 @@ test('::ng-deep, ::deep, ::v-deep pseudo elements are left alone', () => {
20732073

20742074
return run(input, config).then((result) => {
20752075
expect(result.css).toMatchFormattedCss(css`
2076-
::ng-deep .foo .bar,
2077-
::v-deep .foo .bar,
2076+
::ng-deep .foo .bar {
2077+
font-weight: 700;
2078+
}
2079+
::v-deep .foo .bar {
2080+
font-weight: 700;
2081+
}
20782082
::deep .foo .bar {
20792083
font-weight: 700;
20802084
}

‎tests/plugins/variants/hasVariants.test.js

Lines changed: 9 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -15,9 +15,15 @@ quickVariantPluginTest('hasVariants', {
1515
.has-\[\.foo\]\:flex:has(.foo) {
1616
display: flex;
1717
}
18-
.group\/foo:has(.bar) .group-has-\[\.bar\]\/foo\:flex,
19-
.group:has(.foo) .group-has-\[\.foo\]\:flex,
20-
.peer\/foo:has(.bar) ~ .peer-has-\[\.bar\]\/foo\:flex,
18+
.group\/foo:has(.bar) .group-has-\[\.bar\]\/foo\:flex {
19+
display: flex;
20+
}
21+
.group:has(.foo) .group-has-\[\.foo\]\:flex {
22+
display: flex;
23+
}
24+
.peer\/foo:has(.bar) ~ .peer-has-\[\.bar\]\/foo\:flex {
25+
display: flex;
26+
}
2127
.peer:has(.foo) ~ .peer-has-\[\.foo\]\:flex {
2228
display: flex;
2329
}

‎tests/plugins/variants/pseudoClassVariants.test.js

Lines changed: 28 additions & 73 deletions
Original file line numberDiff line numberDiff line change
@@ -57,75 +57,15 @@ quickVariantPluginTest('pseudoClassVariants').toMatchFormattedCss(css`
5757
.group:default .group-default\:flex,
5858
.group:checked .group-checked\:flex,
5959
.group:indeterminate .group-indeterminate\:flex,
60-
.group:placeholder-shown .group-placeholder-shown\:flex,
61-
.group:-webkit-autofill .group-autofill\:flex,
62-
.group:optional .group-optional\:flex,
63-
.group:required .group-required\:flex,
64-
.group:valid .group-valid\:flex,
65-
.group:invalid .group-invalid\:flex,
66-
.group:in-range .group-in-range\:flex,
67-
.group:out-of-range .group-out-of-range\:flex,
68-
.group:read-only .group-read-only\:flex,
69-
.group:empty .group-empty\:flex,
70-
.group:focus-within .group-focus-within\:flex,
71-
.group:hover .group-hover\:flex,
72-
.group:focus .group-focus\:flex,
73-
.group:focus-visible .group-focus-visible\:flex,
74-
.group:active .group-active\:flex,
75-
.group:enabled .group-enabled\:flex,
76-
.group:disabled .group-disabled\:flex,
77-
.peer:first-child ~ .peer-first\:flex,
78-
.peer:last-child ~ .peer-last\:flex,
79-
.peer:only-child ~ .peer-only\:flex,
80-
.peer:nth-child(odd) ~ .peer-odd\:flex,
81-
.peer:nth-child(2n) ~ .peer-even\:flex,
82-
.peer:first-of-type ~ .peer-first-of-type\:flex,
83-
.peer:last-of-type ~ .peer-last-of-type\:flex,
84-
.peer:only-of-type ~ .peer-only-of-type\:flex,
85-
.peer:visited ~ .peer-visited\:flex,
86-
.peer:target ~ .peer-target\:flex,
87-
.peer[open] ~ .peer-open\:flex,
88-
.peer:default ~ .peer-default\:flex,
89-
.peer:checked ~ .peer-checked\:flex,
90-
.peer:indeterminate ~ .peer-indeterminate\:flex,
91-
.peer:placeholder-shown ~ .peer-placeholder-shown\:flex,
92-
.peer:-webkit-autofill ~ .peer-autofill\:flex,
93-
.peer:optional ~ .peer-optional\:flex,
94-
.peer:required ~ .peer-required\:flex,
95-
.peer:valid ~ .peer-valid\:flex,
96-
.peer:invalid ~ .peer-invalid\:flex,
97-
.peer:in-range ~ .peer-in-range\:flex,
98-
.peer:out-of-range ~ .peer-out-of-range\:flex,
99-
.peer:read-only ~ .peer-read-only\:flex,
100-
.peer:empty ~ .peer-empty\:flex,
101-
.peer:focus-within ~ .peer-focus-within\:flex,
102-
.peer:hover ~ .peer-hover\:flex,
103-
.peer:focus ~ .peer-focus\:flex,
104-
.peer:focus-visible ~ .peer-focus-visible\:flex,
105-
.peer:active ~ .peer-active\:flex,
106-
.peer:enabled ~ .peer-enabled\:flex,
107-
.peer:disabled ~ .peer-disabled\:flex {
60+
.group:placeholder-shown .group-placeholder-shown\:flex {
61+
display: flex;
62+
}
63+
.group:-webkit-autofill .group-autofill\:flex {
64+
display: flex;
65+
}
66+
.group:autofill .group-autofill\:flex {
10867
display: flex;
10968
}
110-
.active\:flex:active,
111-
.enabled\:flex:enabled,
112-
.disabled\:flex:disabled,
113-
.group:first-child .group-first\:flex,
114-
.group:last-child .group-last\:flex,
115-
.group:only-child .group-only\:flex,
116-
.group:nth-child(odd) .group-odd\:flex,
117-
.group:nth-child(2n) .group-even\:flex,
118-
.group:first-of-type .group-first-of-type\:flex,
119-
.group:last-of-type .group-last-of-type\:flex,
120-
.group:only-of-type .group-only-of-type\:flex,
121-
.group:visited .group-visited\:flex,
122-
.group:target .group-target\:flex,
123-
.group[open] .group-open\:flex,
124-
.group:default .group-default\:flex,
125-
.group:checked .group-checked\:flex,
126-
.group:indeterminate .group-indeterminate\:flex,
127-
.group:placeholder-shown .group-placeholder-shown\:flex,
128-
.group:autofill .group-autofill\:flex,
12969
.group:optional .group-optional\:flex,
13070
.group:required .group-required\:flex,
13171
.group:valid .group-valid\:flex,
@@ -136,8 +76,12 @@ quickVariantPluginTest('pseudoClassVariants').toMatchFormattedCss(css`
13676
.group:empty .group-empty\:flex,
13777
.group:focus-within .group-focus-within\:flex,
13878
.group:hover .group-hover\:flex,
139-
.group:focus .group-focus\:flex,
140-
.group:focus-visible .group-focus-visible\:flex,
79+
.group:focus .group-focus\:flex {
80+
display: flex;
81+
}
82+
.group:focus-visible .group-focus-visible\:flex {
83+
display: flex;
84+
}
14185
.group:active .group-active\:flex,
14286
.group:enabled .group-enabled\:flex,
14387
.group:disabled .group-disabled\:flex,
@@ -155,8 +99,15 @@ quickVariantPluginTest('pseudoClassVariants').toMatchFormattedCss(css`
15599
.peer:default ~ .peer-default\:flex,
156100
.peer:checked ~ .peer-checked\:flex,
157101
.peer:indeterminate ~ .peer-indeterminate\:flex,
158-
.peer:placeholder-shown ~ .peer-placeholder-shown\:flex,
159-
.peer:autofill ~ .peer-autofill\:flex,
102+
.peer:placeholder-shown ~ .peer-placeholder-shown\:flex {
103+
display: flex;
104+
}
105+
.peer:-webkit-autofill ~ .peer-autofill\:flex {
106+
display: flex;
107+
}
108+
.peer:autofill ~ .peer-autofill\:flex {
109+
display: flex;
110+
}
160111
.peer:optional ~ .peer-optional\:flex,
161112
.peer:required ~ .peer-required\:flex,
162113
.peer:valid ~ .peer-valid\:flex,
@@ -167,8 +118,12 @@ quickVariantPluginTest('pseudoClassVariants').toMatchFormattedCss(css`
167118
.peer:empty ~ .peer-empty\:flex,
168119
.peer:focus-within ~ .peer-focus-within\:flex,
169120
.peer:hover ~ .peer-hover\:flex,
170-
.peer:focus ~ .peer-focus\:flex,
171-
.peer:focus-visible ~ .peer-focus-visible\:flex,
121+
.peer:focus ~ .peer-focus\:flex {
122+
display: flex;
123+
}
124+
.peer:focus-visible ~ .peer-focus-visible\:flex {
125+
display: flex;
126+
}
172127
.peer:active ~ .peer-active\:flex,
173128
.peer:enabled ~ .peer-enabled\:flex,
174129
.peer:disabled ~ .peer-disabled\:flex {

‎tests/variants.test.css

Lines changed: 28 additions & 83 deletions
Original file line numberDiff line numberDiff line change
@@ -245,85 +245,15 @@
245245
.group:default .group-default\:flex,
246246
.group:checked .group-checked\:flex,
247247
.group:indeterminate .group-indeterminate\:flex,
248-
.group:placeholder-shown .group-placeholder-shown\:flex,
249-
.group:-webkit-autofill .group-autofill\:flex,
250-
.group:optional .group-optional\:flex,
251-
.group:required .group-required\:flex,
252-
.group:valid .group-valid\:flex,
253-
.group:invalid .group-invalid\:flex,
254-
.group:in-range .group-in-range\:flex,
255-
.group:out-of-range .group-out-of-range\:flex,
256-
.group:read-only .group-read-only\:flex,
257-
.group:empty .group-empty\:flex,
258-
.group:focus-within .group-focus-within\:flex,
259-
.group:hover .group-hover\:flex,
260-
.group[open]:hover .group-open\:group-hover\:flex,
261-
.group:focus .group-focus\:flex,
262-
.group[open]:focus .group-open\:group-focus\:flex,
263-
.group:focus:hover .group-focus\:group-hover\:flex,
264-
.group:focus-visible .group-focus-visible\:flex,
265-
.group:active .group-active\:flex,
266-
.group:enabled .group-enabled\:flex,
267-
.group:disabled .group-disabled\:flex,
268-
.group:disabled:focus:hover .group-disabled\:group-focus\:group-hover\:flex,
269-
.group:disabled:focus:hover .group-disabled\:group-focus\:group-hover\:first\:flex:first-child,
270-
.peer:first-child ~ .peer-first\:flex,
271-
.peer:last-child ~ .peer-last\:flex,
272-
.peer:only-child ~ .peer-only\:flex,
273-
.peer:nth-child(odd) ~ .peer-odd\:flex,
274-
.peer:nth-child(2n) ~ .peer-even\:flex,
275-
.peer:first-of-type ~ .peer-first-of-type\:flex,
276-
.peer:last-of-type ~ .peer-last-of-type\:flex,
277-
.peer:only-of-type ~ .peer-only-of-type\:flex,
278-
.peer:visited ~ .peer-visited\:flex,
279-
.peer:target ~ .peer-target\:flex,
280-
.peer[open] ~ .peer-open\:flex,
281-
.peer:default ~ .peer-default\:flex,
282-
.peer:checked ~ .peer-checked\:flex,
283-
.peer:indeterminate ~ .peer-indeterminate\:flex,
284-
.peer:placeholder-shown ~ .peer-placeholder-shown\:flex,
285-
.peer:-webkit-autofill ~ .peer-autofill\:flex,
286-
.peer:optional ~ .peer-optional\:flex,
287-
.peer:required ~ .peer-required\:flex,
288-
.peer:valid ~ .peer-valid\:flex,
289-
.peer:invalid ~ .peer-invalid\:flex,
290-
.peer:in-range ~ .peer-in-range\:flex,
291-
.peer:out-of-range ~ .peer-out-of-range\:flex,
292-
.peer:read-only ~ .peer-read-only\:flex,
293-
.peer:empty ~ .peer-empty\:flex,
294-
.peer:focus-within ~ .peer-focus-within\:flex,
295-
.peer:hover ~ .peer-hover\:flex,
296-
.peer:focus ~ .peer-focus\:flex,
297-
.peer:focus:hover ~ .peer-focus\:peer-hover\:flex,
298-
.peer:focus-visible ~ .peer-focus-visible\:flex,
299-
.peer:active ~ .peer-active\:flex,
300-
.peer:enabled ~ .peer-enabled\:flex,
301-
.peer:disabled ~ .peer-disabled\:flex,
302-
.peer:disabled:focus:hover ~ .peer-disabled\:peer-focus\:peer-hover\:flex,
303-
.peer:disabled:focus:hover ~ .peer-disabled\:peer-focus\:peer-hover\:first\:flex:first-child,
304-
:-webkit-any([dir='ltr'] .ltr\:flex),
305-
:-webkit-any([dir='rtl'] .rtl\:flex) {
248+
.group:placeholder-shown .group-placeholder-shown\:flex {
249+
display: flex;
250+
}
251+
.group:-webkit-autofill .group-autofill\:flex {
252+
display: flex;
253+
}
254+
.group:autofill .group-autofill\:flex {
306255
display: flex;
307256
}
308-
.active\:flex:active,
309-
.enabled\:flex:enabled,
310-
.disabled\:flex:disabled,
311-
.group:first-child .group-first\:flex,
312-
.group:last-child .group-last\:flex,
313-
.group:only-child .group-only\:flex,
314-
.group:nth-child(odd) .group-odd\:flex,
315-
.group:nth-child(2n) .group-even\:flex,
316-
.group:first-of-type .group-first-of-type\:flex,
317-
.group:last-of-type .group-last-of-type\:flex,
318-
.group:only-of-type .group-only-of-type\:flex,
319-
.group:visited .group-visited\:flex,
320-
.group:target .group-target\:flex,
321-
.group[open] .group-open\:flex,
322-
.group:default .group-default\:flex,
323-
.group:checked .group-checked\:flex,
324-
.group:indeterminate .group-indeterminate\:flex,
325-
.group:placeholder-shown .group-placeholder-shown\:flex,
326-
.group:autofill .group-autofill\:flex,
327257
.group:optional .group-optional\:flex,
328258
.group:required .group-required\:flex,
329259
.group:valid .group-valid\:flex,
@@ -337,8 +267,12 @@
337267
.group[open]:hover .group-open\:group-hover\:flex,
338268
.group:focus .group-focus\:flex,
339269
.group[open]:focus .group-open\:group-focus\:flex,
340-
.group:focus:hover .group-focus\:group-hover\:flex,
341-
.group:focus-visible .group-focus-visible\:flex,
270+
.group:focus:hover .group-focus\:group-hover\:flex {
271+
display: flex;
272+
}
273+
.group:focus-visible .group-focus-visible\:flex {
274+
display: flex;
275+
}
342276
.group:active .group-active\:flex,
343277
.group:enabled .group-enabled\:flex,
344278
.group:disabled .group-disabled\:flex,
@@ -358,8 +292,15 @@
358292
.peer:default ~ .peer-default\:flex,
359293
.peer:checked ~ .peer-checked\:flex,
360294
.peer:indeterminate ~ .peer-indeterminate\:flex,
361-
.peer:placeholder-shown ~ .peer-placeholder-shown\:flex,
362-
.peer:autofill ~ .peer-autofill\:flex,
295+
.peer:placeholder-shown ~ .peer-placeholder-shown\:flex {
296+
display: flex;
297+
}
298+
.peer:-webkit-autofill ~ .peer-autofill\:flex {
299+
display: flex;
300+
}
301+
.peer:autofill ~ .peer-autofill\:flex {
302+
display: flex;
303+
}
363304
.peer:optional ~ .peer-optional\:flex,
364305
.peer:required ~ .peer-required\:flex,
365306
.peer:valid ~ .peer-valid\:flex,
@@ -371,8 +312,12 @@
371312
.peer:focus-within ~ .peer-focus-within\:flex,
372313
.peer:hover ~ .peer-hover\:flex,
373314
.peer:focus ~ .peer-focus\:flex,
374-
.peer:focus:hover ~ .peer-focus\:peer-hover\:flex,
375-
.peer:focus-visible ~ .peer-focus-visible\:flex,
315+
.peer:focus:hover ~ .peer-focus\:peer-hover\:flex {
316+
display: flex;
317+
}
318+
.peer:focus-visible ~ .peer-focus-visible\:flex {
319+
display: flex;
320+
}
376321
.peer:active ~ .peer-active\:flex,
377322
.peer:enabled ~ .peer-enabled\:flex,
378323
.peer:disabled ~ .peer-disabled\:flex,

0 commit comments

Comments
 (0)