feat(wrangler): Add support for wrangler.jsonc

.changeset/rare-forks-fly.md

@@ -0,0 +1,11 @@
+---
+"wrangler": minor
+---
+
+feat: Add support for `wrangler.jsonc`
+
+This commit adds support for `wrangler.jsonc` config file for Workers. This feature is available behind the `--experimental-json-config` flag (just like `wrangler.json`).
+
+To use the new configuration file, add a `wrangler.jsonc` file to your Worker project and run `wrangler dev --experimental-json-config` or `wrangler deploy --experimental-json-config`.
+
+Please note that this work does NOT add `wrangler.json` or `wrangler.jsonc` support for Pages projects!

packages/wrangler/src/__tests__/d1/execute.test.ts

@@ -4,7 +4,7 @@ import { mockConsoleMethods } from "../helpers/mock-console";
 import { useMockIsTTY } from "../helpers/mock-istty";
 import { runInTempDir } from "../helpers/run-in-tmp";
 import { runWrangler } from "../helpers/run-wrangler";
-import writeWranglerToml from "../helpers/write-wrangler-toml";
+import { writeWranglerToml } from "../helpers/write-wrangler-toml";
 
 describe("execute", () => {
 	const std = mockConsoleMethods();

packages/wrangler/src/__tests__/d1/export.test.ts

@@ -7,7 +7,7 @@ import { mockGetMemberships } from "../helpers/mock-oauth-flow";
 import { msw } from "../helpers/msw";
 import { runInTempDir } from "../helpers/run-in-tmp";
 import { runWrangler } from "../helpers/run-wrangler";
-import writeWranglerToml from "../helpers/write-wrangler-toml";
+import { writeWranglerToml } from "../helpers/write-wrangler-toml";
 
 describe("execute", () => {
 	mockAccountId({ accountId: null });

packages/wrangler/src/__tests__/d1/info.test.ts

@@ -6,7 +6,7 @@ import { mockGetMemberships } from "../helpers/mock-oauth-flow";
 import { msw } from "../helpers/msw";
 import { runInTempDir } from "../helpers/run-in-tmp";
 import { runWrangler } from "../helpers/run-wrangler";
-import writeWranglerToml from "../helpers/write-wrangler-toml";
+import { writeWranglerToml } from "../helpers/write-wrangler-toml";
 
 describe("info", () => {
 	mockAccountId({ accountId: null });

packages/wrangler/src/__tests__/d1/migrate.test.ts

@@ -10,7 +10,7 @@ import { mockSetTimeout } from "../helpers/mock-set-timeout";
 import { msw } from "../helpers/msw";
 import { runInTempDir } from "../helpers/run-in-tmp";
 import { runWrangler } from "../helpers/run-wrangler";
-import writeWranglerToml from "../helpers/write-wrangler-toml";
+import { writeWranglerToml } from "../helpers/write-wrangler-toml";
 
 describe("migrate", () => {
 	runInTempDir();

packages/wrangler/src/__tests__/d1/timeTravel.test.ts

@@ -7,7 +7,7 @@ import { mockGetMemberships } from "../helpers/mock-oauth-flow";
 import { msw } from "../helpers/msw";
 import { runInTempDir } from "../helpers/run-in-tmp";
 import { runWrangler } from "../helpers/run-wrangler";
-import writeWranglerToml from "../helpers/write-wrangler-toml";
+import { writeWranglerToml } from "../helpers/write-wrangler-toml";
 
 describe("time-travel", () => {
 	mockConsoleMethods();

packages/wrangler/src/__tests__/delete.test.ts

@@ -6,7 +6,7 @@ import { useMockIsTTY } from "./helpers/mock-istty";
 import { msw } from "./helpers/msw";
 import { runInTempDir } from "./helpers/run-in-tmp";
 import { runWrangler } from "./helpers/run-wrangler";
-import writeWranglerToml from "./helpers/write-wrangler-toml";
+import { writeWranglerToml } from "./helpers/write-wrangler-toml";
 import type { ServiceReferenceResponse, Tail } from "../delete";
 import type { KVNamespaceInfo } from "../kv/helpers";
 

packages/wrangler/src/__tests__/deploy.test.ts

@@ -47,7 +47,7 @@ import { mswListNewDeploymentsLatestFull } from "./helpers/msw/handlers/versions
 import { runInTempDir } from "./helpers/run-in-tmp";
 import { runWrangler } from "./helpers/run-wrangler";
 import { writeWorkerSource } from "./helpers/write-worker-source";
-import writeWranglerToml from "./helpers/write-wrangler-toml";
+import { writeWranglerToml } from "./helpers/write-wrangler-toml";
 import type { Config } from "../config";
 import type { CustomDomain, CustomDomainChangeset } from "../deploy/deploy";
 import type { KVNamespaceInfo } from "../kv/helpers";
@@ -88,6 +88,190 @@ describe("deploy", () => {
 		clearDialogs();
 	});
 
+	it("should resolve wrangler.toml relative to the entrypoint", async () => {
+		fs.mkdirSync("./some-path/worker", { recursive: true });
+		fs.writeFileSync(
+			"./some-path/wrangler.toml",
+			TOML.stringify({
+				name: "test-name",
+				compatibility_date: "2022-01-12",
+				vars: { xyz: 123 },
+			}),
+			"utf-8"
+		);
+		writeWorkerSource({ basePath: "./some-path/worker" });
+		mockUploadWorkerRequest({
+			expectedBindings: [
+				{
+					json: 123,
+					name: "xyz",
+					type: "json",
+				},
+			],
+			expectedCompatibilityDate: "2022-01-12",
+		});
+		mockSubDomainRequest();
+		await runWrangler("deploy ./some-path/worker/index.js");
+		expect(std.out).toMatchInlineSnapshot(`
+		"Total Upload: xx KiB / gzip: xx KiB
+		Your worker has access to the following bindings:
+		- Vars:
+		  - xyz: 123
+		Uploaded test-name (TIMINGS)
+		Published test-name (TIMINGS)
+		  https://test-name.test-sub-domain.workers.dev
+		Current Deployment ID: Galaxy-Class
+		Current Version ID: Galaxy-Class
+
+
+		Note: Deployment ID has been renamed to Version ID. Deployment ID is present to maintain compatibility with the previous behavior of this command. This output will change in a future version of Wrangler. To learn more visit: https://developers.cloudflare.com/workers/configuration/versions-and-deployments"
+	`);
+		expect(std.err).toMatchInlineSnapshot(`""`);
+	});
+
+	it("should support wrangler.json", async () => {
+		fs.mkdirSync("./my-worker", { recursive: true });
+		fs.writeFileSync(
+			"./wrangler.json",
+			JSON.stringify({
+				name: "test-worker",
+				compatibility_date: "2024-01-01",
+				vars: { xyz: 123 },
+			}),
+			"utf-8"
+		);
+		writeWorkerSource({ basePath: "./my-worker" });
+		mockUploadWorkerRequest({
+			expectedScriptName: "test-worker",
+			expectedBindings: [
+				{
+					json: 123,
+					name: "xyz",
+					type: "json",
+				},
+			],
+			expectedCompatibilityDate: "2024-01-01",
+		});
+		mockSubDomainRequest();
+
+		await runWrangler("deploy ./my-worker/index.js --experimental-json-config");
+		expect(std.out).toMatchInlineSnapshot(`
+			"Total Upload: xx KiB / gzip: xx KiB
+			Your worker has access to the following bindings:
+			- Vars:
+			  - xyz: 123
+			Uploaded test-worker (TIMINGS)
+			Published test-worker (TIMINGS)
+			  https://test-worker.test-sub-domain.workers.dev
+			Current Deployment ID: Galaxy-Class
+			Current Version ID: Galaxy-Class
+
+
+			Note: Deployment ID has been renamed to Version ID. Deployment ID is present to maintain compatibility with the previous behavior of this command. This output will change in a future version of Wrangler. To learn more visit: https://developers.cloudflare.com/workers/configuration/versions-and-deployments"
+		`);
+		expect(std.err).toMatchInlineSnapshot(`""`);
+	});
+
+	it("should support wrangler.jsonc", async () => {
+		fs.mkdirSync("./my-worker", { recursive: true });
+		fs.writeFileSync(
+			"./wrangler.jsonc",
+			JSON.stringify({
+				name: "test-worker-jsonc",
+				compatibility_date: "2024-01-01",
+				vars: { xyz: 123 },
+			}),
+			"utf-8"
+		);
+		writeWorkerSource({ basePath: "./my-worker" });
+		mockUploadWorkerRequest({
+			expectedScriptName: "test-worker-jsonc",
+			expectedBindings: [
+				{
+					json: 123,
+					name: "xyz",
+					type: "json",
+				},
+			],
+			expectedCompatibilityDate: "2024-01-01",
+		});
+		mockSubDomainRequest();
+
+		await runWrangler("deploy ./my-worker/index.js --experimental-json-config");
+		expect(std.out).toMatchInlineSnapshot(`
+			"Total Upload: xx KiB / gzip: xx KiB
+			Your worker has access to the following bindings:
+			- Vars:
+			  - xyz: 123
+			Uploaded test-worker-jsonc (TIMINGS)
+			Published test-worker-jsonc (TIMINGS)
+			  https://test-worker-jsonc.test-sub-domain.workers.dev
+			Current Deployment ID: Galaxy-Class
+			Current Version ID: Galaxy-Class
+
+
+			Note: Deployment ID has been renamed to Version ID. Deployment ID is present to maintain compatibility with the previous behavior of this command. This output will change in a future version of Wrangler. To learn more visit: https://developers.cloudflare.com/workers/configuration/versions-and-deployments"
+		`);
+		expect(std.err).toMatchInlineSnapshot(`""`);
+	});
+
+	it("should not deploy if there's any other kind of error when checking deployment source", async () => {
+		writeWorkerSource();
+		writeWranglerToml();
+		mockSubDomainRequest();
+		mockUploadWorkerRequest();
+		msw.use(...mswSuccessOauthHandlers, ...mswSuccessUserHandlers);
+		msw.use(
+			http.get("*/accounts/:accountId/workers/services/:scriptName", () => {
+				return HttpResponse.json(
+					createFetchResult(null, false, [
+						{ code: 10000, message: "Authentication error" },
+					])
+				);
+			}),
+			http.get(
+				"*/accounts/:accountId/workers/deployments/by-script/:scriptTag",
+				() => {
+					return HttpResponse.json(
+						createFetchResult({
+							latest: { number: "2" },
+						})
+					);
+				}
+			)
+		);
+
+		await expect(
+			runWrangler("deploy index.js")
+		).rejects.toThrowErrorMatchingInlineSnapshot(
+			`[APIError: A request to the Cloudflare API (/accounts/some-account-id/workers/services/test-name) failed.]`
+		);
+		expect(std.out).toMatchInlineSnapshot(`
+		"
+		X [ERROR] A request to the Cloudflare API (/accounts/some-account-id/workers/services/test-name) failed.
+
+		  Authentication error [code: 10000]
+
+
+		📎 It looks like you are authenticating Wrangler via a custom API token set in an environment variable.
+		Please ensure it has the correct permissions for this operation.
+
+		Getting User settings...
+		👋 You are logged in with an API Token, associated with the email [email protected]!
+		ℹ️  The API Token is read from the CLOUDFLARE_API_TOKEN in your environment.
+		┌───────────────┬────────────┐
+		│ Account Name  │ Account ID │
+		├───────────────┼────────────┤
+		│ Account One   │ account-1  │
+		├───────────────┼────────────┤
+		│ Account Two   │ account-2  │
+		├───────────────┼────────────┤
+		│ Account Three │ account-3  │
+		└───────────────┴────────────┘
+		🔓 To see token permissions visit https://dash.cloudflare.com/profile/api-tokens"
+	`);
+	});
+
 	describe("output additional script information", () => {
 		it("for first party workers, it should print worker information at log level", async () => {
 			setIsTTY(false);
@@ -672,47 +856,6 @@ describe("deploy", () => {
 		});
 	});
 
-	it("should resolve wrangler.toml relative to the entrypoint", async () => {
-		fs.mkdirSync("./some-path/worker", { recursive: true });
-		fs.writeFileSync(
-			"./some-path/wrangler.toml",
-			TOML.stringify({
-				name: "test-name",
-				compatibility_date: "2022-01-12",
-				vars: { xyz: 123 },
-			}),
-			"utf-8"
-		);
-		writeWorkerSource({ basePath: "./some-path/worker" });
-		mockUploadWorkerRequest({
-			expectedBindings: [
-				{
-					json: 123,
-					name: "xyz",
-					type: "json",
-				},
-			],
-			expectedCompatibilityDate: "2022-01-12",
-		});
-		mockSubDomainRequest();
-		await runWrangler("deploy ./some-path/worker/index.js");
-		expect(std.out).toMatchInlineSnapshot(`
-		"Total Upload: xx KiB / gzip: xx KiB
-		Your worker has access to the following bindings:
-		- Vars:
-		  - xyz: 123
-		Uploaded test-name (TIMINGS)
-		Published test-name (TIMINGS)
-		  https://test-name.test-sub-domain.workers.dev
-		Current Deployment ID: Galaxy-Class
-		Current Version ID: Galaxy-Class
-
-
-		Note: Deployment ID has been renamed to Version ID. Deployment ID is present to maintain compatibility with the previous behavior of this command. This output will change in a future version of Wrangler. To learn more visit: https://developers.cloudflare.com/workers/configuration/versions-and-deployments"
-	`);
-		expect(std.err).toMatchInlineSnapshot(`""`);
-	});
-
 	describe("routes", () => {
 		it("should deploy the worker to a route", async () => {
 			writeWranglerToml({
@@ -4947,6 +5090,7 @@ addEventListener('fetch', event => {});`
 			);
 		});
 	});
+
 	describe("custom builds", () => {
 		beforeEach(() => {
 			vi.unstubAllGlobals();
@@ -9130,63 +9274,6 @@ export default{
 		});
 	});
 
-	it("should not deploy if there's any other kind of error when checking deployment source", async () => {
-		writeWorkerSource();
-		writeWranglerToml();
-		mockSubDomainRequest();
-		mockUploadWorkerRequest();
-		msw.use(...mswSuccessOauthHandlers, ...mswSuccessUserHandlers);
-		msw.use(
-			http.get("*/accounts/:accountId/workers/services/:scriptName", () => {
-				return HttpResponse.json(
-					createFetchResult(null, false, [
-						{ code: 10000, message: "Authentication error" },
-					])
-				);
-			}),
-			http.get(
-				"*/accounts/:accountId/workers/deployments/by-script/:scriptTag",
-				() => {
-					return HttpResponse.json(
-						createFetchResult({
-							latest: { number: "2" },
-						})
-					);
-				}
-			)
-		);
-
-		await expect(
-			runWrangler("deploy index.js")
-		).rejects.toThrowErrorMatchingInlineSnapshot(
-			`[APIError: A request to the Cloudflare API (/accounts/some-account-id/workers/services/test-name) failed.]`
-		);
-		expect(std.out).toMatchInlineSnapshot(`
-		"
-		X [ERROR] A request to the Cloudflare API (/accounts/some-account-id/workers/services/test-name) failed.
-
-		  Authentication error [code: 10000]
-
-
-		📎 It looks like you are authenticating Wrangler via a custom API token set in an environment variable.
-		Please ensure it has the correct permissions for this operation.
-
-		Getting User settings...
-		👋 You are logged in with an API Token, associated with the email [email protected]!
-		ℹ️  The API Token is read from the CLOUDFLARE_API_TOKEN in your environment.
-		┌───────────────┬────────────┐
-		│ Account Name  │ Account ID │
-		├───────────────┼────────────┤
-		│ Account One   │ account-1  │
-		├───────────────┼────────────┤
-		│ Account Two   │ account-2  │
-		├───────────────┼────────────┤
-		│ Account Three │ account-3  │
-		└───────────────┴────────────┘
-		🔓 To see token permissions visit https://dash.cloudflare.com/profile/api-tokens"
-	`);
-	});
-
 	describe("queues", () => {
 		const queueId = "queue-id";
 		const queueName = "queue1";

packages/wrangler/src/__tests__/deployments.test.ts

@@ -15,7 +15,7 @@ import {
 } from "./helpers/msw";
 import { runInTempDir } from "./helpers/run-in-tmp";
 import { runWrangler } from "./helpers/run-wrangler";
-import writeWranglerToml from "./helpers/write-wrangler-toml";
+import { writeWranglerToml } from "./helpers/write-wrangler-toml";
 
 function isFileNotFound(e: unknown) {
 	return (