wrangler 0.0.0-e178d6fb → 0.0.0-e1c2f5b9

package/src/deprecated/index.ts

@@ -0,0 +1,145 @@
+import { DeprecationError } from "../errors";
+import { createCLIParser } from "../index";
+import { logger } from "../logger";
+import { formatMessage } from "../parse";
+import type {
+	CommonYargsOptions,
+	YargsOptionsToInterface,
+} from "../yargs-types";
+import type { Argv, BuilderCallback } from "yargs";
+
+export function buildOptions(yargs: Argv<CommonYargsOptions>) {
+	return yargs;
+}
+type BuildArgs = YargsOptionsToInterface<typeof buildOptions>;
+export async function buildHandler(buildArgs: BuildArgs) {
+	// "[DEPRECATED] 🦀 Build your project (if applicable)",
+
+	const envFlag = buildArgs.env ? ` --env=${buildArgs.env}` : "";
+	logger.log(
+		formatMessage({
+			kind: "warning",
+			text: "Deprecation: `wrangler build` has been deprecated.",
+			notes: [
+				{
+					text: "Please refer to https://developers.cloudflare.com/workers/wrangler/migration/deprecations/#build for more information.",
+				},
+				{
+					text: `Attempting to run \`wrangler publish --dry-run --outdir=dist${envFlag}\` for you instead:`,
+				},
+			],
+		})
+	);
+
+	await createCLIParser([
+		"publish",
+		"--dry-run",
+		"--outdir=dist",
+		...(buildArgs.env ? ["--env", buildArgs.env] : []),
+	]).parse();
+}
+
+export const noOpOptions = () => {};
+export const configHandler = () => {
+	// "🕵️  Authenticate Wrangler with a Cloudflare API Token",
+	throw new DeprecationError(
+		"`wrangler config` has been deprecated, please refer to https://developers.cloudflare.com/workers/wrangler/migration/deprecations/#config for alternatives"
+	);
+};
+
+export function previewOptions(yargs: Argv<CommonYargsOptions>) {
+	return yargs
+		.positional("method", {
+			type: "string",
+			describe: "Type of request to preview your worker",
+		})
+		.positional("body", {
+			type: "string",
+			describe: "Body string to post to your preview worker request.",
+		})
+		.option("watch", {
+			default: true,
+			describe: "Enable live preview",
+			type: "boolean",
+		});
+}
+
+export function previewHandler() {
+	throw new DeprecationError(
+		"The `wrangler preview` command has been deprecated.\n" +
+			"Try using `wrangler dev` to to try out a worker during development.\n"
+	);
+}
+
+export const route: BuilderCallback<unknown, unknown> = (routeYargs: Argv) => {
+	return routeYargs
+		.command(
+			"list",
+			"List the routes associated with a zone",
+			(yargs) => {
+				return yargs
+					.option("zone", {
+						type: "string",
+						requiresArg: true,
+						describe: "Zone id",
+					})
+					.positional("zone", {
+						describe: "Zone id",
+						type: "string",
+					});
+			},
+			() => {
+				// "👯 [DEPRECATED]. Use wrangler.toml to manage routes.
+				const deprecationNotice = "`wrangler route list` has been deprecated.";
+				const futureRoutes =
+					"Refer to wrangler.toml for a list of routes the worker will be deployed to upon publishing.";
+				const presentRoutes =
+					"Refer to the Cloudflare Dashboard to see the routes this worker is currently running on.";
+				throw new DeprecationError(
+					`${deprecationNotice}\n${futureRoutes}\n${presentRoutes}`
+				);
+			}
+		)
+		.command(
+			"delete [id]",
+			"Delete a route associated with a zone",
+			(yargs) => {
+				return yargs
+					.positional("id", {
+						describe: "The hash of the route ID to delete.",
+						type: "string",
+					})
+					.option("zone", {
+						type: "string",
+						requiresArg: true,
+						describe: "zone id",
+					});
+			},
+			() => {
+				// "👯 [DEPRECATED]. Use wrangler.toml to manage routes.
+				const deprecationNotice =
+					"`wrangler route delete` has been deprecated.";
+				const shouldDo =
+					"Remove the unwanted route(s) from wrangler.toml and run `wrangler publish` to remove your worker from those routes.";
+				throw new DeprecationError(`${deprecationNotice}\n${shouldDo}`);
+			}
+		);
+};
+
+export const routeHandler = () => {
+	// "[DEPRECATED]. Use wrangler.toml to manage routes.
+	const deprecationNotice = "`wrangler route` has been deprecated.";
+	const shouldDo =
+		"Please use wrangler.toml and/or `wrangler publish --routes` to modify routes";
+	throw new DeprecationError(`${deprecationNotice}\n${shouldDo}`);
+};
+
+export const subdomainOptions = (yargs: Argv<CommonYargsOptions>) => {
+	return yargs.positional("name", { type: "string" });
+};
+
+export const subdomainHandler = () => {
+	throw new DeprecationError(
+		"`wrangler subdomain` has been deprecated, please refer to https://developers.cloudflare.com/workers/wrangler/migration/deprecations/#subdomain for alternatives"
+	);
+};

package/src/dev/dev-vars.ts

@@ -1,6 +1,5 @@
-import * as fs from "node:fs";
 import * as path from "node:path";
-import dotenv from "dotenv";
+import { loadDotEnv } from "../config";
 import { logger } from "../logger";
 import type { Config } from "../config";
 
@@ -14,21 +13,25 @@ import type { Config } from "../config";
  * It is useful during development, to provide these types of variable locally.
  * When running `wrangler dev` we will look for a file called `.dev.vars`, situated
  * next to the `wrangler.toml` file (or in the current working directory if there is no
- * `wrangler.toml`).
+ * `wrangler.toml`). If the `--env <env>` option is set, we'll first look for
+ * `.dev.vars.<env>`.
  *
  * Any values in this file, formatted like a `dotenv` file, will add to or override `vars`
  * bindings provided in the `wrangler.toml`.
  */
-export function getVarsForDev(config: Config): Config["vars"] {
+export function getVarsForDev(
+	config: Config,
+	env: string | undefined
+): Config["vars"] {
 	const configDir = path.resolve(path.dirname(config.configPath ?? "."));
 	const devVarsPath = path.resolve(configDir, ".dev.vars");
-	if (fs.existsSync(devVarsPath)) {
-		const devVarsRelativePath = path.relative(process.cwd(), devVarsPath);
+	const loaded = loadDotEnv(devVarsPath, env);
+	if (loaded !== undefined) {
+		const devVarsRelativePath = path.relative(process.cwd(), loaded.path);
 		logger.log(`Using vars defined in ${devVarsRelativePath}`);
-		const devVars = dotenv.parse(fs.readFileSync(devVarsPath, "utf8"));
 		return {
 			...config.vars,
-			...devVars,
+			...loaded.parsed,
 		};
 	} else {
 		return config.vars;

package/src/dev/dev.tsx

@@ -1,14 +1,21 @@
 import { spawn } from "node:child_process";
 import * as path from "node:path";
+import * as util from "node:util";
 import { watch } from "chokidar";
 import clipboardy from "clipboardy";
 import commandExists from "command-exists";
 import { Box, Text, useApp, useInput, useStdin } from "ink";
-import React, { useState, useEffect, useRef } from "react";
+import React, { useState, useEffect, useRef, useMemo } from "react";
 import { withErrorBoundary, useErrorHandler } from "react-error-boundary";
 import onExit from "signal-exit";
 import tmp from "tmp-promise";
 import { fetch } from "undici";
+import {
+	getBoundRegisteredWorkers,
+	startWorkerRegistry,
+	stopWorkerRegistry,
+	unregisterWorker,
+} from "../dev-registry";
 import { runCustomBuild } from "../entry";
 import { openInspector } from "../inspect";
 import { logger } from "../logger";
@@ -16,19 +23,98 @@ import openInBrowser from "../open-in-browser";
 import { Local } from "./local";
 import { Remote } from "./remote";
 import { useEsbuild } from "./use-esbuild";
+import { validateDevProps } from "./validate-dev-props";
 import type { Config } from "../config";
 import type { Route } from "../config/environment";
+import type { WorkerRegistry } from "../dev-registry";
 import type { Entry } from "../entry";
-import type { EnablePagesAssetsServiceBindingOptions } from "../miniflare-cli";
+import type { EnablePagesAssetsServiceBindingOptions } from "../miniflare-cli/types";
 import type { AssetPaths } from "../sites";
 import type { CfWorkerInit } from "../worker";
 
+/**
+ * This hooks establishes a connection with the dev registry,
+ * and periodically updates itself with details of workers currently
+ * running a dev session on this system.
+ */
+function useDevRegistry(
+	name: string | undefined,
+	services: Config["services"] | undefined,
+	durableObjects: Config["durable_objects"] | undefined,
+	mode: "local" | "remote"
+): WorkerRegistry {
+	const [workers, setWorkers] = useState<WorkerRegistry>({});
+
+	useEffect(() => {
+		// Let's try to start registry
+		// TODO: we should probably call this in a loop
+		// in case the registry dies elsewhere
+		startWorkerRegistry().catch((err) => {
+			logger.error("failed to start worker registry", err);
+		});
+
+		const interval =
+			// TODO: enable this for remote mode as well
+			// https://github.com/cloudflare/wrangler2/issues/1182
+			mode === "local"
+				? setInterval(() => {
+						getBoundRegisteredWorkers({
+							services,
+							durableObjects,
+						}).then(
+							(boundRegisteredWorkers: WorkerRegistry | undefined) => {
+								setWorkers((prevWorkers) => {
+									if (
+										!util.isDeepStrictEqual(boundRegisteredWorkers, prevWorkers)
+									) {
+										return boundRegisteredWorkers || {};
+									}
+									return prevWorkers;
+								});
+							},
+							(err) => {
+								logger.warn("Failed to get worker definitions", err);
+							}
+						);
+				  }, 300)
+				: undefined;
+
+		return () => {
+			interval && clearInterval(interval);
+			Promise.allSettled([
+				name ? unregisterWorker(name) : Promise.resolve(),
+				stopWorkerRegistry(),
+			]).then(
+				([unregisterResult, stopRegistryResult]) => {
+					if (unregisterResult.status === "rejected") {
+						logger.error(
+							"Failed to unregister worker",
+							unregisterResult.reason
+						);
+					}
+					if (stopRegistryResult.status === "rejected") {
+						logger.error(
+							"Failed to stop worker registry",
+							stopRegistryResult.reason
+						);
+					}
+				},
+				(err) => {
+					logger.error("Failed to clear dev registry effect", err);
+				}
+			);
+		};
+	}, [name, services, durableObjects, mode]);
+
+	return workers;
+}
+
 export type DevProps = {
 	name: string | undefined;
 	noBundle: boolean;
 	entry: Entry;
-	port: number;
-	ip: string;
+	initialPort: number;
+	initialIp: string;
 	inspectorPort: number;
 	rules: Config["rules"];
 	accountId: string | undefined;
@@ -39,13 +125,15 @@ export type DevProps = {
 	upstreamProtocol: "https" | "http";
 	localProtocol: "https" | "http";
 	localUpstream: string | undefined;
-	enableLocalPersistence: boolean;
+	localPersistencePath: string | null;
 	liveReload: boolean;
 	bindings: CfWorkerInit["bindings"];
 	define: Config["define"];
 	crons: Config["triggers"]["crons"];
+	queueConsumers: Config["queues"]["consumers"];
 	isWorkersSite: boolean;
 	assetPaths: AssetPaths | undefined;
+	assetsConfig: Config["assets"];
 	compatibilityDate: string;
 	compatibilityFlags: string[] | undefined;
 	usageModel: "bundled" | "unbound" | undefined;
@@ -58,42 +146,20 @@ export type DevProps = {
 	host: string | undefined;
 	routes: Route[] | undefined;
 	inspect: boolean;
-	logLevel: "none" | "error" | "log" | "warn" | "debug" | undefined;
 	logPrefix?: string;
-	onReady: (() => void) | undefined;
+	onReady: ((ip: string, port: number) => void) | undefined;
 	showInteractiveDevSession: boolean | undefined;
 	forceLocal: boolean | undefined;
 	enablePagesAssetsServiceBinding?: EnablePagesAssetsServiceBindingOptions;
+	firstPartyWorker: boolean | undefined;
+	sendMetrics: boolean | undefined;
+	testScheduled: boolean | undefined;
+	experimentalLocal: boolean | undefined;
+	experimentalLocalRemoteKv: boolean | undefined;
 };
 
 export function DevImplementation(props: DevProps): JSX.Element {
-	if (
-		!props.isWorkersSite &&
-		props.assetPaths &&
-		props.entry.format === "service-worker"
-	) {
-		throw new Error(
-			"You cannot use the service-worker format with an `assets` directory yet. For information on how to migrate to the module-worker format, see: https://developers.cloudflare.com/workers/learning/migrating-to-module-workers/"
-		);
-	}
-
-	if (props.bindings.wasm_modules && props.entry.format === "modules") {
-		throw new Error(
-			"You cannot configure [wasm_modules] with an ES module worker. Instead, import the .wasm module directly in your code"
-		);
-	}
-
-	if (props.bindings.text_blobs && props.entry.format === "modules") {
-		throw new Error(
-			"You cannot configure [text_blobs] with an ES module worker. Instead, import the file directly in your code, and optionally configure `[rules]` in your wrangler.toml"
-		);
-	}
-
-	if (props.bindings.data_blobs && props.entry.format === "modules") {
-		throw new Error(
-			"You cannot configure [data_blobs] with an ES module worker. Instead, import the file directly in your code, and optionally configure `[rules]` in your wrangler.toml"
-		);
-	}
+	validateDevProps(props);
 
 	// only load the UI if we're running in a supported environment
 	const { isRawModeSupported } = useStdin();
@@ -105,25 +171,42 @@ export function DevImplementation(props: DevProps): JSX.Element {
 	);
 }
 
+// This is a nasty hack to allow `useHotkeys` and its "[b] open a browser" feature to read these values
+// without triggering a re-render loop when `onReady()` updates them.
+// The initially requested port can be different than what's actually used, if, for example, you request port 0.
+let ip: string;
+let port: number;
+
 function InteractiveDevSession(props: DevProps) {
 	const toggles = useHotkeys({
 		initial: {
 			local: props.initialMode === "local",
 			tunnel: false,
 		},
-		port: props.port,
-		ip: props.ip,
 		inspectorPort: props.inspectorPort,
 		inspect: props.inspect,
 		localProtocol: props.localProtocol,
 		forceLocal: props.forceLocal,
 	});
 
+	ip = props.initialIp;
+	port = props.initialPort;
+
 	useTunnel(toggles.tunnel);
 
+	const onReady = (newIp: string, newPort: number) => {
+		if (newIp !== props.initialIp || newPort !== props.initialPort) {
+			ip = newIp;
+			port = newPort;
+			if (props.onReady) {
+				props.onReady(newIp, newPort);
+			}
+		}
+	};
+
 	return (
 		<>
-			<DevSession {...props} local={toggles.local} />
+			<DevSession {...props} local={toggles.local} onReady={onReady} />
 			<Box borderStyle="round" paddingLeft={1} paddingRight={1}>
 				<Text bold={true}>[b]</Text>
 				<Text> open a browser, </Text>
@@ -150,12 +233,53 @@ function InteractiveDevSession(props: DevProps) {
 
 type DevSessionProps = DevProps & {
 	local: boolean;
+	experimentalLocal?: boolean;
 };
 
 function DevSession(props: DevSessionProps) {
 	useCustomBuild(props.entry, props.build);
 
 	const directory = useTmpDir();
+	const handleError = useErrorHandler();
+
+	// Note: when D1 is out of beta, this (and all instances of `betaD1Shims`) can be removed.
+	// Additionally, useMemo is used so that new arrays aren't created on every render
+	// cause re-rendering further down.
+	const betaD1Shims = useMemo(
+		() => props.bindings.d1_databases?.map((db) => db.binding),
+		[props.bindings.d1_databases]
+	);
+	const everyD1BindingHasPreview = props.bindings.d1_databases?.every(
+		(binding) => binding.preview_database_id
+	);
+	if (
+		betaD1Shims &&
+		betaD1Shims.length > 0 &&
+		!(props.local || everyD1BindingHasPreview)
+	) {
+		handleError(
+			new Error(
+				"D1 bindings require dev --local or preview_database_id for now"
+			)
+		);
+	}
+
+	// If we are using d1 bindings, and are not bundling the worker
+	// we should error here as the d1 shim won't be added
+	if (Array.isArray(betaD1Shims) && betaD1Shims.length > 0 && props.noBundle) {
+		handleError(
+			new Error(
+				"While in beta, you cannot use D1 bindings without bundling your worker. Please remove `no_bundle` from your wrangler.toml file or remove the `--no-bundle` flag to access D1 bindings."
+			)
+		);
+	}
+
+	const workerDefinitions = useDevRegistry(
+		props.name,
+		props.bindings.services,
+		props.bindings.durable_objects,
+		props.local ? "local" : "remote"
+	);
 
 	const bundle = useEsbuild({
 		entry: props.entry,
@@ -169,10 +293,47 @@ function DevSession(props: DevSessionProps) {
 		tsconfig: props.tsconfig,
 		minify: props.minify,
 		nodeCompat: props.nodeCompat,
+		betaD1Shims,
 		define: props.define,
 		noBundle: props.noBundle,
+		assets: props.assetsConfig,
+		workerDefinitions,
+		services: props.bindings.services,
+		durableObjects: props.bindings.durable_objects || { bindings: [] },
+		firstPartyWorkerDevFacade: props.firstPartyWorker,
+		local: props.local,
+		// Enable the bundling to know whether we are using dev or publish
+		targetConsumer: "dev",
+		testScheduled: props.testScheduled ?? false,
+		experimentalLocal: props.experimentalLocal,
 	});
 
+	// TODO(queues) support remote wrangler dev
+	if (
+		!props.local &&
+		(props.bindings.queues?.length || props.queueConsumers?.length)
+	) {
+		logger.warn(
+			"Queues are currently in Beta and are not supported in wrangler dev remote mode."
+		);
+	}
+
+	const announceAndOnReady: typeof props.onReady = (finalIp, finalPort) => {
+		if (process.send) {
+			process.send(
+				JSON.stringify({
+					event: "DEV_SERVER_READY",
+					ip: finalIp,
+					port: finalPort,
+				})
+			);
+		}
+
+		if (props.onReady) {
+			props.onReady(finalIp, finalPort);
+		}
+	};
+
 	return props.local ? (
 		<Local
 			name={props.name}
@@ -180,23 +341,27 @@ function DevSession(props: DevSessionProps) {
 			format={props.entry.format}
 			compatibilityDate={props.compatibilityDate}
 			compatibilityFlags={props.compatibilityFlags}
+			usageModel={props.usageModel}
 			bindings={props.bindings}
+			workerDefinitions={workerDefinitions}
 			assetPaths={props.assetPaths}
-			isWorkersSite={props.isWorkersSite}
-			port={props.port}
-			ip={props.ip}
+			initialPort={props.initialPort}
+			initialIp={props.initialIp}
 			rules={props.rules}
 			inspectorPort={props.inspectorPort}
-			enableLocalPersistence={props.enableLocalPersistence}
+			localPersistencePath={props.localPersistencePath}
 			liveReload={props.liveReload}
 			crons={props.crons}
+			queueConsumers={props.queueConsumers}
 			localProtocol={props.localProtocol}
 			localUpstream={props.localUpstream}
-			logLevel={props.logLevel}
 			logPrefix={props.logPrefix}
 			inspect={props.inspect}
-			onReady={props.onReady}
+			onReady={announceAndOnReady}
 			enablePagesAssetsServiceBinding={props.enablePagesAssetsServiceBinding}
+			experimentalLocal={props.experimentalLocal}
+			accountId={props.accountId}
+			experimentalLocalRemoteKv={props.experimentalLocalRemoteKv}
 		/>
 	) : (
 		<Remote
@@ -207,8 +372,8 @@ function DevSession(props: DevSessionProps) {
 			bindings={props.bindings}
 			assetPaths={props.assetPaths}
 			isWorkersSite={props.isWorkersSite}
-			port={props.port}
-			ip={props.ip}
+			port={props.initialPort}
+			ip={props.initialIp}
 			localProtocol={props.localProtocol}
 			inspectorPort={props.inspectorPort}
 			// TODO: @threepointone #1167
@@ -222,7 +387,9 @@ function DevSession(props: DevSessionProps) {
 			zone={props.zone}
 			host={props.host}
 			routes={props.routes}
-			onReady={props.onReady}
+			onReady={announceAndOnReady}
+			sourceMapPath={bundle?.sourceMapPath}
+			sendMetrics={props.sendMetrics}
 		/>
 	);
 }
@@ -274,7 +441,7 @@ function useCustomBuild(expectedEntry: Entry, build: Config["build"]): void {
 		}
 
 		return () => {
-			watcher?.close();
+			void watcher?.close();
 		};
 	}, [build, expectedEntry]);
 }
@@ -369,25 +536,16 @@ type useHotkeysInitialState = {
 };
 function useHotkeys(props: {
 	initial: useHotkeysInitialState;
-	port: number;
-	ip: string;
 	inspectorPort: number;
 	inspect: boolean;
 	localProtocol: "http" | "https";
 	forceLocal: boolean | undefined;
 }) {
-	const {
-		initial,
-		port,
-		ip,
-		inspectorPort,
-		inspect,
-		localProtocol,
-		forceLocal,
-	} = props;
+	const { initial, inspectorPort, inspect, localProtocol, forceLocal } = props;
 	// UGH, we should put port in context instead
 	const [toggles, setToggles] = useState(initial);
 	const { exit } = useApp();
+
 	useInput(
 		async (
 			input,
@@ -404,6 +562,10 @@ function useHotkeys(props: {
 					break;
 				// open browser
 				case "b": {
+					if (ip === "0.0.0.0") {
+						await openInBrowser(`${localProtocol}://127.0.0.1:${port}`);
+						return;
+					}
 					await openInBrowser(`${localProtocol}://${ip}:${port}`);
 					break;
 				}

package/src/dev/get-local-persistence-path.tsx

@@ -0,0 +1,31 @@
+import path from "node:path";
+
+export function getLocalPersistencePath(
+	persistTo: string | undefined,
+	doPersist: true,
+	configPath: string | undefined
+): string;
+
+export function getLocalPersistencePath(
+	persistTo: string | undefined,
+	doPersist: boolean,
+	configPath: string | undefined
+): string | null;
+
+export function getLocalPersistencePath(
+	persistTo: string | undefined,
+	doPersist: boolean,
+	configPath: string | undefined
+) {
+	return persistTo
+		? // If path specified, always treat it as relative to cwd()
+		  path.resolve(process.cwd(), persistTo)
+		: doPersist
+		? // If just flagged on, treat it as relative to wrangler.toml,
+		  // if one can be found, otherwise cwd()
+		  path.resolve(
+				configPath ? path.dirname(configPath) : process.cwd(),
+				".wrangler/state"
+		  )
+		: null;
+}