Turn on wrangler.json(c) support by default (#7230)

.changeset/brave-paws-build.md

@@ -0,0 +1,23 @@
+---
+"wrangler": minor
+---
+
+Turn on `wrangler.json(c)` support by default
+
+Wrangler now supports both JSON (`wrangler.json`) and TOML (`wrangler.toml`) for it's configuration file. The format of Wrangler's configuration file is exactly the same across both languages, except that the syntax is `JSON` rather than `TOML`. e.g.
+
+```toml
+name = "worker-ts"
+main = "src/index.ts"
+compatibility_date = "2023-05-04"
+```
+
+would be interpreted the same as the equivalent JSON
+
+```json
+{
+	"name": "worker-ts",
+	"main": "src/index.ts",
+	"compatibility_date": "2023-05-04"
+}
+```

packages/wrangler/README.md

@@ -43,7 +43,7 @@ $ npm install wrangler --save-dev
 
 ## Configuration:
 
-Wrangler is configured via a `wrangler.toml` file in the project root. When utilizing the `wrangler init` command, a `wrangler.toml` file will be created for you.
+Wrangler is configured via a `wrangler.json` or `wrangler.toml` file in the project root. When utilizing the `wrangler init` command, a `wrangler.toml` file will be created for you.
 
 Example:
 

packages/wrangler/docs/how-to/add-a-binding.md

@@ -1,6 +1,6 @@
 # How to register a binding
 
-1. Register `wrangler.toml` section in: `packages/wrangler/src/config/environment.ts` [ref](https://github.com/cloudflare/workers-sdk/blob/ce7db9d9cb4f5bcd5a326b86dde051cb54b999fb/packages/wrangler/src/config/environment.ts#L431-L451)
+1. Register Wrangler configuration section in: `packages/wrangler/src/config/environment.ts` [ref](https://github.com/cloudflare/workers-sdk/blob/ce7db9d9cb4f5bcd5a326b86dde051cb54b999fb/packages/wrangler/src/config/environment.ts#L431-L451)
 1. Register validation functions in: `packages/wrangler/src/config/validation.ts` [ref](https://github.com/cloudflare/workers-sdk/blob/ce7db9d9cb4f5bcd5a326b86dde051cb54b999fb/packages/wrangler/src/config/validation.ts#L1297-L1306)
 1. Add empty state for bindings, as necessary (tip: use typescript to guide you -- either via your editor or run: `pnpm check:type` from within `packages/wrangler`)
 1. Add type for deployment bundle to:
@@ -14,5 +14,5 @@
    - `convertBindingsToCfWorkerInitBindings` in: `packages/wrangler/src/api/startDevWorker/utils.ts` [ref](https://github.com/cloudflare/workers-sdk/blob/ce7db9d9cb4f5bcd5a326b86dde051cb54b999fb/packages/wrangler/src/api/startDevWorker/utils.ts#L303-L305)
 1. Test binding is deployed and printed in: `packages/wrangler/src/**tests**/deploy.test.ts` [ref](https://github.com/cloudflare/workers-sdk/blob/ce7db9d9cb4f5bcd5a326b86dde051cb54b999fb/packages/wrangler/src/__tests__/deploy.test.ts#L7604)
 1. Test your validation in: `packages/wrangler/src/**tests**/configuration.test.ts` [ref](https://github.com/cloudflare/workers-sdk/blob/ce7db9d9cb4f5bcd5a326b86dde051cb54b999fb/packages/wrangler/src/__tests__/configuration.test.ts#L2234)
-1. Enable `wrangler init --from-dash` to include your binding in the `wrangler.toml` it generates in: `packages/wrangler/src/init.ts` [ref](https://github.com/cloudflare/workers-sdk/blob/ce7db9d9cb4f5bcd5a326b86dde051cb54b999fb/packages/wrangler/src/init.ts#L1036-L1043)
+1. Enable `wrangler init --from-dash` to include your binding in the Wrangler configuration file it generates in: `packages/wrangler/src/init.ts` [ref](https://github.com/cloudflare/workers-sdk/blob/ce7db9d9cb4f5bcd5a326b86dde051cb54b999fb/packages/wrangler/src/init.ts#L1036-L1043)
 1. Enable `wrangler types` to emit your binding type in: `packages/src/type-generation/index.ts` [ref](https://github.com/cloudflare/workers-sdk/blob/ce7db9d9cb4f5bcd5a326b86dde051cb54b999fb/packages/wrangler/src/type-generation/index.ts#L115)

packages/wrangler/e2e/helpers/e2e-wrangler-test.ts

@@ -57,7 +57,9 @@ export class WranglerE2ETestHelper {
 			return name;
 		}
 		const result = await this.run(`wrangler kv namespace create ${name}`);
-		const match = /id = "([0-9a-f]{32})"/.exec(result.stdout);
+		const tomlMatch = /id = "([0-9a-f]{32})"/.exec(result.stdout);
+		const jsonMatch = /"id": "([0-9a-f]{32})"/.exec(result.stdout);
+		const match = jsonMatch ?? tomlMatch;
 		assert(match !== null, `Cannot find ID in ${JSON.stringify(result)}`);
 		const id = match[1];
 		onTestFinished(async () => {
@@ -84,7 +86,9 @@ export class WranglerE2ETestHelper {
 			return { id: crypto.randomUUID(), name };
 		}
 		const result = await this.run(`wrangler d1 create ${name}`);
-		const match = /database_id = "([0-9a-f-]{36})"/.exec(result.stdout);
+		const tomlMatch = /database_id = "([0-9a-f-]{36})"/.exec(result.stdout);
+		const jsonMatch = /"database_id": "([0-9a-f-]{36})"/.exec(result.stdout);
+		const match = jsonMatch ?? tomlMatch;
 		assert(match !== null, `Cannot find ID in ${JSON.stringify(result)}`);
 		const id = match[1];
 		onTestFinished(async () => {

packages/wrangler/e2e/pages-dev.test.ts

@@ -31,7 +31,7 @@ describe.each([{ cmd: "wrangler pages dev" }])("Pages $cmd", ({ cmd }) => {
 			`No compatibility_date was specified. Using today's date: <current-date>.`
 		);
 		expect(output).toContain(
-			`❯❯ Add one to your wrangler.toml file: compatibility_date = "<current-date>", or`
+			`❯❯ Add one to your Wrangler configuration file: compatibility_date = "<current-date>", or`
 		);
 		expect(output).toContain(
 			`❯❯ Pass it in your terminal: wrangler pages dev [<DIRECTORY>] --compatibility-date=<current-date>`

packages/wrangler/e2e/r2.test.ts

@@ -23,9 +23,14 @@ describe("r2", () => {
 			"Creating bucket 'tmp-e2e-r2-00000000-0000-0000-0000-000000000000'...
 			✅ Created bucket 'tmp-e2e-r2-00000000-0000-0000-0000-000000000000' with default storage class of Standard.
 			Configure your Worker to write objects to this bucket:
-			[[r2_buckets]]
-			bucket_name = "tmp-e2e-r2-00000000-0000-0000-0000-000000000000"
-			binding = "tmp_e2e_r2_00000000_0000_0000_0000_000000000000""
+			{
+			  "r2_buckets": [
+			    {
+			      "bucket_name": "tmp-e2e-r2-00000000-0000-0000-0000-000000000000",
+			      "binding": "tmp_e2e_r2_00000000_0000_0000_0000_000000000000"
+			    }
+			  ]
+			}"
 		`);
 	});
 

packages/wrangler/e2e/types.test.ts

@@ -59,7 +59,7 @@ describe("types", () => {
 			`📣 Since you have Node.js compatibility mode enabled, you should consider adding Node.js for TypeScript by running "npm i --save-dev @types/[email protected]". Please see the docs for more details: https://developers.cloudflare.com/workers/languages/typescript/#transitive-loading-of-typesnode-overrides-cloudflareworkers-types`
 		);
 		expect(output.stdout).toContain(
-			`Remember to run 'wrangler types --x-include-runtime' again if you change 'compatibility_date' or 'compatibility_flags' in your wrangler.toml.`
+			`Remember to run 'wrangler types --x-include-runtime' again if you change 'compatibility_date' or 'compatibility_flags' in your wrangler.toml file.`
 		);
 	});
 

packages/wrangler/src/__tests__/__snapshots__/kv.test.ts.snap

@@ -0,0 +1,97 @@
+// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+
+exports[`wrangler > kv namespace > create > wrangler.json > should create a namespace 1`] = `
+"🌀 Creating namespace with title \\"worker-UnitTestNamespace\\"
+✨ Success!
+Add the following to your configuration file in your kv_namespaces array:
+{
+  \\"kv_namespaces\\": [
+    {
+      \\"binding\\": \\"UnitTestNamespace\\",
+      \\"id\\": \\"some-namespace-id\\"
+    }
+  ]
+}"
+`;
+
+exports[`wrangler > kv namespace > create > wrangler.json > should create a namespace in an environment if configured to do so 1`] = `
+"🌀 Creating namespace with title \\"worker-customEnv-UnitTestNamespace\\"
+✨ Success!
+Add the following to your configuration file in your kv_namespaces array under [env.customEnv]:
+{
+  \\"kv_namespaces\\": [
+    {
+      \\"binding\\": \\"UnitTestNamespace\\",
+      \\"id\\": \\"some-namespace-id\\"
+    }
+  ]
+}"
+`;
+
+exports[`wrangler > kv namespace > create > wrangler.json > should create a namespace using configured worker name 1`] = `
+"🌀 Creating namespace with title \\"other-worker-UnitTestNamespace\\"
+✨ Success!
+Add the following to your configuration file in your kv_namespaces array:
+{
+  \\"kv_namespaces\\": [
+    {
+      \\"binding\\": \\"UnitTestNamespace\\",
+      \\"id\\": \\"some-namespace-id\\"
+    }
+  ]
+}"
+`;
+
+exports[`wrangler > kv namespace > create > wrangler.json > should create a preview namespace if configured to do so 1`] = `
+"🌀 Creating namespace with title \\"worker-UnitTestNamespace_preview\\"
+✨ Success!
+Add the following to your configuration file in your kv_namespaces array:
+{
+  \\"kv_namespaces\\": [
+    {
+      \\"binding\\": \\"UnitTestNamespace\\",
+      \\"preview_id\\": \\"some-namespace-id\\"
+    }
+  ]
+}"
+`;
+
+exports[`wrangler > kv namespace > create > wrangler.toml > should create a namespace 1`] = `
+"🌀 Creating namespace with title \\"worker-UnitTestNamespace\\"
+✨ Success!
+Add the following to your configuration file in your kv_namespaces array:
+[[kv_namespaces]]
+binding = \\"UnitTestNamespace\\"
+id = \\"some-namespace-id\\"
+"
+`;
+
+exports[`wrangler > kv namespace > create > wrangler.toml > should create a namespace in an environment if configured to do so 1`] = `
+"🌀 Creating namespace with title \\"worker-customEnv-UnitTestNamespace\\"
+✨ Success!
+Add the following to your configuration file in your kv_namespaces array under [env.customEnv]:
+[[kv_namespaces]]
+binding = \\"UnitTestNamespace\\"
+id = \\"some-namespace-id\\"
+"
+`;
+
+exports[`wrangler > kv namespace > create > wrangler.toml > should create a namespace using configured worker name 1`] = `
+"🌀 Creating namespace with title \\"other-worker-UnitTestNamespace\\"
+✨ Success!
+Add the following to your configuration file in your kv_namespaces array:
+[[kv_namespaces]]
+binding = \\"UnitTestNamespace\\"
+id = \\"some-namespace-id\\"
+"
+`;
+
+exports[`wrangler > kv namespace > create > wrangler.toml > should create a preview namespace if configured to do so 1`] = `
+"🌀 Creating namespace with title \\"worker-UnitTestNamespace_preview\\"
+✨ Success!
+Add the following to your configuration file in your kv_namespaces array:
+[[kv_namespaces]]
+binding = \\"UnitTestNamespace\\"
+preview_id = \\"some-namespace-id\\"
+"
+`;

packages/wrangler/src/__tests__/__snapshots__/queues.test.ts.snap

@@ -0,0 +1,93 @@
+// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+
+exports[`wrangler > queues > create > wrangler.json > should create a queue 1`] = `
+"🌀 Creating queue 'testQueue'
+✅ Created queue 'testQueue'
+
+Configure your Worker to send messages to this queue:
+
+{
+  \\"queues\\": {
+    \\"producers\\": [
+      {
+        \\"queue\\": \\"testQueue\\",
+        \\"binding\\": \\"testQueue\\"
+      }
+    ]
+  }
+}
+Configure your Worker to consume messages from this queue:
+
+{
+  \\"queues\\": {
+    \\"consumers\\": [
+      {
+        \\"queue\\": \\"testQueue\\"
+      }
+    ]
+  }
+}"
+`;
+
+exports[`wrangler > queues > create > wrangler.json > should send queue settings with delivery delay 1`] = `
+"🌀 Creating queue 'testQueue'
+✅ Created queue 'testQueue'
+
+Configure your Worker to send messages to this queue:
+
+{
+  \\"queues\\": {
+    \\"producers\\": [
+      {
+        \\"queue\\": \\"testQueue\\",
+        \\"binding\\": \\"testQueue\\"
+      }
+    ]
+  }
+}
+Configure your Worker to consume messages from this queue:
+
+{
+  \\"queues\\": {
+    \\"consumers\\": [
+      {
+        \\"queue\\": \\"testQueue\\"
+      }
+    ]
+  }
+}"
+`;
+
+exports[`wrangler > queues > create > wrangler.toml > should create a queue 1`] = `
+"🌀 Creating queue 'testQueue'
+✅ Created queue 'testQueue'
+
+Configure your Worker to send messages to this queue:
+
+[[queues.producers]]
+queue = \\"testQueue\\"
+binding = \\"testQueue\\"
+
+Configure your Worker to consume messages from this queue:
+
+[[queues.consumers]]
+queue = \\"testQueue\\"
+"
+`;
+
+exports[`wrangler > queues > create > wrangler.toml > should send queue settings with delivery delay 1`] = `
+"🌀 Creating queue 'testQueue'
+✅ Created queue 'testQueue'
+
+Configure your Worker to send messages to this queue:
+
+[[queues.producers]]
+queue = \\"testQueue\\"
+binding = \\"testQueue\\"
+
+Configure your Worker to consume messages from this queue:
+
+[[queues.consumers]]
+queue = \\"testQueue\\"
+"
+`;