Skip to content

Commit 430c5cd

Browse files
committed
test: write case where VITE_* variable is used in routes.ts
1 parent 1cd0335 commit 430c5cd

File tree

1 file changed

+76
-81
lines changed

1 file changed

+76
-81
lines changed

integration/vite-dotenv-test.ts

Lines changed: 76 additions & 81 deletions
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@ import {
1010
} from "./helpers/vite.js";
1111

1212
const templateNames = [
13-
"vite-5-template",
13+
"vite-6-template",
1414
"rsc-vite-framework",
1515
] as const satisfies TemplateName[];
1616

@@ -30,6 +30,24 @@ let getFiles = async ({
3030
"server.mjs": EXPRESS_SERVER({ port, templateName }),
3131
[envPath]: `
3232
ENV_VAR_FROM_DOTENV_FILE=Content from ${envPath} file
33+
VITE_PORTAL=testing
34+
`,
35+
"app/routes.ts": `
36+
import { type RouteConfig, route } from "@react-router/dev/routes";
37+
import { flatRoutes } from "@react-router/fs-routes";
38+
const routes = [];
39+
if (import.meta.env.VITE_PORTAL === "testing") {
40+
routes.push(route("testing", "testing.tsx"));
41+
}
42+
export default [
43+
...await flatRoutes(),
44+
...routes,
45+
] satisfies RouteConfig;
46+
`,
47+
"app/testing.tsx": String.raw`
48+
export default function TestingRoute() {
49+
return <div data-testing-route>Testing Route</div>
50+
}
3351
`,
3452
"app/routes/dotenv.tsx": String.raw`
3553
import { useState, useEffect } from "react";
@@ -62,91 +80,68 @@ let getFiles = async ({
6280
};
6381
};
6482

65-
test.describe("Vite .env", () => {
66-
for (const templateName of templateNames) {
67-
test.describe(`template: ${templateName}`, () => {
68-
test.describe("defaults", async () => {
69-
let port: number;
70-
let cwd: string;
71-
let stop: () => void;
72-
73-
test.beforeAll(async () => {
74-
port = await getPort();
75-
cwd = await createProject(
76-
await getFiles({ port, templateName }),
77-
templateName,
78-
);
79-
stop = await customDev({ cwd, port });
80-
});
81-
test.afterAll(() => stop());
82-
83-
test("express", async ({ page }) => {
84-
let pageErrors: unknown[] = [];
85-
page.on("pageerror", (error) => pageErrors.push(error));
86-
87-
await page.goto(`http://localhost:${port}/dotenv`, {
88-
waitUntil: "networkidle",
83+
for (const envDir of [undefined, "custom-env-dir"]) {
84+
let envPath = `${envDir ? `${envDir}/` : ""}.env`;
85+
test.describe(`Vite ${envPath}`, () => {
86+
for (const templateName of templateNames) {
87+
test.describe(`template: ${templateName}`, () => {
88+
test.describe("defaults", async () => {
89+
let port: number;
90+
let cwd: string;
91+
let stop: () => void;
92+
93+
test.beforeAll(async () => {
94+
port = await getPort();
95+
cwd = await createProject(
96+
await getFiles({ envDir, port, templateName }),
97+
templateName,
98+
);
99+
stop = await customDev({ cwd, port });
100+
});
101+
test.afterAll(() => stop());
102+
103+
test("express", async ({ page }) => {
104+
let pageErrors: unknown[] = [];
105+
page.on("pageerror", (error) => pageErrors.push(error));
106+
107+
await page.goto(`http://localhost:${port}/dotenv`, {
108+
waitUntil: "networkidle",
109+
});
110+
expect(pageErrors).toEqual([]);
111+
112+
let loaderContent = page.locator(
113+
"[data-dotenv-route-loader-content]",
114+
);
115+
await expect(loaderContent).toHaveText(
116+
`Content from ${envPath} file`,
117+
);
118+
119+
let clientContent = page.locator(
120+
"[data-dotenv-route-client-content]",
121+
);
122+
await expect(clientContent).toHaveText(
123+
"process.env.ENV_VAR_FROM_DOTENV_FILE not available on the client, which is a good thing",
124+
);
125+
126+
expect(pageErrors).toEqual([]);
89127
});
90-
expect(pageErrors).toEqual([]);
91-
92-
let loaderContent = page.locator(
93-
"[data-dotenv-route-loader-content]",
94-
);
95-
await expect(loaderContent).toHaveText("Content from .env file");
96128

97-
let clientContent = page.locator(
98-
"[data-dotenv-route-client-content]",
99-
);
100-
await expect(clientContent).toHaveText(
101-
"process.env.ENV_VAR_FROM_DOTENV_FILE not available on the client, which is a good thing",
102-
);
129+
test("routes.ts has VITE_* env var", async ({ page }) => {
130+
let pageErrors: unknown[] = [];
131+
page.on("pageerror", (error) => pageErrors.push(error));
103132

104-
expect(pageErrors).toEqual([]);
105-
});
106-
});
107-
108-
test.describe("custom env dir", async () => {
109-
let port: number;
110-
let cwd: string;
111-
let stop: () => void;
112-
113-
test.beforeAll(async () => {
114-
const envDir = "custom-env-dir";
115-
port = await getPort();
116-
cwd = await createProject(
117-
await getFiles({ envDir, port, templateName }),
118-
templateName,
119-
);
120-
stop = await customDev({ cwd, port });
121-
});
122-
test.afterAll(() => stop());
133+
await page.goto(`http://localhost:${port}/testing`, {
134+
waitUntil: "networkidle",
135+
});
136+
expect(pageErrors).toEqual([]);
123137

124-
test("express", async ({ page }) => {
125-
let pageErrors: unknown[] = [];
126-
page.on("pageerror", (error) => pageErrors.push(error));
138+
let testingDiv = page.locator("[data-testing-route]");
139+
await expect(testingDiv).toHaveText("Testing Route");
127140

128-
await page.goto(`http://localhost:${port}/dotenv`, {
129-
waitUntil: "networkidle",
141+
expect(pageErrors).toEqual([]);
130142
});
131-
expect(pageErrors).toEqual([]);
132-
133-
let loaderContent = page.locator(
134-
"[data-dotenv-route-loader-content]",
135-
);
136-
await expect(loaderContent).toHaveText(
137-
"Content from custom-env-dir/.env file",
138-
);
139-
140-
let clientContent = page.locator(
141-
"[data-dotenv-route-client-content]",
142-
);
143-
await expect(clientContent).toHaveText(
144-
"process.env.ENV_VAR_FROM_DOTENV_FILE not available on the client, which is a good thing",
145-
);
146-
147-
expect(pageErrors).toEqual([]);
148143
});
149144
});
150-
});
151-
}
152-
});
145+
}
146+
});
147+
}

0 commit comments

Comments
 (0)