wrangler 0.0.0-e9ab55a → 0.0.0-e9e9872

package/src/config-cache.ts

@@ -0,0 +1,83 @@
+import { mkdirSync, readFileSync, rmSync, writeFileSync } from "fs";
+import * as path from "path";
+import { findUpSync } from "find-up";
+import isInteractive from "./is-interactive";
+import { logger } from "./logger";
+
+let cacheMessageShown = false;
+
+let __cacheFolder: string | null;
+function getCacheFolder() {
+	if (__cacheFolder || __cacheFolder === null) return __cacheFolder;
+
+	const closestNodeModulesDirectory = findUpSync("node_modules", {
+		type: "directory",
+	});
+	__cacheFolder = closestNodeModulesDirectory
+		? path.join(closestNodeModulesDirectory, ".cache/wrangler")
+		: null;
+
+	if (!__cacheFolder) {
+		logger.debug("No folder available to cache configuration");
+	}
+	return __cacheFolder;
+}
+
+const arrayFormatter = new Intl.ListFormat("en", {
+	style: "long",
+	type: "conjunction",
+});
+
+function showCacheMessage(fields: string[], folder: string) {
+	if (!cacheMessageShown && isInteractive()) {
+		if (fields.length > 0) {
+			logger.log(
+				`Retrieving cached values for ${arrayFormatter.format(
+					fields
+				)} from ${path.relative(process.cwd(), folder)}`
+			);
+			cacheMessageShown = true;
+		}
+	}
+}
+
+export function getConfigCache<T>(fileName: string): Partial<T> {
+	try {
+		const cacheFolder = getCacheFolder();
+		if (cacheFolder) {
+			const configCacheLocation = path.join(cacheFolder, fileName);
+			const configCache = JSON.parse(
+				readFileSync(configCacheLocation, "utf-8")
+			);
+			showCacheMessage(Object.keys(configCache), cacheFolder);
+			return configCache;
+		} else return {};
+	} catch (err) {
+		return {};
+	}
+}
+
+export function saveToConfigCache<T>(
+	fileName: string,
+	newValues: Partial<T>
+): void {
+	const cacheFolder = getCacheFolder();
+	if (cacheFolder) {
+		logger.debug(`Saving to cache: ${JSON.stringify(newValues)}`);
+		const configCacheLocation = path.join(cacheFolder, fileName);
+		const existingValues = getConfigCache(fileName);
+
+		mkdirSync(path.dirname(configCacheLocation), { recursive: true });
+		writeFileSync(
+			configCacheLocation,
+			JSON.stringify({ ...existingValues, ...newValues }, null, 2)
+		);
+	}
+}
+
+export function purgeConfigCaches() {
+	const cacheFolder = getCacheFolder();
+	if (cacheFolder) {
+		rmSync(cacheFolder, { recursive: true, force: true });
+	}
+}

package/src/create-worker-preview.ts

@@ -0,0 +1,255 @@
+import { URL } from "node:url";
+import { fetch } from "undici";
+import { fetchResult } from "./cfetch";
+import { createWorkerUploadForm } from "./create-worker-upload-form";
+import { logger } from "./logger";
+import type { CfAccount, CfWorkerContext, CfWorkerInit } from "./worker";
+
+/**
+ * A Preview Session on the edge
+ */
+export interface CfPreviewSession {
+	/**
+	 * A randomly generated id for this session
+	 */
+	id: string;
+	/**
+	 * A value to use when creating a worker preview under a session
+	 */
+	value: string;
+	/**
+	 * The host where the session is available.
+	 */
+	host: string;
+	/**
+	 * A websocket url to a DevTools inspector.
+	 *
+	 * Workers does not have a fully-featured implementation
+	 * of the Chrome DevTools protocol, but supports the following:
+	 *  * `console.log()` output.
+	 *  * `Error` stack traces.
+	 *  * `fetch()` events.
+	 *
+	 * There is no support for breakpoints, but we want to implement
+	 * this eventually.
+	 *
+	 * @link https://chromedevtools.github.io/devtools-protocol/
+	 */
+	inspectorUrl: URL;
+	/**
+	 * A url to prewarm the preview session.
+	 *
+	 * @example
+	 * fetch(prewarmUrl, { method: 'POST' })
+	 */
+	prewarmUrl: URL;
+}
+
+/**
+ * A preview mode.
+ *
+ * * If true, then using a `workers.dev` subdomain.
+ * * Otherwise, a list of routes under a single zone.
+ */
+type CfPreviewMode = { workers_dev: boolean } | { routes: string[] };
+
+/**
+ * A preview token.
+ */
+export interface CfPreviewToken {
+	/**
+	 * The header value required to trigger a preview.
+	 *
+	 * @example
+	 * const headers = { 'cf-workers-preview-token': value }
+	 * const response = await fetch('https://' + host, { headers })
+	 */
+	value: string;
+	/**
+	 * The host where the preview is available.
+	 */
+	host: string;
+	/**
+	 * A websocket url to a DevTools inspector.
+	 *
+	 * Workers does not have a fully-featured implementation
+	 * of the Chrome DevTools protocol, but supports the following:
+	 *  * `console.log()` output.
+	 *  * `Error` stack traces.
+	 *  * `fetch()` events.
+	 *
+	 * There is no support for breakpoints, but we want to implement
+	 * this eventually.
+	 *
+	 * @link https://chromedevtools.github.io/devtools-protocol/
+	 */
+	inspectorUrl: URL;
+	/**
+	 * A url to prewarm the preview session.
+	 *
+	 * @example
+	 * fetch(prewarmUrl, { method: 'POST',
+	 * 	 headers: {
+	 *     "cf-workers-preview-token": (preview)token.value,
+	 *   }
+	 * })
+	 */
+	prewarmUrl: URL;
+}
+
+// Credit: https://stackoverflow.com/a/2117523
+function randomId(): string {
+	return "xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(/[xy]/g, function (c) {
+		const r = (Math.random() * 16) | 0,
+			v = c == "x" ? r : (r & 0x3) | 0x8;
+		return v.toString(16);
+	});
+}
+
+/**
+ * Generates a preview session token.
+ */
+export async function createPreviewSession(
+	account: CfAccount,
+	ctx: CfWorkerContext,
+	abortSignal: AbortSignal
+): Promise<CfPreviewSession> {
+	const { accountId } = account;
+	const initUrl = ctx.zone
+		? `/zones/${ctx.zone}/workers/edge-preview`
+		: `/accounts/${accountId}/workers/subdomain/edge-preview`;
+
+	const { exchange_url } = await fetchResult<{ exchange_url: string }>(
+		initUrl,
+		undefined,
+		undefined,
+		abortSignal
+	);
+	const { inspector_websocket, prewarm, token } = (await (
+		await fetch(exchange_url, { signal: abortSignal })
+	).json()) as { inspector_websocket: string; token: string; prewarm: string };
+	const { host } = new URL(inspector_websocket);
+	const query = `cf_workers_preview_token=${token}`;
+
+	return {
+		id: randomId(),
+		value: token,
+		host,
+		inspectorUrl: new URL(`${inspector_websocket}?${query}`),
+		prewarmUrl: new URL(prewarm),
+	};
+}
+
+/**
+ * Creates a preview token.
+ */
+async function createPreviewToken(
+	account: CfAccount,
+	worker: CfWorkerInit,
+	ctx: CfWorkerContext,
+	session: CfPreviewSession,
+	abortSignal: AbortSignal
+): Promise<CfPreviewToken> {
+	const { value, host, inspectorUrl, prewarmUrl } = session;
+	const { accountId } = account;
+	const scriptId = worker.name || (ctx.zone ? session.id : host.split(".")[0]);
+	const url =
+		ctx.env && !ctx.legacyEnv
+			? `/accounts/${accountId}/workers/services/${scriptId}/environments/${ctx.env}/edge-preview`
+			: `/accounts/${accountId}/workers/scripts/${scriptId}/edge-preview`;
+
+	const mode: CfPreviewMode = ctx.zone
+		? {
+				routes: ctx.routes
+					? // extract all the route patterns
+					  ctx.routes.map((route) => {
+							if (typeof route === "string") {
+								return route;
+							}
+							if (route.custom_domain) {
+								return `${route.pattern}/*`;
+							}
+							return route.pattern;
+					  })
+					: // if there aren't any patterns, then just match on all routes
+					  ["*/*"],
+		  }
+		: { workers_dev: true };
+
+	const formData = createWorkerUploadForm(worker);
+	formData.set("wrangler-session-config", JSON.stringify(mode));
+
+	const { preview_token } = await fetchResult<{ preview_token: string }>(
+		url,
+		{
+			method: "POST",
+			body: formData,
+			headers: {
+				"cf-preview-upload-config-token": value,
+			},
+		},
+		undefined,
+		abortSignal
+	);
+
+	return {
+		value: preview_token,
+		host:
+			ctx.host ??
+			(worker.name
+				? `${
+						worker.name
+						// TODO: this should also probably have the env prefix
+						// but it doesn't appear to work yet, instead giving us the
+						// "There is nothing here yet" screen
+						// ctx.env && !ctx.legacyEnv
+						//   ? `${ctx.env}.${worker.name}`
+						//   : worker.name
+				  }.${host.split(".").slice(1).join(".")}`
+				: host),
+
+		inspectorUrl,
+		prewarmUrl,
+	};
+}
+
+/**
+ * A stub to create a Cloudflare Worker preview.
+ *
+ * @example
+ * const {value, host} = await createWorker(init, acct);
+ */
+export async function createWorkerPreview(
+	init: CfWorkerInit,
+	account: CfAccount,
+	ctx: CfWorkerContext,
+	session: CfPreviewSession,
+	abortSignal: AbortSignal
+): Promise<CfPreviewToken> {
+	const token = await createPreviewToken(
+		account,
+		init,
+		ctx,
+		session,
+		abortSignal
+	);
+	// fire and forget the prewarm call
+	fetch(token.prewarmUrl.href, {
+		method: "POST",
+		signal: abortSignal,
+		headers: {
+			"cf-workers-preview-token": token.value,
+		},
+	}).then(
+		(response) => {
+			if (!response.ok) {
+				logger.warn("worker failed to prewarm: ", response.statusText);
+			}
+		},
+		(err) => {
+			logger.warn("worker failed to prewarm: ", err);
+		}
+	);
+
+	return token;
+}

package/src/create-worker-upload-form.ts

@@ -0,0 +1,263 @@
+import { readFileSync } from "node:fs";
+import { FormData, File } from "undici";
+import type {
+	CfWorkerInit,
+	CfModuleType,
+	CfDurableObjectMigrations,
+} from "./worker.js";
+
+export function toMimeType(type: CfModuleType): string {
+	switch (type) {
+		case "esm":
+			return "application/javascript+module";
+		case "commonjs":
+			return "application/javascript";
+		case "compiled-wasm":
+			return "application/wasm";
+		case "buffer":
+			return "application/octet-stream";
+		case "text":
+			return "text/plain";
+		default:
+			throw new TypeError("Unsupported module: " + type);
+	}
+}
+
+export interface WorkerMetadata {
+	/** The name of the entry point module. Only exists when the worker is in the ES module format */
+	main_module?: string;
+	/** The name of the entry point module. Only exists when the worker is in the service-worker format */
+	body_part?: string;
+	compatibility_date?: string;
+	compatibility_flags?: string[];
+	usage_model?: "bundled" | "unbound";
+	migrations?: CfDurableObjectMigrations;
+	// If you add any new binding types here, also add it to safeBindings
+	// under validateUnsafeBinding in config/validation.ts
+	bindings: (
+		| { type: "plain_text"; name: string; text: string }
+		| { type: "json"; name: string; json: unknown }
+		| { type: "wasm_module"; name: string; part: string }
+		| { type: "text_blob"; name: string; part: string }
+		| { type: "data_blob"; name: string; part: string }
+		| { type: "kv_namespace"; name: string; namespace_id: string }
+		| {
+				type: "durable_object_namespace";
+				name: string;
+				class_name: string;
+				script_name?: string;
+				environment?: string;
+		  }
+		| { type: "r2_bucket"; name: string; bucket_name: string }
+		| { type: "service"; name: string; service: string; environment?: string }
+		| { type: "namespace"; name: string; namespace: string }
+	)[];
+}
+
+/**
+ * Creates a `FormData` upload from a `CfWorkerInit`.
+ */
+export function createWorkerUploadForm(worker: CfWorkerInit): FormData {
+	const formData = new FormData();
+	const {
+		main,
+		bindings,
+		migrations,
+		usage_model,
+		compatibility_date,
+		compatibility_flags,
+	} = worker;
+
+	let { modules } = worker;
+
+	const metadataBindings: WorkerMetadata["bindings"] = [];
+
+	Object.entries(bindings.vars || {})?.forEach(([key, value]) => {
+		if (typeof value === "string") {
+			metadataBindings.push({ name: key, type: "plain_text", text: value });
+		} else {
+			metadataBindings.push({ name: key, type: "json", json: value });
+		}
+	});
+
+	bindings.kv_namespaces?.forEach(({ id, binding }) => {
+		metadataBindings.push({
+			name: binding,
+			type: "kv_namespace",
+			namespace_id: id,
+		});
+	});
+
+	bindings.durable_objects?.bindings.forEach(
+		({ name, class_name, script_name, environment }) => {
+			metadataBindings.push({
+				name,
+				type: "durable_object_namespace",
+				class_name: class_name,
+				...(script_name && { script_name }),
+				...(environment && { environment }),
+			});
+		}
+	);
+
+	bindings.r2_buckets?.forEach(({ binding, bucket_name }) => {
+		metadataBindings.push({
+			name: binding,
+			type: "r2_bucket",
+			bucket_name,
+		});
+	});
+
+	bindings.services?.forEach(({ binding, service, environment }) => {
+		metadataBindings.push({
+			name: binding,
+			type: "service",
+			service,
+			...(environment && { environment }),
+		});
+	});
+
+	bindings.worker_namespaces?.forEach(({ binding, namespace }) => {
+		metadataBindings.push({
+			name: binding,
+			type: "namespace",
+			namespace,
+		});
+	});
+
+	for (const [name, filePath] of Object.entries(bindings.wasm_modules || {})) {
+		metadataBindings.push({
+			name,
+			type: "wasm_module",
+			part: name,
+		});
+
+		formData.set(
+			name,
+			new File([readFileSync(filePath)], filePath, {
+				type: "application/wasm",
+			})
+		);
+	}
+
+	for (const [name, filePath] of Object.entries(bindings.text_blobs || {})) {
+		metadataBindings.push({
+			name,
+			type: "text_blob",
+			part: name,
+		});
+
+		if (name !== "__STATIC_CONTENT_MANIFEST") {
+			formData.set(
+				name,
+				new File([readFileSync(filePath)], filePath, {
+					type: "text/plain",
+				})
+			);
+		}
+	}
+
+	for (const [name, filePath] of Object.entries(bindings.data_blobs || {})) {
+		metadataBindings.push({
+			name,
+			type: "data_blob",
+			part: name,
+		});
+
+		formData.set(
+			name,
+			new File([readFileSync(filePath)], filePath, {
+				type: "application/octet-stream",
+			})
+		);
+	}
+
+	if (main.type === "commonjs") {
+		// This is a service-worker format worker.
+		for (const module of Object.values([...(modules || [])])) {
+			if (module.name === "__STATIC_CONTENT_MANIFEST") {
+				// Add the manifest to the form data.
+				formData.set(
+					module.name,
+					new File([module.content], module.name, {
+						type: "text/plain",
+					})
+				);
+				// And then remove it from the modules collection
+				modules = modules?.filter((m) => m !== module);
+			} else if (
+				module.type === "compiled-wasm" ||
+				module.type === "text" ||
+				module.type === "buffer"
+			) {
+				// Convert all wasm/text/data modules into `wasm_module`/`text_blob`/`data_blob` bindings.
+				// The "name" of the module is a file path. We use it
+				// to instead be a "part" of the body, and a reference
+				// that we can use inside our source. This identifier has to be a valid
+				// JS identifier, so we replace all non alphanumeric characters
+				// with an underscore.
+				const name = module.name.replace(/[^a-zA-Z0-9_$]/g, "_");
+				metadataBindings.push({
+					name,
+					type:
+						module.type === "compiled-wasm"
+							? "wasm_module"
+							: module.type === "text"
+							? "text_blob"
+							: "data_blob",
+					part: name,
+				});
+
+				// Add the module to the form data.
+				formData.set(
+					name,
+					new File([module.content], module.name, {
+						type:
+							module.type === "compiled-wasm"
+								? "application/wasm"
+								: module.type === "text"
+								? "text/plain"
+								: "application/octet-stream",
+					})
+				);
+				// And then remove it from the modules collection
+				modules = modules?.filter((m) => m !== module);
+			}
+		}
+	}
+
+	if (bindings.unsafe) {
+		// @ts-expect-error unsafe bindings don't need to match a specific type here
+		metadataBindings.push(...bindings.unsafe);
+	}
+
+	const metadata: WorkerMetadata = {
+		...(main.type !== "commonjs"
+			? { main_module: main.name }
+			: { body_part: main.name }),
+		bindings: metadataBindings,
+		...(compatibility_date && { compatibility_date }),
+		...(compatibility_flags && { compatibility_flags }),
+		...(usage_model && { usage_model }),
+		...(migrations && { migrations }),
+	};
+
+	formData.set("metadata", JSON.stringify(metadata));
+
+	if (main.type === "commonjs" && modules && modules.length > 0) {
+		throw new TypeError(
+			"More than one module can only be specified when type = 'esm'"
+		);
+	}
+
+	for (const module of [main].concat(modules || [])) {
+		formData.set(
+			module.name,
+			new File([module.content], module.name, {
+				type: toMimeType(module.type ?? main.type ?? "esm"),
+			})
+		);
+	}
+
+	return formData;
+}

package/src/dev/dev-vars.ts

@@ -0,0 +1,36 @@
+import * as fs from "node:fs";
+import * as path from "node:path";
+import dotenv from "dotenv";
+import { logger } from "../logger";
+import type { Config } from "../config";
+
+/**
+ * Get the Worker `vars` bindings for a `wrangler dev` instance of a Worker.
+ *
+ * The `vars` bindings can be specified in the `wrangler.toml` configuration file.
+ * But "secret" `vars` are usually only provided at the server -
+ * either by creating them in the Dashboard UI, or using the `wrangler secret` command.
+ *
+ * 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`).
+ *
+ * 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"] {
+	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);
+		logger.log(`Using vars defined in ${devVarsRelativePath}`);
+		const devVars = dotenv.parse(fs.readFileSync(devVarsPath, "utf8"));
+		return {
+			...config.vars,
+			...devVars,
+		};
+	} else {
+		return config.vars;
+	}
+}