From 6ca4cbfcdbdf969e23a1292fd8998a6900e89a41 Mon Sep 17 00:00:00 2001
From: Taylor Lee <tlee@cloudflare.com>
Date: Mon, 11 Nov 2024 08:41:15 -0800
Subject: [PATCH] feat(wrangler): create separate config for
 workers_dev_previews

The current Preview URLs (beta) feature routes to version preview urls based on the status of the `workers_dev` config value. Beta users have requested the ability to enable deployment urls and preview urls separately on `workers.dev`, and the new `previews_enabled` field of the enable-subdomain API will allow that. This change separates the `workers_dev` and `workers_dev_previews` behavior during `wrangler triggers deploy` and `wrangler versions upload`. `wrangler_dev_previews` defaults to true, and does not implicitly depend on routes the way `wrangler_dev` does.
---
 .changeset/famous-mayflies-knock.md           |   8 +
 .../wrangler/src/__tests__/deploy.test.ts     |  94 ++++++++++-
 .../helpers/mock-workers-subdomain.ts         |  14 +-
 .../versions/versions.upload.test.ts          |   6 +-
 packages/wrangler/src/config/config.ts        |   1 +
 packages/wrangler/src/config/environment.ts   |   9 ++
 packages/wrangler/src/config/validation.ts    |  10 ++
 packages/wrangler/src/init.ts                 |   2 +
 packages/wrangler/src/triggers/deploy.ts      | 146 ++++++++++--------
 packages/wrangler/src/versions/upload.ts      |   9 +-
 10 files changed, 224 insertions(+), 75 deletions(-)
 create mode 100644 .changeset/famous-mayflies-knock.md

diff --git a/.changeset/famous-mayflies-knock.md b/.changeset/famous-mayflies-knock.md
new file mode 100644
index 0000000000000..e04e9fdf3f0d5
--- /dev/null
+++ b/.changeset/famous-mayflies-knock.md
@@ -0,0 +1,8 @@
+---
+"wrangler": minor
+---
+
+Add `workers_dev_previews` toggle to `wrangler.toml`
+
+
+The current Preview URLs (beta) feature routes to version preview urls based on the status of the `workers_dev` config value. Beta users have requested the ability to enable deployment urls and preview urls separately on `workers.dev`, and the new `previews_enabled` field of the enable-subdomain API will allow that. This change separates the `workers_dev` and `workers_dev_previews` behavior during `wrangler triggers deploy` and `wrangler versions upload`. `wrangler_dev_previews` defaults to true, and does not implicitly depend on routes the way `wrangler_dev` does.
diff --git a/packages/wrangler/src/__tests__/deploy.test.ts b/packages/wrangler/src/__tests__/deploy.test.ts
index 69bee6971d5cc..d0235066d5272 100644
--- a/packages/wrangler/src/__tests__/deploy.test.ts
+++ b/packages/wrangler/src/__tests__/deploy.test.ts
@@ -5050,7 +5050,7 @@ addEventListener('fetch', event => {});`
 			expect(std.err).toMatchInlineSnapshot(`""`);
 		});
 
-		it("should not try to enable the workers.dev domain if it has been enabled before", async () => {
+		it("should not try to enable the workers.dev domain if it has been enabled before and previews are in sync", async () => {
 			writeWranglerToml({
 				workers_dev: true,
 			});
@@ -5072,6 +5072,53 @@ addEventListener('fetch', event => {});`
 			expect(std.err).toMatchInlineSnapshot(`""`);
 		});
 
+		it("should sync the workers.dev domain if it has been enabled before but previews should be enabled", async () => {
+			writeWranglerToml({
+				workers_dev: true,
+			});
+			writeWorkerSource();
+			mockUploadWorkerRequest();
+			mockGetWorkerSubdomain({ enabled: true, previews_enabled: false });
+			mockSubDomainRequest();
+			mockUpdateWorkerSubdomain({ enabled: true, previews_enabled: true });
+
+			await runWrangler("deploy ./index");
+
+			expect(std.out).toMatchInlineSnapshot(`
+				"Total Upload: xx KiB / gzip: xx KiB
+				Worker Startup Time: 100 ms
+				Uploaded test-name (TIMINGS)
+				Deployed test-name triggers (TIMINGS)
+				  https://test-name.test-sub-domain.workers.dev
+				Current Version ID: Galaxy-Class"
+			`);
+			expect(std.err).toMatchInlineSnapshot(`""`);
+		});
+
+		it("should sync the workers.dev domain if it has been enabled before but previews should be enabled", async () => {
+			writeWranglerToml({
+				workers_dev: true,
+				workers_dev_previews: false,
+			});
+			writeWorkerSource();
+			mockUploadWorkerRequest();
+			mockGetWorkerSubdomain({ enabled: true, previews_enabled: true });
+			mockSubDomainRequest();
+			mockUpdateWorkerSubdomain({ enabled: true, previews_enabled: false });
+
+			await runWrangler("deploy ./index");
+
+			expect(std.out).toMatchInlineSnapshot(`
+				"Total Upload: xx KiB / gzip: xx KiB
+				Worker Startup Time: 100 ms
+				Uploaded test-name (TIMINGS)
+				Deployed test-name triggers (TIMINGS)
+				  https://test-name.test-sub-domain.workers.dev
+				Current Version ID: Galaxy-Class"
+			`);
+			expect(std.err).toMatchInlineSnapshot(`""`);
+		});
+
 		it("should disable the workers.dev domain if workers_dev is `false`", async () => {
 			writeWranglerToml({
 				workers_dev: false,
@@ -5093,7 +5140,7 @@ addEventListener('fetch', event => {});`
 			expect(std.err).toMatchInlineSnapshot(`""`);
 		});
 
-		it("should not try to disable the workers.dev domain if it is not already available", async () => {
+		it("should not try to disable the workers.dev domain if it is not already available and previews are in sync", async () => {
 			writeWranglerToml({
 				workers_dev: false,
 			});
@@ -5115,6 +5162,49 @@ addEventListener('fetch', event => {});`
 			expect(std.err).toMatchInlineSnapshot(`""`);
 		});
 
+		it("should sync the workers.dev domain if it is not available but previews should be enabled", async () => {
+			writeWranglerToml({
+				workers_dev: false,
+			});
+			writeWorkerSource();
+			mockUploadWorkerRequest();
+			mockGetWorkerSubdomain({ enabled: false, previews_enabled: false });
+			mockUpdateWorkerSubdomain({ enabled: false, previews_enabled: true });
+
+			await runWrangler("deploy ./index");
+
+			expect(std.out).toMatchInlineSnapshot(`
+				"Total Upload: xx KiB / gzip: xx KiB
+				Worker Startup Time: 100 ms
+				Uploaded test-name (TIMINGS)
+				No deploy targets for test-name (TIMINGS)
+				Current Version ID: Galaxy-Class"
+			`);
+			expect(std.err).toMatchInlineSnapshot(`""`);
+		});
+
+		it("should sync the workers.dev domain if it is not available but previews should be disabled", async () => {
+			writeWranglerToml({
+				workers_dev: false,
+				workers_dev_previews: false,
+			});
+			writeWorkerSource();
+			mockUploadWorkerRequest();
+			mockGetWorkerSubdomain({ enabled: false, previews_enabled: true });
+			mockUpdateWorkerSubdomain({ enabled: false, previews_enabled: false });
+
+			await runWrangler("deploy ./index");
+
+			expect(std.out).toMatchInlineSnapshot(`
+				"Total Upload: xx KiB / gzip: xx KiB
+				Worker Startup Time: 100 ms
+				Uploaded test-name (TIMINGS)
+				No deploy targets for test-name (TIMINGS)
+				Current Version ID: Galaxy-Class"
+			`);
+			expect(std.err).toMatchInlineSnapshot(`""`);
+		});
+
 		it("should disable the workers.dev domain if workers_dev is undefined but overwritten to `false` in environment", async () => {
 			writeWranglerToml({
 				env: {
diff --git a/packages/wrangler/src/__tests__/helpers/mock-workers-subdomain.ts b/packages/wrangler/src/__tests__/helpers/mock-workers-subdomain.ts
index c96c9f7e14ccc..3185346ba6d83 100644
--- a/packages/wrangler/src/__tests__/helpers/mock-workers-subdomain.ts
+++ b/packages/wrangler/src/__tests__/helpers/mock-workers-subdomain.ts
@@ -36,11 +36,13 @@ export function mockSubDomainRequest(
 /** Create a mock handler to fetch the  <script>.<user>.workers.dev subdomain status*/
 export function mockGetWorkerSubdomain({
 	enabled,
+	previews_enabled = true,
 	env,
 	legacyEnv = false,
 	expectedScriptName = "test-name",
 }: {
 	enabled: boolean;
+	previews_enabled?: boolean;
 	env?: string | undefined;
 	legacyEnv?: boolean | undefined;
 	expectedScriptName?: string;
@@ -61,7 +63,9 @@ export function mockGetWorkerSubdomain({
 					expect(params.envName).toEqual(env);
 				}
 
-				return HttpResponse.json(createFetchResult({ enabled }));
+				return HttpResponse.json(
+					createFetchResult({ enabled, previews_enabled })
+				);
 			},
 			{ once: true }
 		)
@@ -71,11 +75,13 @@ export function mockGetWorkerSubdomain({
 /** Create a mock handler to toggle a <script>.<user>.workers.dev subdomain status */
 export function mockUpdateWorkerSubdomain({
 	enabled,
+	previews_enabled = true,
 	env,
 	legacyEnv = false,
 	expectedScriptName = "test-name",
 }: {
 	enabled: boolean;
+	previews_enabled?: boolean;
 	env?: string | undefined;
 	legacyEnv?: boolean | undefined;
 	expectedScriptName?: string;
@@ -96,8 +102,10 @@ export function mockUpdateWorkerSubdomain({
 					expect(params.envName).toEqual(env);
 				}
 				const body = await request.json();
-				expect(body).toEqual({ enabled });
-				return HttpResponse.json(createFetchResult({ enabled }));
+				expect(body).toEqual({ enabled, previews_enabled });
+				return HttpResponse.json(
+					createFetchResult({ enabled, previews_enabled })
+				);
 			},
 			{ once: true }
 		)
diff --git a/packages/wrangler/src/__tests__/versions/versions.upload.test.ts b/packages/wrangler/src/__tests__/versions/versions.upload.test.ts
index f79ee197ffcf1..4d24605a9d2d6 100644
--- a/packages/wrangler/src/__tests__/versions/versions.upload.test.ts
+++ b/packages/wrangler/src/__tests__/versions/versions.upload.test.ts
@@ -110,7 +110,7 @@ describe("versions upload", () => {
 	test("should print preview url if version has preview", async () => {
 		mockGetScript();
 		mockUploadVersion(true);
-		mockGetWorkerSubdomain({ enabled: true });
+		mockGetWorkerSubdomain({ enabled: true, previews_enabled: true });
 		mockSubDomainRequest();
 
 		// Setup
@@ -140,10 +140,10 @@ describe("versions upload", () => {
 		`);
 	});
 
-	it("should not print preview url workers_dev is false", async () => {
+	it("should not print preview url when workers_dev_previews is false", async () => {
 		mockGetScript();
 		mockUploadVersion(true);
-		mockGetWorkerSubdomain({ enabled: false });
+		mockGetWorkerSubdomain({ enabled: true, previews_enabled: false });
 
 		// Setup
 		writeWranglerToml({
diff --git a/packages/wrangler/src/config/config.ts b/packages/wrangler/src/config/config.ts
index fe991c1c49d2d..3ecb4052ed33f 100644
--- a/packages/wrangler/src/config/config.ts
+++ b/packages/wrangler/src/config/config.ts
@@ -355,6 +355,7 @@ export const defaultWranglerConfig: Config = {
 	preserve_file_names: undefined,
 	base_dir: undefined,
 	workers_dev: undefined,
+	workers_dev_previews: true,
 	route: undefined,
 	routes: undefined,
 	tsconfig: undefined,
diff --git a/packages/wrangler/src/config/environment.ts b/packages/wrangler/src/config/environment.ts
index d5663db5ad223..20f7754fbf2dd 100644
--- a/packages/wrangler/src/config/environment.ts
+++ b/packages/wrangler/src/config/environment.ts
@@ -148,6 +148,15 @@ interface EnvironmentInheritable {
 	 */
 	workers_dev: boolean | undefined;
 
+	/**
+	 * Whether we use <version>-<name>.<subdomain>.workers.dev to
+	 * serve Preview URLs for your Worker.
+	 *
+	 * @default `true`
+	 * @inheritable
+	 */
+	workers_dev_previews: boolean | undefined;
+
 	/**
 	 * A list of routes that your Worker should be published to.
 	 * Only one of `routes` or `route` is required.
diff --git a/packages/wrangler/src/config/validation.ts b/packages/wrangler/src/config/validation.ts
index ebd47750cbcee..dda3cdb37e019 100644
--- a/packages/wrangler/src/config/validation.ts
+++ b/packages/wrangler/src/config/validation.ts
@@ -1121,6 +1121,15 @@ function normalizeAndValidateEnvironment(
 		undefined
 	);
 
+	const workers_dev_previews = inheritable(
+		diagnostics,
+		topLevelEnv,
+		rawEnv,
+		"workers_dev_previews",
+		isBoolean,
+		true
+	);
+
 	const { deprecatedUpload, ...build } = normalizeAndValidateBuild(
 		diagnostics,
 		rawEnv,
@@ -1255,6 +1264,7 @@ function normalizeAndValidateEnvironment(
 		placement: normalizeAndValidatePlacement(diagnostics, topLevelEnv, rawEnv),
 		build,
 		workers_dev,
+		workers_dev_previews,
 		// Not inherited fields
 		vars: notInheritable(
 			diagnostics,
diff --git a/packages/wrangler/src/init.ts b/packages/wrangler/src/init.ts
index 9537e2c3f20a4..b2ec6c21bfd02 100644
--- a/packages/wrangler/src/init.ts
+++ b/packages/wrangler/src/init.ts
@@ -140,6 +140,7 @@ type CustomDomainsRes = {
 
 type WorkersDevRes = {
 	enabled: boolean;
+	previews_enabled: boolean;
 };
 type CronTriggersRes = {
 	schedules: [
@@ -945,6 +946,7 @@ async function getWorkerConfig(
 		name: workerName,
 		main: entrypoint,
 		workers_dev: workersDev.enabled,
+		workers_dev_previews: workersDev.previews_enabled,
 		compatibility_date:
 			serviceEnvMetadata.script.compatibility_date ??
 			new Date().toISOString().substring(0, 10),
diff --git a/packages/wrangler/src/triggers/deploy.ts b/packages/wrangler/src/triggers/deploy.ts
index 00064deefc97e..b10d37b280e48 100644
--- a/packages/wrangler/src/triggers/deploy.ts
+++ b/packages/wrangler/src/triggers/deploy.ts
@@ -70,8 +70,12 @@ export default async function triggersDeploy(
 		? `/accounts/${accountId}/workers/services/${scriptName}/environments/${envName}`
 		: `/accounts/${accountId}/workers/scripts/${scriptName}`;
 
-	const { enabled: available_on_subdomain } = await fetchResult<{
+	const {
+		enabled: available_on_subdomain,
+		previews_enabled: previews_available_on_subdomain,
+	} = await fetchResult<{
 		enabled: boolean;
+		previews_enabled: boolean;
 	}>(`${workerUrl}/subdomain`);
 
 	if (!props.dryRun) {
@@ -90,24 +94,35 @@ export default async function triggersDeploy(
 	const uploadMs = Date.now() - start;
 	const deployments: Promise<string[]>[] = [];
 
+	const deploymentInSync = deployToWorkersDev === available_on_subdomain;
+	const previewsInSync =
+		config.workers_dev_previews === previews_available_on_subdomain;
+
 	if (deployToWorkersDev) {
 		// Deploy to a subdomain of `workers.dev`
 		const userSubdomain = await getWorkersDevSubdomain(accountId);
-		const scriptURL =
+
+		const deploymentURL =
 			props.legacyEnv || !props.env
 				? `${scriptName}.${userSubdomain}.workers.dev`
 				: `${envName}.${scriptName}.${userSubdomain}.workers.dev`;
-		if (!available_on_subdomain) {
+
+		if (deploymentInSync && previewsInSync) {
+			deployments.push(Promise.resolve([deploymentURL]));
+		} else {
 			// Enable the `workers.dev` subdomain.
 			deployments.push(
 				fetchResult(`${workerUrl}/subdomain`, {
 					method: "POST",
-					body: JSON.stringify({ enabled: true }),
+					body: JSON.stringify({
+						enabled: true,
+						previews_enabled: config.workers_dev_previews,
+					}),
 					headers: {
 						"Content-Type": "application/json",
 					},
 				})
-					.then(() => [scriptURL])
+					.then(() => [deploymentURL])
 					// Add a delay when the subdomain is first created.
 					// This is to prevent an issue where a negative cache-hit
 					// causes the subdomain to be unavailable for 30 seconds.
@@ -117,73 +132,78 @@ export default async function triggersDeploy(
 						return url;
 					})
 			);
-		} else {
-			deployments.push(Promise.resolve([scriptURL]));
 		}
-	} else {
-		if (available_on_subdomain) {
-			// Disable the workers.dev deployment
-			await fetchResult(`${workerUrl}/subdomain`, {
-				method: "POST",
-				body: JSON.stringify({ enabled: false }),
-				headers: {
-					"Content-Type": "application/json",
-				},
-			});
-		} else if (routes.length !== 0) {
-			// if you get to this point it's because
-			// you're trying to deploy a worker to a custom
-			// domain that's already bound to another worker.
-			// so this thing is about finding workers that have
-			// bindings to the routes you're trying to deploy to.
-			//
-			// the logic is kinda similar (read: duplicated) from publishRoutesFallback,
-			// except here we know we have a good API token or whatever so we don't need
-			// to bother with all the error handling tomfoolery.
-			const routesWithOtherBindings: Record<string, string[]> = {};
-			for (const route of routes) {
-				const zone = await getZoneForRoute({ route, accountId });
-				if (!zone) {
-					continue;
-				}
-
-				const routePattern = typeof route === "string" ? route : route.pattern;
-				const routesInZone = await fetchListResult<{
-					pattern: string;
-					script: string;
-				}>(`/zones/${zone.id}/workers/routes`);
+	}
+	if (!deployToWorkersDev && (!deploymentInSync || !previewsInSync)) {
+		// Disable the workers.dev deployment
+		await fetchResult(`${workerUrl}/subdomain`, {
+			method: "POST",
+			body: JSON.stringify({
+				enabled: false,
+				previews_enabled: config.workers_dev_previews,
+			}),
+			headers: {
+				"Content-Type": "application/json",
+			},
+		});
+	}
+	if (!deployToWorkersDev && deploymentInSync && routes.length !== 0) {
+		// TODO is this true? How does last subdomain status affect route confict??
+		// Why would we only need to validate route conflicts if didn't need to
+		// disable the subdomain deployment?
+
+		// if you get to this point it's because
+		// you're trying to deploy a worker to a route
+		// that's already bound to another worker.
+		// so this thing is about finding workers that have
+		// bindings to the routes you're trying to deploy to.
+		//
+		// the logic is kinda similar (read: duplicated) from publishRoutesFallback,
+		// except here we know we have a good API token or whatever so we don't need
+		// to bother with all the error handling tomfoolery.
+		const routesWithOtherBindings: Record<string, string[]> = {};
+		for (const route of routes) {
+			const zone = await getZoneForRoute({ route, accountId });
+			if (!zone) {
+				continue;
+			}
 
-				routesInZone.forEach(({ script, pattern }) => {
-					if (pattern === routePattern && script !== scriptName) {
-						if (!(script in routesWithOtherBindings)) {
-							routesWithOtherBindings[script] = [];
-						}
+			const routePattern = typeof route === "string" ? route : route.pattern;
+			const routesInZone = await fetchListResult<{
+				pattern: string;
+				script: string;
+			}>(`/zones/${zone.id}/workers/routes`);
 
-						routesWithOtherBindings[script].push(pattern);
+			routesInZone.forEach(({ script, pattern }) => {
+				if (pattern === routePattern && script !== scriptName) {
+					if (!(script in routesWithOtherBindings)) {
+						routesWithOtherBindings[script] = [];
 					}
-				});
-			}
 
-			if (Object.keys(routesWithOtherBindings).length > 0) {
-				let errorMessage =
-					"Can't deploy routes that are assigned to another worker.\n";
-
-				for (const worker in routesWithOtherBindings) {
-					const assignedRoutes = routesWithOtherBindings[worker];
-					errorMessage += `"${worker}" is already assigned to routes:\n${assignedRoutes.map(
-						(r) => `  - ${chalk.underline(r)}\n`
-					)}`;
+					routesWithOtherBindings[script].push(pattern);
 				}
+			});
+		}
 
-				const resolution =
-					"Unassign other workers from the routes you want to deploy to, and then try again.";
-				const dashHref = chalk.blue.underline(
-					`https://dash.cloudflare.com/${accountId}/workers/overview`
-				);
-				const dashLink = `Visit ${dashHref} to unassign a worker from a route.`;
+		if (Object.keys(routesWithOtherBindings).length > 0) {
+			let errorMessage =
+				"Can't deploy routes that are assigned to another worker.\n";
 
-				throw new UserError(`${errorMessage}\n${resolution}\n${dashLink}`);
+			for (const worker in routesWithOtherBindings) {
+				const assignedRoutes = routesWithOtherBindings[worker];
+				errorMessage += `"${worker}" is already assigned to routes:\n${assignedRoutes.map(
+					(r) => `  - ${chalk.underline(r)}\n`
+				)}`;
 			}
+
+			const resolution =
+				"Unassign other workers from the routes you want to deploy to, and then try again.";
+			const dashHref = chalk.blue.underline(
+				`https://dash.cloudflare.com/${accountId}/workers/overview`
+			);
+			const dashLink = `Visit ${dashHref} to unassign a worker from a route.`;
+
+			throw new UserError(`${errorMessage}\n${resolution}\n${dashLink}`);
 		}
 	}
 
diff --git a/packages/wrangler/src/versions/upload.ts b/packages/wrangler/src/versions/upload.ts
index 91fe3472691e3..c895853bf3ffc 100644
--- a/packages/wrangler/src/versions/upload.ts
+++ b/packages/wrangler/src/versions/upload.ts
@@ -566,11 +566,12 @@ See https://developers.cloudflare.com/workers/platform/compatibility-dates for m
 	logger.log("Worker Version ID:", versionId);
 
 	if (versionId && hasPreview) {
-		const { enabled: available_on_subdomain } = await fetchResult<{
-			enabled: boolean;
-		}>(`${workerUrl}/subdomain`);
+		const { previews_enabled: previews_available_on_subdomain } =
+			await fetchResult<{
+				previews_enabled: boolean;
+			}>(`${workerUrl}/subdomain`);
 
-		if (available_on_subdomain) {
+		if (previews_available_on_subdomain) {
 			const userSubdomain = await getWorkersDevSubdomain(accountId);
 			const shortVersion = versionId.slice(0, 8);
 			logger.log(