Skip to content

Vite plugin v2 - Load local Worker secrets using the Vite mode #15507

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
jamesopstad wants to merge 1 commit into from
Open

Vite plugin v2 - Load local Worker secrets using the Vite mode #15507

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
192 changes: 99 additions & 93 deletions packages/vite-plugin-cloudflare/e2e/basic.test.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -74,106 +74,112 @@ describe("basic e2e tests", () => {
}
);

// TODO: Reinstate when local Worker secrets are loaded with
// cloudflare.config.ts.
describe.skip("environment variables", () => {
test("can read vars from cloudflare.config.ts and .env", async ({
expect,
}) => {
await writeFile(
projectPath + "/.env",
"SECRET_A=dev-1\nSECRET_B=dev-2"
);
onTestFinished(async () => {
await rm(projectPath + "/.env");
});
const proc = await runLongLived(pm, command, projectPath);
const url = await waitForReady(proc);
expect(await fetchJson(url + "/env/")).toMatchObject({
SECRET_A: "dev-1",
SECRET_B: "dev-2",
VAR_1: "var-1",
describe.skipIf(isBuildAndPreviewOnWindows(command))(
"environment variables",
() => {
test("can read vars from cloudflare.config.ts and .env", async ({
expect,
}) => {
await writeFile(
projectPath + "/.env",
"SECRET_A=dev-1\nSECRET_B=dev-2"
);
onTestFinished(async () => {
await rm(projectPath + "/.env");
});
const proc = await runLongLived(pm, command, projectPath);
const url = await waitForReady(proc);
expect(await fetchJson(url + "/env/")).toMatchObject({
SECRET_A: "dev-1",
SECRET_B: "dev-2",
VAR_1: "var-1",
});
});
});

test("will not load local dev vars from .env if there is a .dev.vars file", async ({
expect,
}) => {
await writeFile(
projectPath + "/.env",
"SECRET_A=dot-env-1\nSECRET_B=dot-env-2"
);
await writeFile(
projectPath + "/.dev.vars",
"SECRET_A=dev-dot-vars-1"
);
onTestFinished(async () => {
await rm(projectPath + "/.env");
await rm(projectPath + "/.dev.vars");
test("will not load local dev vars from .env if there is a .dev.vars file", async ({
expect,
}) => {
await writeFile(
projectPath + "/.env",
"SECRET_A=dot-env-1\nSECRET_B=dot-env-2"
);
await writeFile(
projectPath + "/.dev.vars",
"SECRET_A=dev-dot-vars-1"
);
onTestFinished(async () => {
await rm(projectPath + "/.env");
await rm(projectPath + "/.dev.vars");
});
const proc = await runLongLived(pm, command, projectPath);
const url = await waitForReady(proc);
expect(await fetchJson(url + "/env/")).toMatchObject({
SECRET_A: "dev-dot-vars-1",
VAR_1: "var-1",
});
});
const proc = await runLongLived(pm, command, projectPath);
const url = await waitForReady(proc);
expect(await fetchJson(url + "/env/")).toMatchObject({
SECRET_A: "dev-dot-vars-1",
VAR_1: "var-1",
});
});

test("can merge vars from cloudflare.config.ts, .env, and .env.local", async ({
expect,
}) => {
await writeFile(
projectPath + "/.env",
"SECRET_A=dev-1\nSECRET_B=dev-2"
);
await writeFile(projectPath + "/.env.local", "SECRET_A=local-dev-1");
onTestFinished(async () => {
await rm(projectPath + "/.env");
await rm(projectPath + "/.env.local");
test("can merge vars from cloudflare.config.ts, .env, and .env.local", async ({
expect,
}) => {
await writeFile(
projectPath + "/.env",
"SECRET_A=dev-1\nSECRET_B=dev-2"
);
await writeFile(
projectPath + "/.env.local",
"SECRET_A=local-dev-1"
);
onTestFinished(async () => {
await rm(projectPath + "/.env");
await rm(projectPath + "/.env.local");
});
const proc = await runLongLived(pm, command, projectPath);
const url = await waitForReady(proc);
expect(await fetchJson(url + "/env/")).toMatchObject({
SECRET_A: "local-dev-1",
SECRET_B: "dev-2",
VAR_1: "var-1",
});
});
const proc = await runLongLived(pm, command, projectPath);
const url = await waitForReady(proc);
expect(await fetchJson(url + "/env/")).toMatchObject({
SECRET_A: "local-dev-1",
SECRET_B: "dev-2",
VAR_1: "var-1",
});
});

test("can merge vars from cloudflare.config.ts, .env, .env.local, and environment specific files", async ({
expect,
}) => {
await writeFile(
projectPath + "/.env",
"SECRET_A=dev-1\nSECRET_B=dev-2"
);
await writeFile(projectPath + "/.env.local", "SECRET_A=local-dev-1");
await writeFile(
projectPath + "/.env.staging",
"SECRET_B=staging-2\nSECRET_C=staging-3"
);
await writeFile(
projectPath + "/.env.staging.local",
"SECRET_C=local-staging-3"
);
onTestFinished(async () => {
await rm(projectPath + "/.env");
await rm(projectPath + "/.env.local");
await rm(projectPath + "/.env.staging");
await rm(projectPath + "/.env.staging.local");
test("can merge vars from cloudflare.config.ts, .env, .env.local, and mode-specific files", async ({
expect,
}) => {
const mode = command === "dev" ? "development" : "production";
await writeFile(
projectPath + "/.env",
"SECRET_A=dev-1\nSECRET_B=dev-2"
);
await writeFile(
projectPath + "/.env.local",
"SECRET_A=local-dev-1"
);
await writeFile(
projectPath + `/.env.${mode}`,
"SECRET_B=staging-2\nSECRET_C=staging-3"
);
await writeFile(
projectPath + `/.env.${mode}.local`,
"SECRET_C=local-staging-3"
);
onTestFinished(async () => {
await rm(projectPath + "/.env");
await rm(projectPath + "/.env.local");
await rm(projectPath + `/.env.${mode}`);
await rm(projectPath + `/.env.${mode}.local`);
});
const proc = await runLongLived(pm, command, projectPath);
const url = await waitForReady(proc);
expect(await fetchJson(url + "/env/")).toMatchObject({
SECRET_A: "local-dev-1",
SECRET_B: "staging-2",
SECRET_C: "local-staging-3",
VAR_1: "var-1",
});
});
const proc = await runLongLived(pm, command, projectPath, {
CLOUDFLARE_ENV: "staging",
});
const url = await waitForReady(proc);
expect(await fetchJson(url + "/env/")).toMatchObject({
SECRET_A: "local-dev-1",
SECRET_B: "staging-2",
SECRET_C: "local-staging-3",
VAR_1: "var-1",
});
});
});
}
);
});
});
});
3 changes: 3 additions & 0 deletions packages/vite-plugin-cloudflare/e2e/fixtures/basic/cloudflare.config.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,9 @@ export default defineWorker({
assets: { notFoundHandling: "single-page-application" },
env: {
ASSETS: bindings.assets(),
SECRET_A: bindings.secret(),
SECRET_B: bindings.secret(),
SECRET_C: bindings.secret(),
VAR_1: bindings.text("var-1"),
},
});
4 changes: 1 addition & 3 deletions packages/vite-plugin-cloudflare/playground/bindings/__tests__/worker.spec.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -26,9 +26,7 @@ test("ratelimit support", async ({ expect }) => {
expect(response).toBe("Rate limit binding works: first: true, second: false");
});

// TODO: Reinstate when .env and .dev.vars files are supported with
// cloudflare.config.ts.
test.skip("hyperdrive support", async ({ expect }) => {
test("hyperdrive support", async ({ expect }) => {
const response = await getTextResponse("/hyperdrive");
expect(response).toBe("Hyperdrive binding works");
});
4 changes: 1 addition & 3 deletions packages/vite-plugin-cloudflare/playground/bindings/cloudflare.config.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -21,9 +21,7 @@ export default defineWorker({
}),
IMAGES: bindings.images(),
WAE: bindings.analyticsEngineDataset({ name: "test" }),
// TODO: Reinstate when .env and .dev.vars files are supported with
// cloudflare.config.ts.
// HYPERDRIVE: bindings.hyperdrive({ id: "test-hyperdrive-id" }),
HYPERDRIVE: bindings.hyperdrive({ id: "test-hyperdrive-id" }),
RATE_LIMITER: bindings.rateLimit({
namespace: "1001",
simple: { limit: 1, period: 60 },
Expand Down
24 changes: 11 additions & 13 deletions packages/vite-plugin-cloudflare/playground/bindings/src/index.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -66,20 +66,18 @@ export default {
}
);
}
// TODO: Reinstate when .env and .dev.vars files are supported with
// cloudflare.config.ts.
// case "/hyperdrive": {
// if (
// typeof env.HYPERDRIVE.connect !== "function" ||
// typeof env.HYPERDRIVE.connectionString !== "string"
// ) {
// return new Response("Hyperdrive binding is not configured properly", {
// status: 500,
// });
// }
case "/hyperdrive": {
if (
typeof env.HYPERDRIVE.connect !== "function" ||
typeof env.HYPERDRIVE.connectionString !== "string"
) {
return new Response("Hyperdrive binding is not configured properly", {
status: 500,
});
}

// return new Response("Hyperdrive binding works");
// }
return new Response("Hyperdrive binding works");
}
}

return new Response("Please specify a binding you want to test", {
Expand Down
1 change: 0 additions & 1 deletion packages/vite-plugin-cloudflare/playground/dev-vars/.env.with-specified-env
View file
Open in desktop

This file was deleted.

6 changes: 1 addition & 5 deletions packages/vite-plugin-cloudflare/playground/dev-vars/__tests__/dev-vars-loading.spec.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,11 +1,7 @@
import { test, vi } from "vitest";
import { getJsonResponse, WAIT_FOR_OPTIONS } from "../../__test-utils__";

// TODO: Reinstate when .env and .dev.vars files are supported with
// cloudflare.config.ts.
test.skip("reading variables from a standard .dev.vars file", async ({
expect,
}) => {
test("reads Worker secrets from .dev.vars", async ({ expect }) => {
await vi.waitFor(
async () =>
expect(await getJsonResponse()).toEqual({
Expand Down
63 changes: 33 additions & 30 deletions packages/vite-plugin-cloudflare/playground/dev-vars/__tests__/vars-changes.spec.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,39 +2,42 @@ import * as path from "node:path";
import { test, vi } from "vitest";
import {
getJsonResponse,
isBuild,
mockFileChange,
WAIT_FOR_OPTIONS,
} from "../../__test-utils__";

// TODO: Reinstate when .env and .dev.vars files are supported with
// cloudflare.config.ts.
test.skip("successfully updates when a var is updated in a .dev.vars file", async ({
expect,
}) => {
await vi.waitFor(
async () =>
expect(await getJsonResponse()).toEqual({
"variables present in .dev.vars": {
MY_DEV_VAR_A: "my .dev.vars variable A",
MY_DEV_VAR_B: "my .dev.vars variable B",
MY_DEV_VAR_C: "my .dev.vars variable C",
},
}),
WAIT_FOR_OPTIONS
);
test.runIf(!isBuild)(
"reloads Worker secrets when .dev.vars changes",
async ({ expect }) => {
await vi.waitFor(
async () =>
expect(await getJsonResponse()).toEqual({
"variables present in .dev.vars": {
MY_DEV_VAR_A: "my .dev.vars variable A",
MY_DEV_VAR_B: "my .dev.vars variable B",
MY_DEV_VAR_C: "my .dev.vars variable C",
},
}),
WAIT_FOR_OPTIONS
);

mockFileChange(path.join(__dirname, "../.dev.vars"), (content) =>
content.replace(/my \.dev\.vars variable/g, "my .dev.vars UPDATED variable")
);
mockFileChange(path.join(__dirname, "../.dev.vars"), (content) =>
content.replace(
/my \.dev\.vars variable/g,
"my .dev.vars UPDATED variable"
)
);

await vi.waitFor(async () => {
const updatedResponse = await getJsonResponse();
expect(updatedResponse).toEqual({
"variables present in .dev.vars": {
MY_DEV_VAR_A: "my .dev.vars UPDATED variable A",
MY_DEV_VAR_B: "my .dev.vars UPDATED variable B",
MY_DEV_VAR_C: "my .dev.vars UPDATED variable C",
},
});
}, WAIT_FOR_OPTIONS);
});
await vi.waitFor(async () => {
const updatedResponse = await getJsonResponse();
expect(updatedResponse).toEqual({
"variables present in .dev.vars": {
MY_DEV_VAR_A: "my .dev.vars UPDATED variable A",
MY_DEV_VAR_B: "my .dev.vars UPDATED variable B",
MY_DEV_VAR_C: "my .dev.vars UPDATED variable C",
},
});
}, WAIT_FOR_OPTIONS);
}
);
6 changes: 1 addition & 5 deletions ...ugin-cloudflare/playground/dev-vars/__tests__/with-specified-env/dev-vars-loading.spec.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,11 +1,7 @@
import { test, vi } from "vitest";
import { getJsonResponse, WAIT_FOR_OPTIONS } from "../../../__test-utils__";

// TODO: Reinstate when .env and .dev.vars files are supported with
// cloudflare.config.ts.
test.skip("reading variables from a staging .dev.vars file", async ({
expect,
}) => {
test("uses .dev.vars.staging exclusively", async ({ expect }) => {
await vi.waitFor(
async () =>
expect(await getJsonResponse()).toEqual({
Expand Down
Loading
Loading