Skip to content
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.

Commit d716c5e

Browse files
marekdedicmarekdedic
committedDec 14, 2024
test(selector-node-loc-fixing): added tests
1 parent 782fe60 commit d716c5e

File tree

9 files changed

+1016
-0
lines changed

9 files changed

+1016
-0
lines changed
 

‎tests/fixtures/parser/style-selector-location-converter/simple-css-input.svelte

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
<script>
2+
let a = 10
3+
</script>
4+
5+
<span class="myClass">Hello!</span>
6+
7+
<b>{a}</b>
8+
9+
<style>
10+
.myClass {
11+
color: red;
12+
}
13+
14+
b {
15+
font-size: xx-large;
16+
}
17+
18+
a:active,
19+
a::before,
20+
b + a,
21+
b + .myClass,
22+
a[data-key="value"] {
23+
color: blue;
24+
}
25+
</style>

‎tests/fixtures/parser/style-selector-location-converter/simple-css-output.json

Lines changed: 281 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,281 @@
1+
[
2+
[
3+
[
4+
"selector",
5+
{
6+
"start": {
7+
"line": 10,
8+
"column": 2
9+
},
10+
"end": {
11+
"line": 10,
12+
"column": 10
13+
}
14+
}
15+
],
16+
[
17+
"class",
18+
{
19+
"start": {
20+
"line": 10,
21+
"column": 2
22+
},
23+
"end": {
24+
"line": 10,
25+
"column": 10
26+
}
27+
}
28+
]
29+
],
30+
[
31+
[
32+
"selector",
33+
{
34+
"start": {
35+
"line": 14,
36+
"column": 2
37+
},
38+
"end": {
39+
"line": 14,
40+
"column": 3
41+
}
42+
}
43+
],
44+
[
45+
"tag",
46+
{
47+
"start": {
48+
"line": 14,
49+
"column": 2
50+
},
51+
"end": {
52+
"line": 14,
53+
"column": 3
54+
}
55+
}
56+
]
57+
],
58+
[
59+
[
60+
"selector",
61+
{
62+
"start": {
63+
"line": 18,
64+
"column": 2
65+
},
66+
"end": {
67+
"line": 18,
68+
"column": 10
69+
}
70+
}
71+
],
72+
[
73+
"tag",
74+
{
75+
"start": {
76+
"line": 18,
77+
"column": 2
78+
},
79+
"end": {
80+
"line": 18,
81+
"column": 3
82+
}
83+
}
84+
],
85+
[
86+
"pseudo",
87+
{
88+
"start": {
89+
"line": 18,
90+
"column": 3
91+
},
92+
"end": {
93+
"line": 18,
94+
"column": 10
95+
}
96+
}
97+
],
98+
[
99+
"selector",
100+
{
101+
"start": {
102+
"line": 19,
103+
"column": -1
104+
},
105+
"end": {
106+
"line": 19,
107+
"column": 11
108+
}
109+
}
110+
],
111+
[
112+
"tag",
113+
{
114+
"start": {
115+
"line": 19,
116+
"column": 2
117+
},
118+
"end": {
119+
"line": 19,
120+
"column": 3
121+
}
122+
}
123+
],
124+
[
125+
"pseudo",
126+
{
127+
"start": {
128+
"line": 19,
129+
"column": 3
130+
},
131+
"end": {
132+
"line": 19,
133+
"column": 11
134+
}
135+
}
136+
],
137+
[
138+
"selector",
139+
{
140+
"start": {
141+
"line": 20,
142+
"column": -1
143+
},
144+
"end": {
145+
"line": 20,
146+
"column": 7
147+
}
148+
}
149+
],
150+
[
151+
"tag",
152+
{
153+
"start": {
154+
"line": 20,
155+
"column": 2
156+
},
157+
"end": {
158+
"line": 20,
159+
"column": 3
160+
}
161+
}
162+
],
163+
[
164+
"combinator",
165+
{
166+
"start": {
167+
"line": 20,
168+
"column": 4
169+
},
170+
"end": {
171+
"line": 20,
172+
"column": 5
173+
}
174+
}
175+
],
176+
[
177+
"tag",
178+
{
179+
"start": {
180+
"line": 20,
181+
"column": 6
182+
},
183+
"end": {
184+
"line": 20,
185+
"column": 7
186+
}
187+
}
188+
],
189+
[
190+
"selector",
191+
{
192+
"start": {
193+
"line": 21,
194+
"column": -1
195+
},
196+
"end": {
197+
"line": 21,
198+
"column": 14
199+
}
200+
}
201+
],
202+
[
203+
"tag",
204+
{
205+
"start": {
206+
"line": 21,
207+
"column": 2
208+
},
209+
"end": {
210+
"line": 21,
211+
"column": 3
212+
}
213+
}
214+
],
215+
[
216+
"combinator",
217+
{
218+
"start": {
219+
"line": 21,
220+
"column": 4
221+
},
222+
"end": {
223+
"line": 21,
224+
"column": 5
225+
}
226+
}
227+
],
228+
[
229+
"class",
230+
{
231+
"start": {
232+
"line": 21,
233+
"column": 6
234+
},
235+
"end": {
236+
"line": 21,
237+
"column": 14
238+
}
239+
}
240+
],
241+
[
242+
"selector",
243+
{
244+
"start": {
245+
"line": 22,
246+
"column": -1
247+
},
248+
"end": {
249+
"line": 22,
250+
"column": 21
251+
}
252+
}
253+
],
254+
[
255+
"tag",
256+
{
257+
"start": {
258+
"line": 22,
259+
"column": 2
260+
},
261+
"end": {
262+
"line": 22,
263+
"column": 3
264+
}
265+
}
266+
],
267+
[
268+
"attribute",
269+
{
270+
"start": {
271+
"line": 22,
272+
"column": 3
273+
},
274+
"end": {
275+
"line": 22,
276+
"column": 21
277+
}
278+
}
279+
]
280+
]
281+
]

‎tests/fixtures/parser/style-selector-location-converter/simple-postcss-input.svelte

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
<div class="container">
2+
<div class="div-class">Hello</div>
3+
4+
<span class="span-class">World!</span>
5+
</div>
6+
7+
<style lang="postcss">
8+
body {
9+
colour: white;
10+
background-colour: grey;
11+
}
12+
13+
a:active,
14+
a::before,
15+
b + a,
16+
b + .myClass,
17+
a[data-key="value"] {
18+
color: blue;
19+
}
20+
</style>

‎tests/fixtures/parser/style-selector-location-converter/simple-postcss-output.json

Lines changed: 253 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,253 @@
1+
[
2+
[
3+
[
4+
"selector",
5+
{
6+
"start": {
7+
"line": 8,
8+
"column": 2
9+
},
10+
"end": {
11+
"line": 8,
12+
"column": 6
13+
}
14+
}
15+
],
16+
[
17+
"tag",
18+
{
19+
"start": {
20+
"line": 8,
21+
"column": 2
22+
},
23+
"end": {
24+
"line": 8,
25+
"column": 6
26+
}
27+
}
28+
]
29+
],
30+
[
31+
[
32+
"selector",
33+
{
34+
"start": {
35+
"line": 13,
36+
"column": 2
37+
},
38+
"end": {
39+
"line": 13,
40+
"column": 10
41+
}
42+
}
43+
],
44+
[
45+
"tag",
46+
{
47+
"start": {
48+
"line": 13,
49+
"column": 2
50+
},
51+
"end": {
52+
"line": 13,
53+
"column": 3
54+
}
55+
}
56+
],
57+
[
58+
"pseudo",
59+
{
60+
"start": {
61+
"line": 13,
62+
"column": 3
63+
},
64+
"end": {
65+
"line": 13,
66+
"column": 10
67+
}
68+
}
69+
],
70+
[
71+
"selector",
72+
{
73+
"start": {
74+
"line": 14,
75+
"column": -1
76+
},
77+
"end": {
78+
"line": 14,
79+
"column": 11
80+
}
81+
}
82+
],
83+
[
84+
"tag",
85+
{
86+
"start": {
87+
"line": 14,
88+
"column": 2
89+
},
90+
"end": {
91+
"line": 14,
92+
"column": 3
93+
}
94+
}
95+
],
96+
[
97+
"pseudo",
98+
{
99+
"start": {
100+
"line": 14,
101+
"column": 3
102+
},
103+
"end": {
104+
"line": 14,
105+
"column": 11
106+
}
107+
}
108+
],
109+
[
110+
"selector",
111+
{
112+
"start": {
113+
"line": 15,
114+
"column": -1
115+
},
116+
"end": {
117+
"line": 15,
118+
"column": 7
119+
}
120+
}
121+
],
122+
[
123+
"tag",
124+
{
125+
"start": {
126+
"line": 15,
127+
"column": 2
128+
},
129+
"end": {
130+
"line": 15,
131+
"column": 3
132+
}
133+
}
134+
],
135+
[
136+
"combinator",
137+
{
138+
"start": {
139+
"line": 15,
140+
"column": 4
141+
},
142+
"end": {
143+
"line": 15,
144+
"column": 5
145+
}
146+
}
147+
],
148+
[
149+
"tag",
150+
{
151+
"start": {
152+
"line": 15,
153+
"column": 6
154+
},
155+
"end": {
156+
"line": 15,
157+
"column": 7
158+
}
159+
}
160+
],
161+
[
162+
"selector",
163+
{
164+
"start": {
165+
"line": 16,
166+
"column": -1
167+
},
168+
"end": {
169+
"line": 16,
170+
"column": 14
171+
}
172+
}
173+
],
174+
[
175+
"tag",
176+
{
177+
"start": {
178+
"line": 16,
179+
"column": 2
180+
},
181+
"end": {
182+
"line": 16,
183+
"column": 3
184+
}
185+
}
186+
],
187+
[
188+
"combinator",
189+
{
190+
"start": {
191+
"line": 16,
192+
"column": 4
193+
},
194+
"end": {
195+
"line": 16,
196+
"column": 5
197+
}
198+
}
199+
],
200+
[
201+
"class",
202+
{
203+
"start": {
204+
"line": 16,
205+
"column": 6
206+
},
207+
"end": {
208+
"line": 16,
209+
"column": 14
210+
}
211+
}
212+
],
213+
[
214+
"selector",
215+
{
216+
"start": {
217+
"line": 17,
218+
"column": -1
219+
},
220+
"end": {
221+
"line": 17,
222+
"column": 21
223+
}
224+
}
225+
],
226+
[
227+
"tag",
228+
{
229+
"start": {
230+
"line": 17,
231+
"column": 2
232+
},
233+
"end": {
234+
"line": 17,
235+
"column": 3
236+
}
237+
}
238+
],
239+
[
240+
"attribute",
241+
{
242+
"start": {
243+
"line": 17,
244+
"column": 3
245+
},
246+
"end": {
247+
"line": 17,
248+
"column": 21
249+
}
250+
}
251+
]
252+
]
253+
]

‎tests/fixtures/parser/style-selector-location-converter/simple-scss-input.svelte

Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
<div class="container">
2+
<div class="div-class">Hello</div>
3+
4+
<span class="span-class">World!</span>
5+
</div>
6+
7+
<style lang="scss">
8+
.container {
9+
.div-class {
10+
// This is an inline comment
11+
color: red;
12+
}
13+
14+
.span-class {
15+
font-weight: bold;
16+
}
17+
18+
a:active,
19+
a::before,
20+
b + a,
21+
b + .myClass,
22+
a[data-key="value"] {
23+
color: blue;
24+
}
25+
}
26+
</style>

‎tests/fixtures/parser/style-selector-location-converter/simple-scss-output.json

Lines changed: 309 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,309 @@
1+
[
2+
[
3+
[
4+
"selector",
5+
{
6+
"start": {
7+
"line": 8,
8+
"column": 2
9+
},
10+
"end": {
11+
"line": 8,
12+
"column": 12
13+
}
14+
}
15+
],
16+
[
17+
"class",
18+
{
19+
"start": {
20+
"line": 8,
21+
"column": 2
22+
},
23+
"end": {
24+
"line": 8,
25+
"column": 12
26+
}
27+
}
28+
]
29+
],
30+
[
31+
[
32+
"selector",
33+
{
34+
"start": {
35+
"line": 9,
36+
"column": 4
37+
},
38+
"end": {
39+
"line": 9,
40+
"column": 14
41+
}
42+
}
43+
],
44+
[
45+
"class",
46+
{
47+
"start": {
48+
"line": 9,
49+
"column": 4
50+
},
51+
"end": {
52+
"line": 9,
53+
"column": 14
54+
}
55+
}
56+
]
57+
],
58+
[
59+
[
60+
"selector",
61+
{
62+
"start": {
63+
"line": 14,
64+
"column": 4
65+
},
66+
"end": {
67+
"line": 14,
68+
"column": 15
69+
}
70+
}
71+
],
72+
[
73+
"class",
74+
{
75+
"start": {
76+
"line": 14,
77+
"column": 4
78+
},
79+
"end": {
80+
"line": 14,
81+
"column": 15
82+
}
83+
}
84+
]
85+
],
86+
[
87+
[
88+
"selector",
89+
{
90+
"start": {
91+
"line": 18,
92+
"column": 4
93+
},
94+
"end": {
95+
"line": 18,
96+
"column": 12
97+
}
98+
}
99+
],
100+
[
101+
"tag",
102+
{
103+
"start": {
104+
"line": 18,
105+
"column": 4
106+
},
107+
"end": {
108+
"line": 18,
109+
"column": 5
110+
}
111+
}
112+
],
113+
[
114+
"pseudo",
115+
{
116+
"start": {
117+
"line": 18,
118+
"column": 5
119+
},
120+
"end": {
121+
"line": 18,
122+
"column": 12
123+
}
124+
}
125+
],
126+
[
127+
"selector",
128+
{
129+
"start": {
130+
"line": 19,
131+
"column": -1
132+
},
133+
"end": {
134+
"line": 19,
135+
"column": 13
136+
}
137+
}
138+
],
139+
[
140+
"tag",
141+
{
142+
"start": {
143+
"line": 19,
144+
"column": 4
145+
},
146+
"end": {
147+
"line": 19,
148+
"column": 5
149+
}
150+
}
151+
],
152+
[
153+
"pseudo",
154+
{
155+
"start": {
156+
"line": 19,
157+
"column": 5
158+
},
159+
"end": {
160+
"line": 19,
161+
"column": 13
162+
}
163+
}
164+
],
165+
[
166+
"selector",
167+
{
168+
"start": {
169+
"line": 20,
170+
"column": -1
171+
},
172+
"end": {
173+
"line": 20,
174+
"column": 9
175+
}
176+
}
177+
],
178+
[
179+
"tag",
180+
{
181+
"start": {
182+
"line": 20,
183+
"column": 4
184+
},
185+
"end": {
186+
"line": 20,
187+
"column": 5
188+
}
189+
}
190+
],
191+
[
192+
"combinator",
193+
{
194+
"start": {
195+
"line": 20,
196+
"column": 6
197+
},
198+
"end": {
199+
"line": 20,
200+
"column": 7
201+
}
202+
}
203+
],
204+
[
205+
"tag",
206+
{
207+
"start": {
208+
"line": 20,
209+
"column": 8
210+
},
211+
"end": {
212+
"line": 20,
213+
"column": 9
214+
}
215+
}
216+
],
217+
[
218+
"selector",
219+
{
220+
"start": {
221+
"line": 21,
222+
"column": -1
223+
},
224+
"end": {
225+
"line": 21,
226+
"column": 16
227+
}
228+
}
229+
],
230+
[
231+
"tag",
232+
{
233+
"start": {
234+
"line": 21,
235+
"column": 4
236+
},
237+
"end": {
238+
"line": 21,
239+
"column": 5
240+
}
241+
}
242+
],
243+
[
244+
"combinator",
245+
{
246+
"start": {
247+
"line": 21,
248+
"column": 6
249+
},
250+
"end": {
251+
"line": 21,
252+
"column": 7
253+
}
254+
}
255+
],
256+
[
257+
"class",
258+
{
259+
"start": {
260+
"line": 21,
261+
"column": 8
262+
},
263+
"end": {
264+
"line": 21,
265+
"column": 16
266+
}
267+
}
268+
],
269+
[
270+
"selector",
271+
{
272+
"start": {
273+
"line": 22,
274+
"column": -1
275+
},
276+
"end": {
277+
"line": 22,
278+
"column": 23
279+
}
280+
}
281+
],
282+
[
283+
"tag",
284+
{
285+
"start": {
286+
"line": 22,
287+
"column": 4
288+
},
289+
"end": {
290+
"line": 22,
291+
"column": 5
292+
}
293+
}
294+
],
295+
[
296+
"attribute",
297+
{
298+
"start": {
299+
"line": 22,
300+
"column": 5
301+
},
302+
"end": {
303+
"line": 22,
304+
"column": 23
305+
}
306+
}
307+
]
308+
]
309+
]

‎tests/src/parser/style-selector-location-converter-utils.ts

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
import type { AnyNode, Root } from "postcss";
2+
import type { Node as SelectorNode } from "postcss-selector-parser";
3+
4+
import type { SourceLocation } from "../../../src/ast/common.js";
5+
6+
export function extractSelectorLocations(
7+
services: Record<string, any>,
8+
styleAST: Root,
9+
): [string, Partial<SourceLocation>][][] {
10+
const locations: [string, Partial<SourceLocation>][][] = [];
11+
styleAST.walk((node: AnyNode) => {
12+
if (node.type === "rule") {
13+
const selectorAst = services.getStyleSelectorAST(node);
14+
const selectorLocations: [string, Partial<SourceLocation>][] = [];
15+
selectorAst.walk((selectorNode: SelectorNode) => {
16+
selectorLocations.push([
17+
selectorNode.type,
18+
services.styleSelectorNodeLoc(selectorNode, node),
19+
]);
20+
});
21+
locations.push(selectorLocations);
22+
}
23+
});
24+
return locations;
25+
}

‎tests/src/parser/style-selector-location-converter.ts

Lines changed: 49 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,49 @@
1+
import assert from "assert";
2+
import fs from "fs";
3+
import path from "path";
4+
5+
import { parseForESLint } from "../../../src/index.js";
6+
import { extractSelectorLocations } from "./style-selector-location-converter-utils.js";
7+
import { generateParserOptions, listupFixtures } from "./test-utils.js";
8+
9+
const dirname = path.dirname(new URL(import.meta.url).pathname);
10+
const SELECTOR_CONVERTER_FIXTURE_ROOT = path.resolve(
11+
dirname,
12+
"../../fixtures/parser/style-selector-location-converter",
13+
);
14+
15+
function parse(code: string, filePath: string, config: any) {
16+
return parseForESLint(code, generateParserOptions({ filePath }, config));
17+
}
18+
19+
describe("Check for AST.", () => {
20+
for (const {
21+
input,
22+
inputFileName,
23+
outputFileName,
24+
config,
25+
meetRequirements,
26+
} of listupFixtures(SELECTOR_CONVERTER_FIXTURE_ROOT)) {
27+
describe(inputFileName, () => {
28+
let services: any;
29+
30+
it("most to generate the expected style context.", () => {
31+
services = parse(input, inputFileName, config).services;
32+
if (!meetRequirements("test")) {
33+
return;
34+
}
35+
const styleContext = services.getStyleContext();
36+
assert.strictEqual(styleContext.status, "success");
37+
const locations = extractSelectorLocations(
38+
services,
39+
styleContext.sourceAst,
40+
);
41+
const output = fs.readFileSync(outputFileName, "utf8");
42+
assert.strictEqual(
43+
`${JSON.stringify(locations, undefined, 2)}\n`,
44+
output,
45+
);
46+
});
47+
});
48+
}
49+
});

‎tools/update-fixtures.ts

Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -15,6 +15,7 @@ import {
1515
selectorAstToJson,
1616
styleContextToJson,
1717
} from "../tests/src/parser/test-utils.js";
18+
import { extractSelectorLocations } from "../tests/src/parser/style-selector-location-converter-utils.js";
1819
import type ts from "typescript";
1920
import type ESTree from "estree";
2021
import globals from "globals";
@@ -38,6 +39,10 @@ const SELECTOR_PARSING_FIXTURE_ROOT = path.resolve(
3839
dirname,
3940
"../tests/fixtures/parser/selector-parsing",
4041
);
42+
const SELECTOR_CONVERTER_FIXTURE_ROOT = path.resolve(
43+
dirname,
44+
"../tests/fixtures/parser/style-selector-location-converter",
45+
);
4146

4247
const RULES = [
4348
"no-unused-labels",
@@ -232,6 +237,29 @@ for (const {
232237
);
233238
}
234239

240+
for (const {
241+
input,
242+
inputFileName,
243+
outputFileName,
244+
config,
245+
meetRequirements,
246+
} of listupFixtures(SELECTOR_CONVERTER_FIXTURE_ROOT)) {
247+
if (!meetRequirements("parse")) {
248+
continue;
249+
}
250+
const services = parse(input, inputFileName, config).services;
251+
const styleContext = services.getStyleContext();
252+
if (styleContext.status !== "success") {
253+
continue;
254+
}
255+
const locations = extractSelectorLocations(services, styleContext.sourceAst);
256+
fs.writeFileSync(
257+
outputFileName,
258+
`${JSON.stringify(locations, undefined, 2)}\n`,
259+
"utf8",
260+
);
261+
}
262+
235263
function buildTypes(
236264
input: string,
237265
result: {

0 commit comments

Comments
 (0)
Please sign in to comment.