Skip to content

Commit 5be11d3

Browse files
committed
add test fixture
1 parent f1934f0 commit 5be11d3

13 files changed

Lines changed: 160 additions & 23 deletions

File tree

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
import styles from "./CssModulesNonIsland2.module.css";
2+
3+
export function CssModulesNonIsland2() {
4+
return (
5+
<div class="blue">
6+
<h1 class={styles.root}>blue text</h1>
7+
</div>
8+
);
9+
}
Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
import styles from "./CssModulesNonIsland3.module.css";
2+
3+
export function CssModulesNonIsland3() {
4+
return (
5+
<div class="red">
6+
<h1 class={styles.root}>red text</h1>
7+
</div>
8+
);
9+
}
Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
.root {
2+
color: blue;
3+
}
Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
.root {
2+
color: red;
3+
}

packages/plugin-vite/tests/build_test.ts

Lines changed: 42 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -389,21 +389,53 @@ integrationTest(
389389
);
390390

391391
integrationTest(
392-
"vite build - css modules in _layout.tsx non-island component are injected",
392+
"vite build - css modules in _app/_layout/_error non-island component are injected",
393393
async () => {
394+
const fixture = path.join(FIXTURE_DIR, "non_island_css_modules");
395+
await using res = await buildVite(fixture);
396+
394397
await launchProd(
395-
{ cwd: viteResult.tmp },
398+
{ cwd: res.tmp },
396399
async (address) => {
397400
await withBrowser(async (page) => {
398-
await page.goto(`${address}/tests/non_island_css_modules`, {
399-
waitUntil: "networkidle2",
400-
});
401+
{
402+
// check _app/_layout
403+
await page.goto(`${address}`, {
404+
waitUntil: "networkidle2",
405+
});
406+
407+
const _app = await page
408+
.locator<HTMLHeadingElement>(".green > h1")
409+
.evaluate((el) => window.getComputedStyle(el).color);
410+
expect(_app).toEqual("rgb(0, 128, 0)");
411+
412+
const _layout = await page
413+
.locator<HTMLHeadingElement>(".red > h1")
414+
.evaluate((el) => window.getComputedStyle(el).color);
415+
expect(_layout).toEqual("rgb(255, 0, 0)");
416+
}
401417

402-
const color = await page
403-
.locator(".green > h1")
404-
// deno-lint-ignore no-explicit-any
405-
.evaluate((el) => window.getComputedStyle(el as any).color);
406-
expect(color).toEqual("rgb(0, 128, 0)");
418+
{
419+
// check _app/_layout/_error
420+
await page.goto(`${address}/non_existent`, {
421+
waitUntil: "networkidle2",
422+
});
423+
424+
const _app = await page
425+
.locator<HTMLHeadingElement>(".green > h1")
426+
.evaluate((el) => window.getComputedStyle(el).color);
427+
expect(_app).toEqual("rgb(0, 128, 0)");
428+
429+
const _layout = await page
430+
.locator<HTMLHeadingElement>(".red > h1")
431+
.evaluate((el) => window.getComputedStyle(el).color);
432+
expect(_layout).toEqual("rgb(255, 0, 0)");
433+
434+
const _error = await page
435+
.locator<HTMLHeadingElement>(".blue > h1")
436+
.evaluate((el) => window.getComputedStyle(el).color);
437+
expect(_error).toEqual("rgb(0, 0, 255)");
438+
}
407439
});
408440
},
409441
);

packages/plugin-vite/tests/dev_server_test.ts

Lines changed: 42 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -283,20 +283,49 @@ integrationTest(
283283
);
284284

285285
integrationTest(
286-
"vite dev - css modules in _layout.tsx non-island component are injected",
286+
"vite dev - css modules in _app/_layout/_error non-island component are injected",
287287
async () => {
288-
await withBrowser(async (page) => {
289-
await page.goto(`${demoServer.address()}/tests/non_island_css_modules`, {
290-
waitUntil: "networkidle2",
291-
});
292-
293-
await waitFor(async () => {
294-
const color = await page
295-
.locator(".green > h1")
296-
// deno-lint-ignore no-explicit-any
297-
.evaluate((el) => window.getComputedStyle(el as any).color);
298-
expect(color).toEqual("rgb(0, 128, 0)");
299-
return true;
288+
const fixture = path.join(FIXTURE_DIR, "non_island_css_modules");
289+
await launchDevServer(fixture, async (address) => {
290+
await withBrowser(async (page) => {
291+
{
292+
// check _app/_layout
293+
await page.goto(`${address}`, {
294+
waitUntil: "networkidle2",
295+
});
296+
297+
const _app = await page
298+
.locator<HTMLHeadingElement>(".green > h1")
299+
.evaluate((el) => window.getComputedStyle(el).color);
300+
expect(_app).toEqual("rgb(0, 128, 0)");
301+
302+
const _layout = await page
303+
.locator<HTMLHeadingElement>(".red > h1")
304+
.evaluate((el) => window.getComputedStyle(el).color);
305+
expect(_layout).toEqual("rgb(255, 0, 0)");
306+
}
307+
308+
{
309+
// check _app/_layout/_error
310+
await page.goto(`${address}/non_existent`, {
311+
waitUntil: "networkidle2",
312+
});
313+
314+
const _app = await page
315+
.locator<HTMLHeadingElement>(".green > h1")
316+
.evaluate((el) => window.getComputedStyle(el).color);
317+
expect(_app).toEqual("rgb(0, 128, 0)");
318+
319+
const _layout = await page
320+
.locator<HTMLHeadingElement>(".red > h1")
321+
.evaluate((el) => window.getComputedStyle(el).color);
322+
expect(_layout).toEqual("rgb(255, 0, 0)");
323+
324+
const _error = await page
325+
.locator<HTMLHeadingElement>(".blue > h1")
326+
.evaluate((el) => window.getComputedStyle(el).color);
327+
expect(_error).toEqual("rgb(0, 0, 255)");
328+
}
300329
});
301330
});
302331
},
Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
import { App, staticFiles } from "@fresh/core";
2+
3+
export const app = new App()
4+
.use(staticFiles())
5+
.fsRoutes();
Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
import type { PageProps } from "fresh";
2+
import { CssModulesNonIsland } from "../../../../demo/components/CssModuleNonIsland.tsx";
3+
4+
export default function App({ Component }: PageProps) {
5+
return (
6+
<html lang="en">
7+
<head>
8+
<meta charset="utf-8" />
9+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
10+
</head>
11+
<body>
12+
<CssModulesNonIsland />
13+
<Component />
14+
</body>
15+
</html>
16+
);
17+
}
Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
import { define } from "../utils.ts";
2+
import { CssModulesNonIsland2 } from "../../../../demo/components/CssModuleNonIsland2.tsx";
3+
4+
export default define.page((props) => {
5+
return <CssModulesNonIsland2 />;
6+
});
Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
import { CssModulesNonIsland3 } from "../../../../demo/components/CssModuleNonIsland3.tsx";
2+
import { define } from "../utils.ts";
3+
4+
export default define.layout(({ Component }) => {
5+
return (
6+
<>
7+
<CssModulesNonIsland3 />
8+
<Component />
9+
</>
10+
);
11+
});

0 commit comments

Comments
 (0)