Skip to content

Commit dfaa2dc

Browse files
committed
feat: more
1 parent f72a71e commit dfaa2dc

File tree

90 files changed

+28570
-2
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

90 files changed

+28570
-2
lines changed

.cursor/rules/run-tests.mdc

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,4 +3,6 @@ description:
33
globs:
44
alwaysApply: true
55
---
6-
Tests can be run directly using `bunx vitest run`.
6+
Tests can be run directly using `bunx vitest run`.
7+
8+
It's not required, but I also recommend using the bail option to limit how many tests can fail: `bunx vitest --bail 50 run`
Lines changed: 265 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,265 @@
1+
/* AUTO_GENERATED: true */
2+
3+
/*
4+
feature: properties.align-content.flex_context
5+
docs: https://developer.mozilla.org/docs/Web/CSS/align-content
6+
spec: https://drafts.csswg.org/css-align/#align-justify-content
7+
*/
8+
9+
import { testRule } from 'lib/testRule';
10+
11+
/**
12+
* Tests basic usage of `align-content` with `center` in a flex container (`display: flex`). Catches simple declarations of the property in the intended context.
13+
*/
14+
testRule({
15+
featureId: 'properties.align-content.flex_context',
16+
description: 'unprefixed align-content in flex container',
17+
code: `
18+
.foo {
19+
display: flex;
20+
align-content: center;
21+
}
22+
`,
23+
featureCount: { '-webkit-': 0, '-moz-': 0, '-ms-': 0, '-o-': 0, unprefixed: 1 },
24+
});
25+
26+
/**
27+
* Tests usage of `-webkit-align-content` within a `-webkit-flex` container. Ensures vendor-prefixed properties are caught correctly in their respective prefixed contexts.
28+
*/
29+
testRule({
30+
featureId: 'properties.align-content.flex_context',
31+
description: 'vendor-prefixed align-content in -webkit-flex container',
32+
code: `
33+
.foo {
34+
display: -webkit-flex;
35+
-webkit-align-content: stretch;
36+
}
37+
`,
38+
featureCount: { '-webkit-': 1, '-moz-': 0, '-ms-': 0, '-o-': 0, unprefixed: 0 },
39+
});
40+
41+
/**
42+
* Tests usage of `-moz-align-content` within an unprefixed `flex` container. Confirms detection of prefixed properties even if the display is unprefixed.
43+
*/
44+
testRule({
45+
featureId: 'properties.align-content.flex_context',
46+
description: 'vendor-prefixed align-content in unprefixed flex container (-moz-)',
47+
code: `
48+
.foo {
49+
display: flex;
50+
-moz-align-content: space-between;
51+
}
52+
`,
53+
featureCount: { '-webkit-': 0, '-moz-': 1, '-ms-': 0, '-o-': 0, unprefixed: 0 },
54+
});
55+
56+
/**
57+
* Tests `align-content` used with the `initial` CSS-wide keyword in a flex context. Ensures CSS-wide keywords trigger detection for the property in general.
58+
*/
59+
testRule({
60+
featureId: 'properties.align-content.flex_context',
61+
description: 'align-content with CSS-wide keyword initial',
62+
code: `
63+
.foo {
64+
display: flex;
65+
align-content: initial;
66+
}
67+
`,
68+
featureCount: { '-webkit-': 0, '-moz-': 0, '-ms-': 0, '-o-': 0, unprefixed: 1 },
69+
});
70+
71+
/**
72+
* Tests `align-content` used with a CSS variable (`var()`). Since the feature is for the property in general in this context, it should be flagged.
73+
*/
74+
testRule({
75+
featureId: 'properties.align-content.flex_context',
76+
description: 'align-content with CSS variable',
77+
code: `
78+
.foo {
79+
display: flex;
80+
align-content: var(--my-align);
81+
}
82+
`,
83+
featureCount: { '-webkit-': 0, '-moz-': 0, '-ms-': 0, '-o-': 0, unprefixed: 1 },
84+
});
85+
86+
/**
87+
* Tests `align-content` within a pseudo-class (`:hover`) on the same flex element. Confirms that pseudo-classes retain the parent's context for detection.
88+
*/
89+
testRule({
90+
featureId: 'properties.align-content.flex_context',
91+
description: 'align-content within pseudo-class in flex context',
92+
code: `
93+
.foo {
94+
display: flex;
95+
&:hover {
96+
align-content: end;
97+
}
98+
}
99+
`,
100+
featureCount: { '-webkit-': 0, '-moz-': 0, '-ms-': 0, '-o-': 0, unprefixed: 1 },
101+
});
102+
103+
/**
104+
* Tests `align-content` in a flex container even when `flex-wrap` is `nowrap`. The property is still parsed and present in a flex context, thus should be detected despite its functional 'no effect'.
105+
*/
106+
testRule({
107+
featureId: 'properties.align-content.flex_context',
108+
description: 'align-content in flex container with flex-wrap: nowrap',
109+
code: `
110+
.foo {
111+
display: flex;
112+
flex-wrap: nowrap;
113+
align-content: space-around;
114+
}
115+
`,
116+
featureCount: { '-webkit-': 0, '-moz-': 0, '-ms-': 0, '-o-': 0, unprefixed: 1 },
117+
});
118+
119+
/**
120+
* Ensures that multiple independent declarations of `align-content` in flex contexts are all detected, resulting in two warnings.
121+
*/
122+
testRule({
123+
featureId: 'properties.align-content.flex_context',
124+
description: 'multiple align-content usages in different flex rules (2 warnings)',
125+
code: `
126+
.foo {
127+
display: flex;
128+
align-content: center;
129+
}
130+
.bar {
131+
display: flex;
132+
align-content: start;
133+
}
134+
`,
135+
featureCount: { '-webkit-': 0, '-moz-': 0, '-ms-': 0, '-o-': 0, unprefixed: 2 },
136+
});
137+
138+
/**
139+
* Tests `align-content` is detected when the `@supports` query checks a different property (`display: flex`), as it doesn't guard this specific feature.
140+
*/
141+
testRule({
142+
featureId: 'properties.align-content.flex_context',
143+
description: 'align-content unguarded by @supports (different property)',
144+
code: `
145+
@supports (display: flex) {
146+
.foo {
147+
display: flex;
148+
align-content: stretch;
149+
}
150+
}
151+
`,
152+
featureCount: { '-webkit-': 0, '-moz-': 0, '-ms-': 0, '-o-': 0, unprefixed: 1 },
153+
});
154+
155+
/**
156+
* Tests `align-content` is detected when the `@supports` query checks the same property but a different value (`align-content: start`), as it doesn't provide an exact guard.
157+
*/
158+
testRule({
159+
featureId: 'properties.align-content.flex_context',
160+
description: 'align-content unguarded by @supports (different value)',
161+
code: `
162+
@supports (align-content: start) {
163+
.foo {
164+
display: flex;
165+
align-content: stretch;
166+
}
167+
}
168+
`,
169+
featureCount: { '-webkit-': 0, '-moz-': 0, '-ms-': 0, '-o-': 0, unprefixed: 1 },
170+
});
171+
172+
/**
173+
* Ensures `align-content` is not detected when its `display` is explicitly set to `block`, as the feature is specific to flex contexts.
174+
*/
175+
testRule({
176+
featureId: 'properties.align-content.flex_context',
177+
description: 'align-content in explicitly block context',
178+
code: `
179+
.foo {
180+
display: block;
181+
align-content: center;
182+
}
183+
`,
184+
featureCount: { '-webkit-': 0, '-moz-': 0, '-ms-': 0, '-o-': 0, unprefixed: 0 },
185+
});
186+
187+
/**
188+
* Ensures `align-content` is not detected when its `display` is `grid`, as the feature is specific to flex contexts.
189+
*/
190+
testRule({
191+
featureId: 'properties.align-content.flex_context',
192+
description: 'align-content in grid context',
193+
code: `
194+
.foo {
195+
display: grid;
196+
align-content: center;
197+
}
198+
`,
199+
featureCount: { '-webkit-': 0, '-moz-': 0, '-ms-': 0, '-o-': 0, unprefixed: 0 },
200+
});
201+
202+
/**
203+
* Ensures `align-content` is not detected when no `display` property is present to establish a flex context in the same rule.
204+
*/
205+
testRule({
206+
featureId: 'properties.align-content.flex_context',
207+
description: 'align-content without explicit display context',
208+
code: `
209+
.foo {
210+
align-content: center;
211+
}
212+
`,
213+
featureCount: { '-webkit-': 0, '-moz-': 0, '-ms-': 0, '-o-': 0, unprefixed: 0 },
214+
});
215+
216+
/**
217+
* Verifies that `align-content` is correctly guarded and not detected when an exact `@supports` query is present.
218+
*/
219+
testRule({
220+
featureId: 'properties.align-content.flex_context',
221+
description: 'align-content correctly guarded by @supports',
222+
code: `
223+
@supports (align-content: center) {
224+
.foo {
225+
display: flex;
226+
align-content: center;
227+
}
228+
}
229+
`,
230+
featureCount: { '-webkit-': 0, '-moz-': 0, '-ms-': 0, '-o-': 0, unprefixed: 0 },
231+
});
232+
233+
/**
234+
* Ensures `align-content` is not detected in a pseudo-element (`::before`), as it does not inherit the parent's flex context for detection.
235+
*/
236+
testRule({
237+
featureId: 'properties.align-content.flex_context',
238+
description: 'align-content in pseudo-element context',
239+
code: `
240+
.foo {
241+
display: flex;
242+
&::before {
243+
align-content: center;
244+
}
245+
}
246+
`,
247+
featureCount: { '-webkit-': 0, '-moz-': 0, '-ms-': 0, '-o-': 0, unprefixed: 0 },
248+
});
249+
250+
/**
251+
* Ensures `align-content` is not detected when applied to a child selector (`.bar`), as it does not inherit the parent's flex context for detection.
252+
*/
253+
testRule({
254+
featureId: 'properties.align-content.flex_context',
255+
description: 'align-content in child selector context',
256+
code: `
257+
.foo {
258+
display: flex;
259+
& .bar {
260+
align-content: center;
261+
}
262+
}
263+
`,
264+
featureCount: { '-webkit-': 0, '-moz-': 0, '-ms-': 0, '-o-': 0, unprefixed: 0 },
265+
});

0 commit comments

Comments
 (0)