Skip to content

Commit 9d7a3ae

Browse files
committed
Fix test for new classCache format
1 parent 0f9f0a5 commit 9d7a3ae

File tree

3 files changed

+65
-36
lines changed

3 files changed

+65
-36
lines changed

test/scope.spec.js

Lines changed: 14 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
import createTokenizer from "../src/tokenizer";
22
import { getProxiedObject } from "../src/helper";
33
import { parse } from "svelte/compiler";
4+
import path from "path";
45

56
describe("when processing multiple components", function () {
67
const classCache = getProxiedObject();
@@ -23,27 +24,30 @@ describe("when processing multiple components", function () {
2324
<p class="foo"></p>`;
2425

2526
const codes = [
26-
[componentA, "filenameA"],
27-
[componentB, "filenameB"],
27+
[componentA, "/src/filenameA"],
28+
[componentB, "/src/filenameB"],
2829
];
2930

3031
const tokenizer = createTokenizer(classCache, declarationCache);
3132

3233
for (const [code, filename] of codes) {
3334
const ast = parse(code, { filename });
34-
tokenizer.generateToken(ast.css, filename);
35+
const parsedPath = path.parse(filename);
36+
tokenizer.generateToken(ast.css, parsedPath);
3537
}
3638

3739
it("should hashing classes of each component with filename in cache", async () => {
3840
expect(classCache).toEqual(
3941
expect.objectContaining({
40-
filenameA: {
41-
// color:green; is now represented by class a
42-
foo: { a: true },
43-
},
44-
filenameB: {
45-
// font-size:20px; is now represented by class b
46-
foo: { b: true },
42+
"/src": {
43+
filenameA: {
44+
// color:green; is now represented by class a
45+
foo: { a: true },
46+
},
47+
filenameB: {
48+
// font-size:20px; is now represented by class b
49+
foo: { b: true },
50+
},
4751
},
4852
})
4953
);

test/tokenizer.spec.js

Lines changed: 43 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
import createTokenizer from "../src/tokenizer";
22
import { getProxiedObject } from "../src/helper";
33
import { parse } from "svelte/compiler";
4+
import path from "path";
45

56
describe("when given multiple rules with identical declaration", function () {
67
const code = `
@@ -14,19 +15,22 @@ describe("when given multiple rules with identical declaration", function () {
1415
}
1516
</style>`;
1617

17-
const filename = "index.svelte";
18+
const filename = "/src/index.svelte";
1819

1920
const classCache = getProxiedObject();
2021
const declarationCache = getProxiedObject();
2122

2223
const tokenizer = createTokenizer(classCache, declarationCache);
2324
const ast = parse(code, { filename });
24-
tokenizer.generateToken(ast.css, filename);
25+
const parsedPath = path.parse(filename);
26+
tokenizer.generateToken(ast.css, parsedPath);
2527

2628
it("should share that token of that declaration in cache", function () {
2729
expect(classCache).toEqual(
2830
expect.objectContaining({
29-
"index.svelte": { "layout-1": { a: true }, "layout-2": { a: true } },
31+
"/src": {
32+
"index.svelte": { "layout-1": { a: true }, "layout-2": { a: true } },
33+
},
3034
})
3135
);
3236
});
@@ -53,20 +57,23 @@ describe("when given multiple components", function () {
5357
const tokenizer = createTokenizer(classCache, declarationCache);
5458

5559
const list = [
56-
[code1, "index.svelte"],
57-
[code2, "dummy.svelte"],
60+
[code1, "/src/index.svelte"],
61+
[code2, "/src/dummy.svelte"],
5862
];
5963

6064
for (const [code, filename] of list) {
6165
const ast = parse(code, { filename });
62-
tokenizer.generateToken(ast.css, filename);
66+
const parsedPath = path.parse(filename);
67+
tokenizer.generateToken(ast.css, parsedPath);
6368
}
6469

6570
it("should share that token of that declaration in cache", function () {
6671
expect(classCache).toEqual(
6772
expect.objectContaining({
68-
"index.svelte": { "layout-1": { a: true } },
69-
"dummy.svelte": { "layout-2": { a: true } },
73+
"/src": {
74+
"index.svelte": { "layout-1": { a: true } },
75+
"dummy.svelte": { "layout-2": { a: true } },
76+
},
7077
})
7178
);
7279
});
@@ -83,18 +90,21 @@ describe("when given a javascript expression as class attribute", function () {
8390
8491
<h1 class={"active"}></h1>`;
8592

86-
const filename = "index.svelte";
93+
const filename = "/src/index.svelte";
8794

8895
const classCache = getProxiedObject();
8996
const declarationCache = getProxiedObject();
9097
const tokenizer = createTokenizer(classCache, declarationCache);
9198
const ast = parse(code, { filename });
92-
tokenizer.generateToken(ast.css, filename);
99+
const parsedPath = path.parse(filename);
100+
tokenizer.generateToken(ast.css, parsedPath);
93101

94102
it("should fill the class cache correctly", function () {
95103
expect(classCache).toEqual(
96104
expect.objectContaining({
97-
"index.svelte": { active: { a: true } },
105+
"/src": {
106+
"index.svelte": { active: { a: true } },
107+
},
98108
})
99109
);
100110
});
@@ -116,19 +126,22 @@ describe("when given an dynamic javascript expression as class attribute", funct
116126
117127
<h1 class={isActive ? "active" : "inactive"}></h1>`;
118128

119-
const filename = "index.svelte";
129+
const filename = "/src/index.svelte";
120130

121131
it("should fill the class cache correctly", function () {
122132
const classCache = getProxiedObject();
123133
const declarationCache = getProxiedObject();
124134
const tokenizer = createTokenizer(classCache, declarationCache);
125135
const ast = parse(code, { filename });
126-
tokenizer.generateToken(ast.css, filename);
136+
const parsedPath = path.parse(filename);
137+
tokenizer.generateToken(ast.css, parsedPath);
127138
expect(classCache).toEqual(
128139
expect.objectContaining({
129-
"index.svelte": {
130-
active: { a: true },
131-
inactive: { b: true },
140+
"/src": {
141+
"index.svelte": {
142+
active: { a: true },
143+
inactive: { b: true },
144+
},
132145
},
133146
})
134147
);
@@ -145,13 +158,15 @@ describe("when given a css declaration with psuedo elements", function () {
145158
146159
<h1 class={"title"}></h1>`;
147160

148-
const filename = "index.svelte";
161+
const filename = "/src/index.svelte";
149162

150163
const classCache = getProxiedObject();
151164
const declarationCache = getProxiedObject();
152165
const tokenizer = createTokenizer(classCache, declarationCache);
153166
const ast = parse(code, { filename });
154-
tokenizer.generateToken(ast.css, filename);
167+
168+
const parsedPath = path.parse(filename);
169+
tokenizer.generateToken(ast.css, parsedPath);
155170

156171
it("should fill the declaration cache correctly", function () {
157172
expect(declarationCache).toEqual(
@@ -162,7 +177,9 @@ describe("when given a css declaration with psuedo elements", function () {
162177
it("should fill the class cache correctly", function () {
163178
expect(classCache).toEqual(
164179
expect.objectContaining({
165-
"index.svelte": { "title::before": { a: true } },
180+
"/src": {
181+
"index.svelte": { "title::before": { a: true } },
182+
},
166183
})
167184
);
168185
});
@@ -178,13 +195,15 @@ describe("when given a css declaration with psuedo class", function () {
178195
179196
<h1 class={"title"}></h1>`;
180197

181-
const filename = "index.svelte";
198+
const filename = "/src/index.svelte";
182199

183200
const classCache = getProxiedObject();
184201
const declarationCache = getProxiedObject();
185202
const tokenizer = createTokenizer(classCache, declarationCache);
186203
const ast = parse(code, { filename });
187-
tokenizer.generateToken(ast.css, filename);
204+
205+
const parsedPath = path.parse(filename);
206+
tokenizer.generateToken(ast.css, parsedPath);
188207

189208
it("should fill the declaration cache correctly", function () {
190209
expect(declarationCache).toEqual(
@@ -195,7 +214,9 @@ describe("when given a css declaration with psuedo class", function () {
195214
it("should fill the class cache correctly", function () {
196215
expect(classCache).toEqual(
197216
expect.objectContaining({
198-
"index.svelte": { "title:hover": { a: true } },
217+
"/src": {
218+
"index.svelte": { "title:hover": { a: true } },
219+
},
199220
})
200221
);
201222
});

test/transformer.spec.js

Lines changed: 8 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
import createTransformer from "../src/transformer.js";
22
import { parse } from "svelte/compiler";
3+
import path from "path";
34

45
describe("when transforming html", function () {
56
const code = `
@@ -12,16 +13,19 @@ describe("when transforming html", function () {
1213
<p class="my-long-class-name"></p>
1314
`;
1415

15-
const filename = "index.svelte";
16+
const filename = "/src/index.svelte";
1617

1718
const classCache = {
18-
[filename]: { "my-long-class-name": { a: true } },
19-
"dummy.svelte": { "my-long-class-name": { b: true } },
19+
"/src": {
20+
"index.svelte": { "my-long-class-name": { a: true } },
21+
"dummy.svelte": { "my-long-class-name": { b: true } },
22+
},
2023
};
2124

2225
it("should only transformed with classes associated with current component", function () {
2326
const ast = parse(code, { filename });
24-
const transformer = createTransformer(code, filename).transformHtml(
27+
const parsedPath = path.parse(filename);
28+
const transformer = createTransformer(code, parsedPath).transformHtml(
2529
ast.html,
2630
classCache
2731
);

0 commit comments

Comments
 (0)