wrangler 2.0.19 → 2.0.23

package/src/dev.tsx

@@ -22,10 +22,12 @@ import {
 	getDevCompatibilityDate,
 	getRules,
 	isLegacyEnv,
+	DEFAULT_INSPECTOR_PORT,
 } from "./index";
 
 import type { Config } from "./config";
 import type { Route } from "./config/environment";
+import type { EnablePagesAssetsServiceBindingOptions } from "./miniflare-cli";
 import type { CfWorkerInit } from "./worker";
 import type { RequestInit } from "undici";
 import type { Argv, ArgumentsCamelCase } from "yargs";
@@ -63,8 +65,10 @@ interface DevArgs {
 	minify?: boolean;
 	"node-compat"?: boolean;
 	"experimental-enable-local-persistence"?: boolean;
+	"live-reload"?: boolean;
 	onReady?: () => void;
 	logLevel?: "none" | "error" | "log" | "warn" | "debug";
+	logPrefix?: string;
 	showInteractiveDevSession?: boolean;
 }
 
@@ -225,6 +229,12 @@ export function devOptions(yargs: Argv): Argv<DevArgs> {
 				describe: "Enable persistence for this session (only for local mode)",
 				type: "boolean",
 			})
+			.option("live-reload", {
+				// TODO: Add back in once we have remote `--live-reload`
+				hidden: true,
+				// describe: "Auto reload HTML pages when change is detected",
+				type: "boolean",
+			})
 			.option("inspect", {
 				describe: "Enable dev tools",
 				type: "boolean",
@@ -250,7 +260,28 @@ export async function devHandler(args: ArgumentsCamelCase<DevArgs>) {
 	}
 }
 
-export async function startDev(args: ArgumentsCamelCase<DevArgs>) {
+type StartDevOptions = ArgumentsCamelCase<DevArgs> & {
+	// These options can be passed in directly when called with the `wrangler.dev()` API.
+	// They aren't exposed as CLI arguments.
+	vars?: {
+		[key: string]: unknown;
+	};
+	kv?: {
+		binding: string;
+		id: string;
+		preview_id?: string;
+	}[];
+	durableObjects?: {
+		name: string;
+		class_name: string;
+		script_name?: string | undefined;
+		environment?: string | undefined;
+	}[];
+	forceLocal?: boolean;
+	enablePagesAssetsServiceBinding?: EnablePagesAssetsServiceBindingOptions;
+};
+
+export async function startDev(args: StartDevOptions) {
 	let watcher: ReturnType<typeof watch> | undefined;
 	let rerender: (node: React.ReactNode) => void | undefined;
 	try {
@@ -265,7 +296,7 @@ export async function startDev(args: ArgumentsCamelCase<DevArgs>) {
 			((args.script &&
 				findWranglerToml(path.dirname(args.script))) as ConfigPath);
 		let config = readConfig(configPath, args);
-		metrics.sendMetricsEvent(
+		await metrics.sendMetricsEvent(
 			"run dev",
 			{ local: args.local },
 			{ sendMetrics: config.send_metrics, offline: args.local }
@@ -351,6 +382,10 @@ export async function startDev(args: ArgumentsCamelCase<DevArgs>) {
 		const routes: Route[] | undefined =
 			args.routes || (config.route && [config.route]) || config.routes;
 
+		if (args.forceLocal) {
+			args.local = true;
+		}
+
 		if (!args.local) {
 			if (host) {
 				zoneId = await getZoneIdFromHost(host);
@@ -370,7 +405,7 @@ export async function startDev(args: ArgumentsCamelCase<DevArgs>) {
 			}
 		}
 
-		const nodeCompat = args["node-compat"] ?? config.node_compat;
+		const nodeCompat = args.nodeCompat ?? config.node_compat;
 		if (nodeCompat) {
 			logger.warn(
 				"Enabling node.js compatibility mode for built-ins and globals. This is experimental and has serious tradeoffs. Please see https://github.com/ionic-team/rollup-plugin-node-polyfills/ for more details."
@@ -382,33 +417,44 @@ export async function startDev(args: ArgumentsCamelCase<DevArgs>) {
 			configParam: Config
 		): Promise<CfWorkerInit["bindings"]> {
 			return {
-				kv_namespaces: configParam.kv_namespaces?.map(
-					({ binding, preview_id, id: _id }) => {
-						// In `dev`, we make folks use a separate kv namespace called
-						// `preview_id` instead of `id` so that they don't
-						// break production data. So here we check that a `preview_id`
-						// has actually been configured.
-						// This whole block of code will be obsoleted in the future
-						// when we have copy-on-write for previews on edge workers.
-						if (!preview_id) {
-							// TODO: This error has to be a _lot_ better, ideally just asking
-							// to create a preview namespace for the user automatically
-							throw new Error(
-								`In development, you should use a separate kv namespace than the one you'd use in production. Please create a new kv namespace with "wrangler kv:namespace create <name> --preview" and add its id as preview_id to the kv_namespace "${binding}" in your wrangler.toml`
-							); // Ugh, I really don't like this message very much
+				kv_namespaces: [
+					...(configParam.kv_namespaces || []).map(
+						({ binding, preview_id, id: _id }) => {
+							// In `dev`, we make folks use a separate kv namespace called
+							// `preview_id` instead of `id` so that they don't
+							// break production data. So here we check that a `preview_id`
+							// has actually been configured.
+							// This whole block of code will be obsoleted in the future
+							// when we have copy-on-write for previews on edge workers.
+							if (!preview_id) {
+								// TODO: This error has to be a _lot_ better, ideally just asking
+								// to create a preview namespace for the user automatically
+								throw new Error(
+									`In development, you should use a separate kv namespace than the one you'd use in production. Please create a new kv namespace with "wrangler kv:namespace create <name> --preview" and add its id as preview_id to the kv_namespace "${binding}" in your wrangler.toml`
+								); // Ugh, I really don't like this message very much
+							}
+							return {
+								binding,
+								id: preview_id,
+							};
 						}
-						return {
-							binding,
-							id: preview_id,
-						};
-					}
-				),
+					),
+					...(args.kv || []),
+				],
 				// Use a copy of combinedVars since we're modifying it later
-				vars: getVarsForDev(configParam),
+				vars: {
+					...getVarsForDev(configParam),
+					...args.vars,
+				},
 				wasm_modules: configParam.wasm_modules,
 				text_blobs: configParam.text_blobs,
 				data_blobs: configParam.data_blobs,
-				durable_objects: configParam.durable_objects,
+				durable_objects: {
+					bindings: [
+						...(configParam.durable_objects || { bindings: [] }).bindings,
+						...(args.durableObjects || []),
+					],
+				},
 				r2_buckets: configParam.r2_buckets?.map(
 					({ binding, preview_bucket_name, bucket_name: _bucket_name }) => {
 						// same idea as kv namespace preview id,
@@ -431,7 +477,7 @@ export async function startDev(args: ArgumentsCamelCase<DevArgs>) {
 		}
 
 		const getLocalPort = memoizeGetPort(DEFAULT_LOCAL_PORT);
-		const getInspectorPort = memoizeGetPort(9229);
+		const getInspectorPort = memoizeGetPort(DEFAULT_INSPECTOR_PORT);
 
 		// eslint-disable-next-line no-inner-declarations
 		async function getDevReactElement(configParam: Config) {
@@ -483,16 +529,21 @@ export async function startDev(args: ArgumentsCamelCase<DevArgs>) {
 					jsxFragment={args["jsx-fragment"] || config.jsx_fragment}
 					tsconfig={args.tsconfig ?? config.tsconfig}
 					upstreamProtocol={upstreamProtocol}
-					localProtocol={args["local-protocol"] || config.dev.local_protocol}
+					localProtocol={args.localProtocol || config.dev.local_protocol}
 					localUpstream={args["local-upstream"] || host}
 					enableLocalPersistence={
-						args["experimental-enable-local-persistence"] || false
+						args.experimentalEnableLocalPersistence || false
 					}
+					liveReload={args.liveReload || false}
 					accountId={config.account_id || getAccountFromCache()?.id}
 					assetPaths={assetPaths}
 					port={args.port || config.dev.port || (await getLocalPort())}
 					ip={args.ip || config.dev.ip}
-					inspectorPort={args["inspector-port"] ?? (await getInspectorPort())}
+					inspectorPort={
+						args["inspector-port"] ||
+						config.dev.inspector_port ||
+						(await getInspectorPort())
+					}
 					isWorkersSite={Boolean(args.site || config.site)}
 					compatibilityDate={getDevCompatibilityDate(
 						config,
@@ -505,9 +556,12 @@ export async function startDev(args: ArgumentsCamelCase<DevArgs>) {
 					bindings={bindings}
 					crons={config.triggers.crons}
 					logLevel={args.logLevel}
+					logPrefix={args.logPrefix}
 					onReady={args.onReady}
-					inspect={args.inspect}
+					inspect={args.inspect ?? true}
 					showInteractiveDevSession={args.showInteractiveDevSession}
+					forceLocal={args.forceLocal}
+					enablePagesAssetsServiceBinding={args.enablePagesAssetsServiceBinding}
 				/>
 			);
 		}

package/src/index.tsx

@@ -76,6 +76,7 @@ export type ConfigPath = string | undefined;
 const resetColor = "\x1b[0m";
 const fgGreenColor = "\x1b[32m";
 export const DEFAULT_LOCAL_PORT = 8787;
+export const DEFAULT_INSPECTOR_PORT = 9229;
 
 const proxy =
 	process.env.https_proxy ||
@@ -258,11 +259,22 @@ function createCLIParser(argv: string[]) {
 		["*"],
 		false,
 		() => {},
-		(args) => {
+		async (args) => {
 			if (args._.length > 0) {
 				throw new CommandLineArgsError(`Unknown command: ${args._}.`);
 			} else {
-				wrangler.showHelp("log");
+				// args.v will exist and be true in the case that no command is called, and the -v
+				// option is present. This is to allow for running asynchronous printWranglerBanner
+				// in the version command.
+				if (args.v) {
+					if (process.stdout.isTTY) {
+						await printWranglerBanner();
+					} else {
+						logger.log(wranglerVersion);
+					}
+				} else {
+					wrangler.showHelp("log");
+				}
 			}
 		}
 	);
@@ -501,7 +513,7 @@ function createCLIParser(argv: string[]) {
 				(args.config as ConfigPath) ||
 				(args.script && findWranglerToml(path.dirname(args.script)));
 			const config = readConfig(configPath, args);
-			metrics.sendMetricsEvent("deploy worker script", {
+			await metrics.sendMetricsEvent("deploy worker script", {
 				sendMetrics: config.send_metrics,
 			});
 			const entry = await getEntry(args, config, "publish");
@@ -644,7 +656,7 @@ function createCLIParser(argv: string[]) {
 				await printWranglerBanner();
 			}
 			const config = readConfig(args.config as ConfigPath, args);
-			metrics.sendMetricsEvent("begin log stream", {
+			await metrics.sendMetricsEvent("begin log stream", {
 				sendMetrics: config.send_metrics,
 			});
 
@@ -692,7 +704,7 @@ function createCLIParser(argv: string[]) {
 			onExit(async () => {
 				tail.terminate();
 				await deleteTail();
-				metrics.sendMetricsEvent("end log stream", {
+				await metrics.sendMetricsEvent("end log stream", {
 					sendMetrics: config.send_metrics,
 				});
 			});
@@ -711,7 +723,7 @@ function createCLIParser(argv: string[]) {
 						await setTimeout(100);
 						break;
 					case tail.CLOSED:
-						metrics.sendMetricsEvent("end log stream", {
+						await metrics.sendMetricsEvent("end log stream", {
 							sendMetrics: config.send_metrics,
 						});
 						throw new Error(
@@ -727,7 +739,7 @@ function createCLIParser(argv: string[]) {
 			tail.on("close", async () => {
 				tail.terminate();
 				await deleteTail();
-				metrics.sendMetricsEvent("end log stream", {
+				await metrics.sendMetricsEvent("end log stream", {
 					sendMetrics: config.send_metrics,
 				});
 			});
@@ -960,7 +972,7 @@ function createCLIParser(argv: string[]) {
 
 						try {
 							await submitSecret();
-							metrics.sendMetricsEvent("create encrypted variable", {
+							await metrics.sendMetricsEvent("create encrypted variable", {
 								sendMetrics: config.send_metrics,
 							});
 						} catch (e) {
@@ -1035,7 +1047,7 @@ function createCLIParser(argv: string[]) {
 									: `/accounts/${accountId}/workers/services/${scriptName}/environments/${args.env}/secrets`;
 
 							await fetchResult(`${url}/${args.key}`, { method: "DELETE" });
-							metrics.sendMetricsEvent("delete encrypted variable", {
+							await metrics.sendMetricsEvent("delete encrypted variable", {
 								sendMetrics: config.send_metrics,
 							});
 							logger.log(`✨ Success! Deleted secret ${args.key}`);
@@ -1078,7 +1090,7 @@ function createCLIParser(argv: string[]) {
 								: `/accounts/${accountId}/workers/services/${scriptName}/environments/${args.env}/secrets`;
 
 						logger.log(JSON.stringify(await fetchResult(url), null, "  "));
-						metrics.sendMetricsEvent("list encrypted variables", {
+						await metrics.sendMetricsEvent("list encrypted variables", {
 							sendMetrics: config.send_metrics,
 						});
 					}
@@ -1142,7 +1154,7 @@ function createCLIParser(argv: string[]) {
 
 						logger.log(`🌀 Creating namespace with title "${title}"`);
 						const namespaceId = await createKVNamespace(accountId, title);
-						metrics.sendMetricsEvent("create kv namespace", {
+						await metrics.sendMetricsEvent("create kv namespace", {
 							sendMetrics: config.send_metrics,
 						});
 
@@ -1173,7 +1185,7 @@ function createCLIParser(argv: string[]) {
 						logger.log(
 							JSON.stringify(await listKVNamespaces(accountId), null, "  ")
 						);
-						metrics.sendMetricsEvent("list kv namespaces", {
+						await metrics.sendMetricsEvent("list kv namespaces", {
 							sendMetrics: config.send_metrics,
 						});
 					}
@@ -1220,8 +1232,10 @@ function createCLIParser(argv: string[]) {
 
 						const accountId = await requireAuth(config);
 
+						logger.log(`Deleting KV namespace ${id}.`);
 						await deleteKVNamespace(accountId, id);
-						metrics.sendMetricsEvent("delete kv namespace", {
+						logger.log(`Deleted KV namespace ${id}.`);
+						await metrics.sendMetricsEvent("delete kv namespace", {
 							sendMetrics: config.send_metrics,
 						});
 
@@ -1347,7 +1361,7 @@ function createCLIParser(argv: string[]) {
 							expiration_ttl: ttl,
 							metadata: metadata as KeyValue["metadata"],
 						});
-						metrics.sendMetricsEvent("write kv key-value", {
+						await metrics.sendMetricsEvent("write kv key-value", {
 							sendMetrics: config.send_metrics,
 						});
 					}
@@ -1399,7 +1413,7 @@ function createCLIParser(argv: string[]) {
 							prefix
 						);
 						logger.log(JSON.stringify(results, undefined, 2));
-						metrics.sendMetricsEvent("list kv keys", {
+						await metrics.sendMetricsEvent("list kv keys", {
 							sendMetrics: config.send_metrics,
 						});
 					}
@@ -1462,7 +1476,7 @@ function createCLIParser(argv: string[]) {
 						} else {
 							process.stdout.write(bufferKVValue);
 						}
-						metrics.sendMetricsEvent("read kv value", {
+						await metrics.sendMetricsEvent("read kv value", {
 							sendMetrics: config.send_metrics,
 						});
 					}
@@ -1511,7 +1525,7 @@ function createCLIParser(argv: string[]) {
 						const accountId = await requireAuth(config);
 
 						await deleteKVKeyValue(accountId, namespaceId, key);
-						metrics.sendMetricsEvent("delete kv key-value", {
+						await metrics.sendMetricsEvent("delete kv key-value", {
 							sendMetrics: config.send_metrics,
 						});
 					}
@@ -1618,7 +1632,7 @@ function createCLIParser(argv: string[]) {
 
 						const accountId = await requireAuth(config);
 						await putKVBulkKeyValue(accountId, namespaceId, content);
-						metrics.sendMetricsEvent("write kv key-values (bulk)", {
+						await metrics.sendMetricsEvent("write kv key-values (bulk)", {
 							sendMetrics: config.send_metrics,
 						});
 
@@ -1711,7 +1725,7 @@ function createCLIParser(argv: string[]) {
 						const accountId = await requireAuth(config);
 
 						await deleteKVBulkKeyValue(accountId, namespaceId, content);
-						metrics.sendMetricsEvent("delete kv key-values (bulk)", {
+						await metrics.sendMetricsEvent("delete kv key-values (bulk)", {
 							sendMetrics: config.send_metrics,
 						});
 
@@ -1753,7 +1767,7 @@ function createCLIParser(argv: string[]) {
 						logger.log(`Creating bucket ${args.name}.`);
 						await createR2Bucket(accountId, args.name);
 						logger.log(`Created bucket ${args.name}.`);
-						metrics.sendMetricsEvent("create r2 bucket", {
+						await metrics.sendMetricsEvent("create r2 bucket", {
 							sendMetrics: config.send_metrics,
 						});
 					}
@@ -1765,7 +1779,7 @@ function createCLIParser(argv: string[]) {
 					const accountId = await requireAuth(config);
 
 					logger.log(JSON.stringify(await listR2Buckets(accountId), null, 2));
-					metrics.sendMetricsEvent("list r2 buckets", {
+					await metrics.sendMetricsEvent("list r2 buckets", {
 						sendMetrics: config.send_metrics,
 					});
 				});
@@ -1790,7 +1804,7 @@ function createCLIParser(argv: string[]) {
 						logger.log(`Deleting bucket ${args.name}.`);
 						await deleteR2Bucket(accountId, args.name);
 						logger.log(`Deleted bucket ${args.name}.`);
-						metrics.sendMetricsEvent("delete r2 bucket", {
+						await metrics.sendMetricsEvent("delete r2 bucket", {
 							sendMetrics: config.send_metrics,
 						});
 					}
@@ -1862,7 +1876,7 @@ function createCLIParser(argv: string[]) {
 			}
 			await login();
 			const config = readConfig(args.config as ConfigPath, args);
-			metrics.sendMetricsEvent("login user", {
+			await metrics.sendMetricsEvent("login user", {
 				sendMetrics: config.send_metrics,
 			});
 
@@ -1882,7 +1896,7 @@ function createCLIParser(argv: string[]) {
 			await printWranglerBanner();
 			await logout();
 			const config = readConfig(undefined, {});
-			metrics.sendMetricsEvent("logout user", {
+			await metrics.sendMetricsEvent("logout user", {
 				sendMetrics: config.send_metrics,
 			});
 		}
@@ -1897,12 +1911,35 @@ function createCLIParser(argv: string[]) {
 			await printWranglerBanner();
 			await whoami();
 			const config = readConfig(undefined, {});
-			metrics.sendMetricsEvent("view accounts", {
+			await metrics.sendMetricsEvent("view accounts", {
 				sendMetrics: config.send_metrics,
 			});
 		}
 	);
 
+	// This set to false to allow overwrite of default behaviour
+	wrangler.version(false);
+
+	// version
+	wrangler.command(
+		"version",
+		false,
+		() => {},
+		async () => {
+			if (process.stdout.isTTY) {
+				await printWranglerBanner();
+			} else {
+				logger.log(wranglerVersion);
+			}
+		}
+	);
+
+	wrangler.option("v", {
+		describe: "Show version number",
+		alias: "version",
+		type: "boolean",
+	});
+
 	wrangler.option("config", {
 		alias: "c",
 		describe: "Path to .toml configuration file",
@@ -1912,7 +1949,7 @@ function createCLIParser(argv: string[]) {
 
 	wrangler.group(["config", "help", "version"], "Flags:");
 	wrangler.help().alias("h", "help");
-	wrangler.version(wranglerVersion).alias("v", "version");
+
 	wrangler.exitProcess(false);
 
 	return wrangler;

package/src/metrics/is-ci.ts

@@ -0,0 +1,14 @@
+import isCI from "is-ci";
+
+/**
+ * Use this object to find out if we are currently running in a continuous integration environment.
+ *
+ * The isCI constant imported above cannot be easily mocked for testing.
+ * By wrapping this up in a method on an object, it results in clean and testable code.
+ */
+export const CI = {
+	/** Is Wrangler currently running in a CI? */
+	isCI() {
+		return isCI;
+	},
+};

package/src/metrics/metrics-config.ts

@@ -1,13 +1,15 @@
 import { randomUUID } from "node:crypto";
-import { mkdir, readFile, writeFile } from "node:fs/promises";
+import { readFileSync, mkdirSync, writeFileSync } from "node:fs";
 import os from "node:os";
 import path from "node:path";
 import { fetchResult } from "../cfetch";
 import { getConfigCache, saveToConfigCache } from "../config-cache";
 import { confirm } from "../dialogs";
+import { getEnvironmentVariableFactory } from "../environment-variables";
 import isInteractive from "../is-interactive";
 import { logger } from "../logger";
 import { getAPIToken } from "../user";
+import { CI } from "./is-ci";
 
 /**
  * The date that the metrics being gathered was last updated in a way that would require
@@ -21,6 +23,10 @@ import { getAPIToken } from "../user";
 export const CURRENT_METRICS_DATE = new Date(2022, 6, 4);
 export const USER_ID_CACHE_PATH = "user-id.json";
 
+export const getWranglerSendMetricsFromEnv = getEnvironmentVariableFactory({
+	variableName: "WRANGLER_SEND_METRICS",
+});
+
 export interface MetricsConfigOptions {
 	/**
 	 * Defines whether to send metrics to Cloudflare:
@@ -66,10 +72,21 @@ export async function getMetricsConfig({
 	sendMetrics,
 	offline = false,
 }: MetricsConfigOptions): Promise<MetricsConfig> {
-	const config = await readMetricsConfig();
-	const deviceId = await getDeviceId(config);
+	const config = readMetricsConfig();
+	const deviceId = getDeviceId(config);
 	const userId = await getUserId(offline);
 
+	// If the WRANGLER_SEND_METRICS environment variable has been set use that
+	// and ignore everything else.
+	const sendMetricsEnv = getWranglerSendMetricsFromEnv();
+	if (sendMetricsEnv !== undefined) {
+		return {
+			enabled: sendMetricsEnv.toLowerCase() === "true",
+			deviceId,
+			userId,
+		};
+	}
+
 	// If the project is explicitly set the `send_metrics` options in `wrangler.toml`
 	// then use that and ignore any user preference.
 	if (sendMetrics !== undefined) {
@@ -89,8 +106,8 @@ export async function getMetricsConfig({
 	}
 
 	// We couldn't get the metrics permission from the project-level nor the user-level config.
-	// If we are not interactive then just bail out.
-	if (!isInteractive()) {
+	// If we are not interactive or in a CI build then just bail out.
+	if (!isInteractive() || CI.isCI()) {
 		return { enabled: false, deviceId, userId };
 	}
 
@@ -107,7 +124,7 @@ export async function getMetricsConfig({
 			"   - to disable sending metrics for a project: `send_metrics = false`\n" +
 			"   - to enable sending metrics for a project: `send_metrics = true`"
 	);
-	await writeMetricsConfig({
+	writeMetricsConfig({
 		permission: {
 			enabled,
 			date: CURRENT_METRICS_DATE,
@@ -120,9 +137,9 @@ export async function getMetricsConfig({
 /**
  * Stringify and write the given info to the metrics config file.
  */
-export async function writeMetricsConfig(config: MetricsConfigFile) {
-	await mkdir(path.dirname(getMetricsConfigPath()), { recursive: true });
-	await writeFile(
+export function writeMetricsConfig(config: MetricsConfigFile) {
+	mkdirSync(path.dirname(getMetricsConfigPath()), { recursive: true });
+	writeFileSync(
 		getMetricsConfigPath(),
 		JSON.stringify(
 			config,
@@ -135,11 +152,11 @@ export async function writeMetricsConfig(config: MetricsConfigFile) {
 /**
  * Read and parse the metrics config file.
  */
-export async function readMetricsConfig(): Promise<MetricsConfigFile> {
+export function readMetricsConfig(): MetricsConfigFile {
 	try {
-		return JSON.parse(
-			await readFile(getMetricsConfigPath(), "utf8"),
-			(key, value) => (key === "date" ? new Date(value) : value)
+		const config = readFileSync(getMetricsConfigPath(), "utf8");
+		return JSON.parse(config, (key, value) =>
+			key === "date" ? new Date(value) : value
 		);
 	} catch {
 		return {};
@@ -172,12 +189,12 @@ export interface MetricsConfigFile {
  *
  * Once created this ID is stored in the metrics config file.
  */
-async function getDeviceId(config: MetricsConfigFile) {
+function getDeviceId(config: MetricsConfigFile) {
 	// Get or create the deviceId.
 	const deviceId = config.deviceId ?? randomUUID();
 	if (config.deviceId === undefined) {
 		// We had to create a new deviceID so store it now.
-		await writeMetricsConfig({ ...config, deviceId });
+		writeMetricsConfig({ ...config, deviceId });
 	}
 	return deviceId;
 }

package/src/metrics/metrics-dispatcher.ts

@@ -47,6 +47,8 @@ export async function getMetricsDispatcher(options: MetricsConfigOptions) {
 		}
 
 		// Lazily get the config for this dispatcher only when an event is being dispatched.
+		// We must await this since it might trigger user interaction that would break other UI
+		// in Wrangler if it was allowed to run in parallel.
 		const metricsConfig = await getMetricsConfig(options);
 		if (!metricsConfig.enabled) {
 			logger.debug(
@@ -57,36 +59,36 @@ export async function getMetricsDispatcher(options: MetricsConfigOptions) {
 			return;
 		}
 
-		try {
-			logger.debug(`Metrics dispatcher: Posting data ${JSON.stringify(event)}`);
-			const body = JSON.stringify({
-				deviceId: metricsConfig.deviceId,
-				userId: metricsConfig.userId,
-				event: event.name,
-				properties: {
-					category: "Workers",
-					wranglerVersion,
-					...event.properties,
-				},
-			});
+		logger.debug(`Metrics dispatcher: Posting data ${JSON.stringify(event)}`);
+		const body = JSON.stringify({
+			deviceId: metricsConfig.deviceId,
+			userId: metricsConfig.userId,
+			event: event.name,
+			properties: {
+				category: "Workers",
+				wranglerVersion,
+				...event.properties,
+			},
+		});
 
-			await fetch(`${SPARROW_URL}/api/v1/${event.type}`, {
-				method: "POST",
-				headers: {
-					Accept: "*/*",
-					"Content-Type": "application/json",
-					"Sparrow-Source-Key": SPARROW_SOURCE_KEY,
-				},
-				mode: "cors",
-				keepalive: true,
-				body,
-			});
-		} catch (e) {
+		// Do not await this fetch call.
+		// Just fire-and-forget, otherwise we might slow down the rest of Wrangler.
+		fetch(`${SPARROW_URL}/api/v1/${event.type}`, {
+			method: "POST",
+			headers: {
+				Accept: "*/*",
+				"Content-Type": "application/json",
+				"Sparrow-Source-Key": SPARROW_SOURCE_KEY,
+			},
+			mode: "cors",
+			keepalive: true,
+			body,
+		}).catch((e) => {
 			logger.debug(
 				"Metrics dispatcher: Failed to send request:",
 				(e as Error).message
 			);
-		}
+		});
 	}
 }