wrangler 0.0.0-e1c615f → 0.0.0-e1e2ee5c

package/src/pages/build.tsx

@@ -0,0 +1,204 @@
+import { writeFileSync } from "node:fs";
+import { tmpdir } from "node:os";
+import { dirname, join } from "node:path";
+import { logger } from "../logger";
+import * as metrics from "../metrics";
+import { toUrlPath } from "../paths";
+import { isInPagesCI } from "./constants";
+import { buildPlugin } from "./functions/buildPlugin";
+import { buildWorker } from "./functions/buildWorker";
+import { generateConfigFromFileTree } from "./functions/filepath-routing";
+import { writeRoutesModule } from "./functions/routes";
+import { pagesBetaWarning, RUNNING_BUILDERS } from "./utils";
+import type { Config } from "./functions/routes";
+import type { ArgumentsCamelCase, Argv } from "yargs";
+
+type PagesBuildArgs = {
+	directory: string;
+	outfile: string;
+	"output-config-path"?: string;
+	minify: boolean;
+	sourcemap: boolean;
+	"fallback-service": string;
+	watch: boolean;
+	plugin: boolean;
+	"build-output-directory"?: string;
+	"node-compat": boolean;
+};
+
+export function Options(yargs: Argv): Argv<PagesBuildArgs> {
+	return yargs
+		.positional("directory", {
+			type: "string",
+			default: "functions",
+			description: "The directory of Pages Functions",
+		})
+		.options({
+			outfile: {
+				type: "string",
+				default: "_worker.js",
+				description: "The location of the output Worker script",
+			},
+			"output-config-path": {
+				type: "string",
+				description: "The location for the output config file",
+			},
+			minify: {
+				type: "boolean",
+				default: false,
+				description: "Minify the output Worker script",
+			},
+			sourcemap: {
+				type: "boolean",
+				default: false,
+				description: "Generate a sourcemap for the output Worker script",
+			},
+			"fallback-service": {
+				type: "string",
+				default: "ASSETS",
+				description:
+					"The service to fallback to at the end of the `next` chain. Setting to '' will fallback to the global `fetch`.",
+			},
+			watch: {
+				type: "boolean",
+				default: false,
+				description:
+					"Watch for changes to the functions and automatically rebuild the Worker script",
+			},
+			plugin: {
+				type: "boolean",
+				default: false,
+				description: "Build a plugin rather than a Worker script",
+			},
+			"build-output-directory": {
+				type: "string",
+				description: "The directory to output static assets to",
+			},
+			"node-compat": {
+				describe: "Enable node.js compatibility",
+				default: false,
+				type: "boolean",
+				hidden: true,
+			},
+		})
+		.epilogue(pagesBetaWarning);
+}
+
+export const Handler = async ({
+	directory,
+	outfile,
+	"output-config-path": outputConfigPath,
+	minify,
+	sourcemap,
+	fallbackService,
+	watch,
+	plugin,
+	"build-output-directory": buildOutputDirectory,
+	"node-compat": nodeCompat,
+}: ArgumentsCamelCase<PagesBuildArgs>) => {
+	if (!isInPagesCI) {
+		// Beta message for `wrangler pages <commands>` usage
+		logger.log(pagesBetaWarning);
+	}
+
+	if (nodeCompat) {
+		console.warn(
+			"Enabling node.js compatibility mode for builtins and globals. This is experimental and has serious tradeoffs. Please see https://github.com/ionic-team/rollup-plugin-node-polyfills/ for more details."
+		);
+	}
+
+	buildOutputDirectory ??= dirname(outfile);
+
+	await buildFunctions({
+		outfile,
+		outputConfigPath,
+		functionsDirectory: directory,
+		minify,
+		sourcemap,
+		fallbackService,
+		watch,
+		plugin,
+		buildOutputDirectory,
+		nodeCompat,
+	});
+	await metrics.sendMetricsEvent("build pages functions");
+};
+
+export async function buildFunctions({
+	outfile,
+	outputConfigPath,
+	functionsDirectory,
+	minify = false,
+	sourcemap = false,
+	fallbackService = "ASSETS",
+	watch = false,
+	onEnd,
+	plugin = false,
+	buildOutputDirectory,
+	nodeCompat,
+}: {
+	outfile: string;
+	outputConfigPath?: string;
+	functionsDirectory: string;
+	minify?: boolean;
+	sourcemap?: boolean;
+	fallbackService?: string;
+	watch?: boolean;
+	onEnd?: () => void;
+	plugin?: boolean;
+	buildOutputDirectory?: string;
+	nodeCompat?: boolean;
+}) {
+	RUNNING_BUILDERS.forEach(
+		(runningBuilder) => runningBuilder.stop && runningBuilder.stop()
+	);
+
+	const routesModule = join(tmpdir(), `./functionsRoutes-${Math.random()}.mjs`);
+	const baseURL = toUrlPath("/");
+
+	const config: Config = await generateConfigFromFileTree({
+		baseDir: functionsDirectory,
+		baseURL,
+	});
+
+	if (outputConfigPath) {
+		writeFileSync(
+			outputConfigPath,
+			JSON.stringify({ ...config, baseURL }, null, 2)
+		);
+	}
+
+	await writeRoutesModule({
+		config,
+		srcDir: functionsDirectory,
+		outfile: routesModule,
+	});
+
+	if (plugin) {
+		RUNNING_BUILDERS.push(
+			await buildPlugin({
+				routesModule,
+				outfile,
+				minify,
+				sourcemap,
+				watch,
+				nodeCompat,
+				onEnd,
+			})
+		);
+	} else {
+		RUNNING_BUILDERS.push(
+			await buildWorker({
+				routesModule,
+				outfile,
+				minify,
+				sourcemap,
+				fallbackService,
+				watch,
+				onEnd,
+				buildOutputDirectory,
+				nodeCompat,
+			})
+		);
+	}
+}

package/src/pages/constants.ts

@@ -0,0 +1,7 @@
+export const PAGES_CONFIG_CACHE_FILENAME = "pages.json";
+export const MAX_BUCKET_SIZE = 50 * 1024 * 1024;
+export const MAX_BUCKET_FILE_COUNT = 5000;
+export const BULK_UPLOAD_CONCURRENCY = 3;
+export const MAX_UPLOAD_ATTEMPTS = 5;
+export const SECONDS_TO_WAIT_FOR_PROXY = 5;
+export const isInPagesCI = !!process.env.CF_PAGES;

package/src/pages/deployments.tsx

@@ -0,0 +1,106 @@
+import { render, Text } from "ink";
+import SelectInput from "ink-select-input";
+import Table from "ink-table";
+import React from "react";
+import { format as timeagoFormat } from "timeago.js";
+import { fetchResult } from "../cfetch";
+import { getConfigCache, saveToConfigCache } from "../config-cache";
+import { FatalError } from "../errors";
+import * as metrics from "../metrics";
+import { requireAuth } from "../user";
+import { PAGES_CONFIG_CACHE_FILENAME } from "./constants";
+import { listProjects } from "./projects";
+import { pagesBetaWarning } from "./utils";
+import type { Deployment, PagesConfigCache } from "./types";
+import type { ArgumentsCamelCase, Argv } from "yargs";
+
+type ListArgs = {
+	"project-name"?: string;
+};
+
+export function ListOptions(yargs: Argv): Argv<ListArgs> {
+	return yargs
+		.options({
+			"project-name": {
+				type: "string",
+				description:
+					"The name of the project you would like to list deployments for",
+			},
+		})
+		.epilogue(pagesBetaWarning);
+}
+
+export async function ListHandler({
+	projectName,
+}: ArgumentsCamelCase<ListArgs>) {
+	const config = getConfigCache<PagesConfigCache>(PAGES_CONFIG_CACHE_FILENAME);
+	const accountId = await requireAuth(config);
+
+	projectName ??= config.project_name;
+
+	const isInteractive = process.stdin.isTTY;
+	if (!projectName && isInteractive) {
+		const projects = await listProjects({ accountId });
+		projectName = await new Promise((resolve) => {
+			const { unmount } = render(
+				<>
+					<Text>Select a project:</Text>
+					<SelectInput
+						items={projects.map((project) => ({
+							key: project.name,
+							label: project.name,
+							value: project,
+						}))}
+						onSelect={async (selected) => {
+							resolve(selected.value.name);
+							unmount();
+						}}
+					/>
+				</>
+			);
+		});
+	}
+
+	if (!projectName) {
+		throw new FatalError("Must specify a project name.", 1);
+	}
+
+	const deployments: Array<Deployment> = await fetchResult(
+		`/accounts/${accountId}/pages/projects/${projectName}/deployments`
+	);
+
+	const titleCase = (word: string) =>
+		word.charAt(0).toUpperCase() + word.slice(1);
+
+	const shortSha = (sha: string) => sha.slice(0, 7);
+
+	const getStatus = (deployment: Deployment) => {
+		// Return a pretty time since timestamp if successful otherwise the status
+		if (deployment.latest_stage.status === `success`) {
+			return timeagoFormat(deployment.latest_stage.ended_on);
+		}
+		return titleCase(deployment.latest_stage.status);
+	};
+
+	const data = deployments.map((deployment) => {
+		return {
+			Environment: titleCase(deployment.environment),
+			Branch: deployment.deployment_trigger.metadata.branch,
+			Source: shortSha(deployment.deployment_trigger.metadata.commit_hash),
+			Deployment: deployment.url,
+			Status: getStatus(deployment),
+			// TODO: Use a url shortener
+			Build: `https://dash.cloudflare.com/${accountId}/pages/view/${deployment.project_name}/${deployment.id}`,
+		};
+	});
+
+	saveToConfigCache<PagesConfigCache>(PAGES_CONFIG_CACHE_FILENAME, {
+		account_id: accountId,
+	});
+
+	const { unmount } = render(<Table data={data}></Table>, {
+		patchConsole: false,
+	});
+	unmount();
+	await metrics.sendMetricsEvent("list pages projects deployments");
+}

package/src/pages/dev.tsx

@@ -0,0 +1,401 @@
+import { execSync, spawn } from "node:child_process";
+import { existsSync } from "node:fs";
+import { tmpdir } from "node:os";
+import { join, resolve } from "node:path";
+import { watch } from "chokidar";
+import { unstable_dev } from "../api";
+import { FatalError } from "../errors";
+import { logger } from "../logger";
+import * as metrics from "../metrics";
+import { buildFunctions } from "./build";
+import { SECONDS_TO_WAIT_FOR_PROXY } from "./constants";
+import { CLEANUP, CLEANUP_CALLBACKS, pagesBetaWarning } from "./utils";
+import type { ArgumentsCamelCase, Argv } from "yargs";
+
+type PagesDevArgs = {
+	directory?: string;
+	command?: string;
+	local: boolean;
+	port: number;
+	proxy?: number;
+	"script-path": string;
+	binding?: (string | number)[];
+	kv?: (string | number)[];
+	do?: (string | number)[];
+	"live-reload": boolean;
+	"local-protocol"?: "https" | "http";
+	"node-compat": boolean;
+};
+
+export function Options(yargs: Argv): Argv<PagesDevArgs> {
+	return yargs
+		.positional("directory", {
+			type: "string",
+			demandOption: undefined,
+			description: "The directory of static assets to serve",
+		})
+		.positional("command", {
+			type: "string",
+			demandOption: undefined,
+			description: "The proxy command to run",
+		})
+		.options({
+			local: {
+				type: "boolean",
+				default: true,
+				description: "Run on my machine",
+			},
+			port: {
+				type: "number",
+				default: 8788,
+				description: "The port to listen on (serve from)",
+			},
+			proxy: {
+				type: "number",
+				description: "The port to proxy (where the static assets are served)",
+			},
+			"script-path": {
+				type: "string",
+				default: "_worker.js",
+				description:
+					"The location of the single Worker script if not using functions",
+			},
+			binding: {
+				type: "array",
+				description: "Bind variable/secret (KEY=VALUE)",
+				alias: "b",
+			},
+			kv: {
+				type: "array",
+				description: "KV namespace to bind",
+				alias: "k",
+			},
+			do: {
+				type: "array",
+				description: "Durable Object to bind (NAME=CLASS)",
+				alias: "o",
+			},
+			"live-reload": {
+				type: "boolean",
+				default: false,
+				description: "Auto reload HTML pages when change is detected",
+			},
+			"local-protocol": {
+				describe: "Protocol to listen to requests on, defaults to http.",
+				choices: ["http", "https"] as const,
+			},
+			"node-compat": {
+				describe: "Enable node.js compatibility",
+				default: false,
+				type: "boolean",
+				hidden: true,
+			},
+			config: {
+				describe: "Pages does not support wrangler.toml",
+				type: "string",
+				hidden: true,
+			},
+		})
+		.epilogue(pagesBetaWarning);
+}
+
+export const Handler = async ({
+	local,
+	directory,
+	port,
+	proxy: requestedProxyPort,
+	"script-path": singleWorkerScriptPath,
+	binding: bindings = [],
+	kv: kvs = [],
+	do: durableObjects = [],
+	"live-reload": liveReload,
+	"local-protocol": localProtocol,
+	"node-compat": nodeCompat,
+	config: config,
+	_: [_pages, _dev, ...remaining],
+}: ArgumentsCamelCase<PagesDevArgs>) => {
+	// Beta message for `wrangler pages <commands>` usage
+	logger.log(pagesBetaWarning);
+
+	if (!local) {
+		throw new FatalError("Only local mode is supported at the moment.", 1);
+	}
+
+	if (config) {
+		throw new FatalError("Pages does not support wrangler.toml", 1);
+	}
+
+	const functionsDirectory = "./functions";
+	const usingFunctions = existsSync(functionsDirectory);
+
+	const command = remaining;
+
+	let proxyPort: number | undefined;
+
+	if (directory === undefined) {
+		proxyPort = await spawnProxyProcess({
+			port: requestedProxyPort,
+			command,
+		});
+		if (proxyPort === undefined) return undefined;
+	} else {
+		directory = resolve(directory);
+	}
+
+	let scriptReadyResolve: () => void;
+	const scriptReadyPromise = new Promise<void>(
+		(promiseResolve) => (scriptReadyResolve = promiseResolve)
+	);
+
+	let scriptPath: string;
+
+	if (usingFunctions) {
+		const outfile = join(tmpdir(), `./functionsWorker-${Math.random()}.js`);
+		scriptPath = outfile;
+
+		if (nodeCompat) {
+			console.warn(
+				"Enabling node.js compatibility mode for builtins and globals. This is experimental and has serious tradeoffs. Please see https://github.com/ionic-team/rollup-plugin-node-polyfills/ for more details."
+			);
+		}
+
+		logger.log(`Compiling worker to "${outfile}"...`);
+
+		try {
+			await buildFunctions({
+				outfile,
+				functionsDirectory,
+				sourcemap: true,
+				watch: true,
+				onEnd: () => scriptReadyResolve(),
+				buildOutputDirectory: directory,
+				nodeCompat,
+			});
+			await metrics.sendMetricsEvent("build pages functions");
+		} catch {}
+
+		watch([functionsDirectory], {
+			persistent: true,
+			ignoreInitial: true,
+		}).on("all", async () => {
+			await buildFunctions({
+				outfile,
+				functionsDirectory,
+				sourcemap: true,
+				watch: true,
+				onEnd: () => scriptReadyResolve(),
+				buildOutputDirectory: directory,
+				nodeCompat,
+			});
+			await metrics.sendMetricsEvent("build pages functions");
+		});
+	} else {
+		// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+		scriptReadyResolve!();
+
+		scriptPath =
+			directory !== undefined
+				? join(directory, singleWorkerScriptPath)
+				: singleWorkerScriptPath;
+
+		if (!existsSync(scriptPath)) {
+			logger.log("No functions. Shimming...");
+			scriptPath = resolve(__dirname, "../templates/pages-shim.ts");
+		}
+	}
+
+	await scriptReadyPromise;
+
+	const { stop, waitUntilExit } = await unstable_dev(
+		scriptPath,
+		{
+			port,
+			watch: true,
+			localProtocol,
+			liveReload,
+
+			compatibilityDate: "2021-11-02",
+			nodeCompat,
+			vars: Object.fromEntries(
+				bindings
+					.map((binding) => binding.toString().split("="))
+					.map(([key, ...values]) => [key, values.join("=")])
+			),
+			kv: kvs.map((val) => ({
+				binding: val.toString(),
+				id: "",
+			})),
+			durableObjects: durableObjects.map((durableObject) => {
+				const [name, class_name] = durableObject.toString().split("=");
+				return {
+					name,
+					class_name,
+				};
+			}),
+
+			enablePagesAssetsServiceBinding: {
+				proxyPort,
+				directory,
+			},
+			forceLocal: true,
+			showInteractiveDevSession: undefined,
+			inspect: true,
+			logLevel: "error",
+			logPrefix: "pages",
+		},
+		true
+	);
+	await metrics.sendMetricsEvent("run pages dev");
+
+	waitUntilExit().then(() => {
+		CLEANUP();
+		stop();
+		process.exit(0);
+	});
+
+	process.on("exit", () => {
+		CLEANUP();
+		stop();
+	});
+	process.on("SIGINT", () => {
+		CLEANUP();
+		stop();
+	});
+	process.on("SIGTERM", () => {
+		CLEANUP();
+		stop();
+	});
+};
+
+function isWindows() {
+	return process.platform === "win32";
+}
+
+async function sleep(ms: number) {
+	await new Promise((promiseResolve) => setTimeout(promiseResolve, ms));
+}
+
+function getPids(pid: number) {
+	const pids: number[] = [pid];
+	let command: string, regExp: RegExp;
+
+	if (isWindows()) {
+		command = `wmic process where (ParentProcessId=${pid}) get ProcessId`;
+		regExp = new RegExp(/(\d+)/);
+	} else {
+		command = `pgrep -P ${pid}`;
+		regExp = new RegExp(/(\d+)/);
+	}
+
+	try {
+		const newPids = (
+			execSync(command)
+				.toString()
+				.split("\n")
+				.map((line) => line.match(regExp))
+				.filter((line) => line !== null) as RegExpExecArray[]
+		).map((match) => parseInt(match[1]));
+
+		pids.push(...newPids.map(getPids).flat());
+	} catch {}
+
+	return pids;
+}
+
+function getPort(pid: number) {
+	let command: string, regExp: RegExp;
+
+	if (isWindows()) {
+		command = "\\windows\\system32\\netstat.exe -nao";
+		regExp = new RegExp(`TCP\\s+.*:(\\d+)\\s+.*:\\d+\\s+LISTENING\\s+${pid}`);
+	} else {
+		command = "lsof -nPi";
+		regExp = new RegExp(`${pid}\\s+.*TCP\\s+.*:(\\d+)\\s+\\(LISTEN\\)`);
+	}
+
+	try {
+		const matches = execSync(command)
+			.toString()
+			.split("\n")
+			.map((line) => line.match(regExp))
+			.filter((line) => line !== null) as RegExpExecArray[];
+
+		const match = matches[0];
+		if (match) return parseInt(match[1]);
+	} catch (thrown) {
+		logger.error(
+			`Error scanning for ports of process with PID ${pid}: ${thrown}`
+		);
+	}
+}
+
+async function spawnProxyProcess({
+	port,
+	command,
+}: {
+	port?: number;
+	command: (string | number)[];
+}): Promise<undefined | number> {
+	if (command.length === 0) {
+		CLEANUP();
+		throw new FatalError(
+			"Must specify a directory of static assets to serve or a command to run.",
+			1
+		);
+	}
+
+	logger.log(`Running ${command.join(" ")}...`);
+	const proxy = spawn(
+		command[0].toString(),
+		command.slice(1).map((value) => value.toString()),
+		{
+			shell: isWindows(),
+			env: {
+				BROWSER: "none",
+				...process.env,
+			},
+		}
+	);
+	CLEANUP_CALLBACKS.push(() => {
+		proxy.kill();
+	});
+
+	proxy.stdout.on("data", (data) => {
+		logger.log(`[proxy]: ${data}`);
+	});
+
+	proxy.stderr.on("data", (data) => {
+		logger.error(`[proxy]: ${data}`);
+	});
+
+	proxy.on("close", (code) => {
+		logger.error(`Proxy exited with status ${code}.`);
+	});
+
+	// Wait for proxy process to start...
+	while (!proxy.pid) {}
+
+	if (port === undefined) {
+		logger.log(
+			`Sleeping ${SECONDS_TO_WAIT_FOR_PROXY} seconds to allow proxy process to start before attempting to automatically determine port...`
+		);
+		logger.log("To skip, specify the proxy port with --proxy.");
+		await sleep(SECONDS_TO_WAIT_FOR_PROXY * 1000);
+
+		port = getPids(proxy.pid)
+			.map(getPort)
+			.filter((nr) => nr !== undefined)[0];
+
+		if (port === undefined) {
+			CLEANUP();
+			throw new FatalError(
+				"Could not automatically determine proxy port. Please specify the proxy port with --proxy.",
+				1
+			);
+		} else {
+			logger.log(`Automatically determined the proxy port to be ${port}.`);
+		}
+	}
+
+	return port;
+}