wrangler 0.0.0-e2f9bb2 → 0.0.0-e305903a

package/templates/middleware/loader-sw.ts

@@ -0,0 +1,213 @@
+import { Awaitable, Dispatcher, Middleware, __facade_invoke__ } from "./common";
+export { __facade_register__, __facade_registerInternal__ } from "./common";
+
+// Miniflare's `EventTarget` follows the spec and doesn't allow exceptions to
+// be caught by `dispatchEvent`. Instead it has a custom`ThrowingEventTarget`
+// class that rethrows errors from event listeners in `dispatchEvent`.
+// We'd like errors to be propagated to the top-level `addEventListener`, so
+// we'd like to use `ThrowingEventTarget`. Unfortunately, `ThrowingEventTarget`
+// isn't exposed on the global scope, but `WorkerGlobalScope` (which extends
+// `ThrowingEventTarget`) is. Therefore, we get at it in this nasty way.
+let __FACADE_EVENT_TARGET__: EventTarget;
+if ((globalThis as any).MINIFLARE) {
+	__FACADE_EVENT_TARGET__ = new (Object.getPrototypeOf(WorkerGlobalScope))();
+} else {
+	__FACADE_EVENT_TARGET__ = new EventTarget();
+}
+
+declare global {
+	var __facade_addEventListener__: (
+		type: string,
+		listener: EventListenerOrEventListenerObject,
+		options?: EventTargetAddEventListenerOptions | boolean
+	) => void;
+	var __facade_removeEventListener__: (
+		type: string,
+		listener: EventListenerOrEventListenerObject,
+		options?: EventTargetEventListenerOptions | boolean
+	) => void;
+	var __facade_dispatchEvent__: (event: Event) => void;
+}
+
+function __facade_isSpecialEvent__(type: string) {
+	return type === "fetch" || type === "scheduled";
+}
+globalThis.__facade_addEventListener__ = function (type, listener, options) {
+	if (__facade_isSpecialEvent__(type)) {
+		__FACADE_EVENT_TARGET__.addEventListener(type, listener, options);
+	} else {
+		globalThis.addEventListener(type as any, listener, options);
+	}
+};
+globalThis.__facade_removeEventListener__ = function (type, listener, options) {
+	if (__facade_isSpecialEvent__(type)) {
+		__FACADE_EVENT_TARGET__.removeEventListener(type, listener, options);
+	} else {
+		globalThis.removeEventListener(type as any, listener, options);
+	}
+};
+globalThis.__facade_dispatchEvent__ = function (event) {
+	if (__facade_isSpecialEvent__(event.type)) {
+		__FACADE_EVENT_TARGET__.dispatchEvent(event);
+	} else {
+		globalThis.dispatchEvent(event as any);
+	}
+};
+
+const __facade_waitUntil__ = Symbol("__facade_waitUntil__");
+const __facade_response__ = Symbol("__facade_response__");
+const __facade_dispatched__ = Symbol("__facade_dispatched__");
+
+class __Facade_ExtendableEvent__ extends Event {
+	[__facade_waitUntil__]: Awaitable<unknown>[] = [];
+
+	waitUntil(promise: Awaitable<any>) {
+		if (!(this instanceof __Facade_ExtendableEvent__)) {
+			throw new TypeError("Illegal invocation");
+		}
+		this[__facade_waitUntil__].push(promise);
+	}
+}
+
+interface FetchEventInit extends EventInit {
+	request: Request;
+	passThroughOnException: FetchEvent["passThroughOnException"];
+}
+
+class __Facade_FetchEvent__ extends __Facade_ExtendableEvent__ {
+	#request: Request;
+	#passThroughOnException: FetchEvent["passThroughOnException"];
+	[__facade_response__]?: Awaitable<Response>;
+	[__facade_dispatched__] = false;
+
+	constructor(type: "fetch", init: FetchEventInit) {
+		super(type);
+		this.#request = init.request;
+		this.#passThroughOnException = init.passThroughOnException;
+	}
+
+	get request() {
+		return this.#request;
+	}
+
+	respondWith(response: Awaitable<Response>) {
+		if (!(this instanceof __Facade_FetchEvent__)) {
+			throw new TypeError("Illegal invocation");
+		}
+		if (this[__facade_response__] !== undefined) {
+			throw new DOMException(
+				"FetchEvent.respondWith() has already been called; it can only be called once.",
+				"InvalidStateError"
+			);
+		}
+		if (this[__facade_dispatched__]) {
+			throw new DOMException(
+				"Too late to call FetchEvent.respondWith(). It must be called synchronously in the event handler.",
+				"InvalidStateError"
+			);
+		}
+		this.stopImmediatePropagation();
+		this[__facade_response__] = response;
+	}
+
+	passThroughOnException() {
+		if (!(this instanceof __Facade_FetchEvent__)) {
+			throw new TypeError("Illegal invocation");
+		}
+		// Need to call native method immediately in case uncaught error thrown
+		this.#passThroughOnException();
+	}
+}
+
+interface ScheduledEventInit extends EventInit {
+	scheduledTime: number;
+	cron: string;
+	noRetry: ScheduledEvent["noRetry"];
+}
+
+class __Facade_ScheduledEvent__ extends __Facade_ExtendableEvent__ {
+	#scheduledTime: number;
+	#cron: string;
+	#noRetry: ScheduledEvent["noRetry"];
+
+	constructor(type: "scheduled", init: ScheduledEventInit) {
+		super(type);
+		this.#scheduledTime = init.scheduledTime;
+		this.#cron = init.cron;
+		this.#noRetry = init.noRetry;
+	}
+
+	get scheduledTime() {
+		return this.#scheduledTime;
+	}
+
+	get cron() {
+		return this.#cron;
+	}
+
+	noRetry() {
+		if (!(this instanceof __Facade_ScheduledEvent__)) {
+			throw new TypeError("Illegal invocation");
+		}
+		// Need to call native method immediately in case uncaught error thrown
+		this.#noRetry();
+	}
+}
+
+globalThis.addEventListener("fetch", (event) => {
+	const ctx: ExecutionContext = {
+		waitUntil: event.waitUntil.bind(event),
+		passThroughOnException: event.passThroughOnException.bind(event),
+	};
+
+	const __facade_sw_dispatch__: Dispatcher = function (type, init) {
+		if (type === "scheduled") {
+			const facadeEvent = new __Facade_ScheduledEvent__("scheduled", {
+				scheduledTime: Date.now(),
+				cron: init.cron ?? "",
+				noRetry() {},
+			});
+
+			__FACADE_EVENT_TARGET__.dispatchEvent(facadeEvent);
+			event.waitUntil(Promise.all(facadeEvent[__facade_waitUntil__]));
+		}
+	};
+
+	const __facade_sw_fetch__: Middleware = function (request, _env, ctx) {
+		const facadeEvent = new __Facade_FetchEvent__("fetch", {
+			request,
+			passThroughOnException: ctx.passThroughOnException,
+		});
+
+		__FACADE_EVENT_TARGET__.dispatchEvent(facadeEvent);
+		facadeEvent[__facade_dispatched__] = true;
+		event.waitUntil(Promise.all(facadeEvent[__facade_waitUntil__]));
+
+		const response = facadeEvent[__facade_response__];
+		if (response === undefined) {
+			throw new Error("No response!"); // TODO: proper error message
+		}
+		return response;
+	};
+
+	event.respondWith(
+		__facade_invoke__(
+			event.request,
+			globalThis,
+			ctx,
+			__facade_sw_dispatch__,
+			__facade_sw_fetch__
+		)
+	);
+});
+
+globalThis.addEventListener("scheduled", (event) => {
+	const facadeEvent = new __Facade_ScheduledEvent__("scheduled", {
+		scheduledTime: event.scheduledTime,
+		cron: event.cron,
+		noRetry: event.noRetry.bind(event),
+	});
+
+	__FACADE_EVENT_TARGET__.dispatchEvent(facadeEvent);
+	event.waitUntil(Promise.all(facadeEvent[__facade_waitUntil__]));
+});

package/templates/middleware/middleware-pretty-error.ts

@@ -0,0 +1,40 @@
+import type { Middleware } from "./common";
+
+// A middleware has to be a function of type Middleware
+const prettyError: Middleware = async (request, env, _ctx, middlewareCtx) => {
+	try {
+		const response = await middlewareCtx.next(request, env);
+		return response;
+	} catch (e: any) {
+		const html = `
+    <!DOCTYPE html>
+    <html lang="en">
+    <head>
+        <meta charset="UTF-8">
+        <meta http-equiv="X-UA-Compatible" content="IE=edge">
+        <meta name="viewport" content="width=device-width, initial-scale=1.0">
+        <title>Error 🚨</title>
+        <style>
+          pre {
+            margin: 16px auto;
+            max-width: 600px;
+            background-color: #eeeeee;
+            border-radius: 4px;
+            padding: 16px;
+          }
+        </style>
+    </head>
+    <body>
+        <pre>${e.stack}</pre>
+    </body>
+    </html>
+    `;
+
+		return new Response(html, {
+			status: 500,
+			headers: { "Content-Type": "text/html;charset=utf-8" },
+		});
+	}
+};
+
+export default prettyError;

package/templates/middleware/middleware-scheduled.ts

@@ -0,0 +1,15 @@
+import type { Middleware } from "./common";
+
+// A middleware has to be a function of type Middleware
+const scheduled: Middleware = async (request, env, _ctx, middlewareCtx) => {
+	const url = new URL(request.url);
+	if (url.pathname === "/__scheduled") {
+		const cron = url.searchParams.get("cron") ?? "";
+		await middlewareCtx.dispatch("scheduled", { cron });
+
+		return new Response("Ran scheduled event");
+	}
+	return middlewareCtx.next(request, env);
+};
+
+export default scheduled;

package/templates/new-worker-scheduled.js

@@ -0,0 +1,17 @@
+/**
+ * Welcome to Cloudflare Workers! This is your first scheduled worker.
+ *
+ * - Run `wrangler dev --local` in your terminal to start a development server
+ * - Run `curl "http://localhost:8787/cdn-cgi/mf/scheduled"` to trigger the scheduled event
+ * - Go back to the console to see what your worker has logged
+ * - Update the Cron trigger in wrangler.toml (see https://developers.cloudflare.com/workers/wrangler/configuration/#triggers)
+ * - Run `wrangler publish --name my-worker` to publish your worker
+ *
+ * Learn more at https://developers.cloudflare.com/workers/runtime-apis/scheduled-event/
+ */
+
+export default {
+	async scheduled(controller, env, ctx) {
+		console.log(`Hello World!`);
+	},
+};

package/templates/new-worker-scheduled.ts

@@ -0,0 +1,32 @@
+/**
+ * Welcome to Cloudflare Workers! This is your first scheduled worker.
+ *
+ * - Run `wrangler dev --local` in your terminal to start a development server
+ * - Run `curl "http://localhost:8787/cdn-cgi/mf/scheduled"` to trigger the scheduled event
+ * - Go back to the console to see what your worker has logged
+ * - Update the Cron trigger in wrangler.toml (see https://developers.cloudflare.com/workers/wrangler/configuration/#triggers)
+ * - Run `wrangler publish --name my-worker` to publish your worker
+ *
+ * Learn more at https://developers.cloudflare.com/workers/runtime-apis/scheduled-event/
+ */
+
+export interface Env {
+	// Example binding to KV. Learn more at https://developers.cloudflare.com/workers/runtime-apis/kv/
+	// MY_KV_NAMESPACE: KVNamespace;
+	//
+	// Example binding to Durable Object. Learn more at https://developers.cloudflare.com/workers/runtime-apis/durable-objects/
+	// MY_DURABLE_OBJECT: DurableObjectNamespace;
+	//
+	// Example binding to R2. Learn more at https://developers.cloudflare.com/workers/runtime-apis/r2/
+	// MY_BUCKET: R2Bucket;
+}
+
+export default {
+	async scheduled(
+		controller: ScheduledController,
+		env: Env,
+		ctx: ExecutionContext
+	): Promise<void> {
+		console.log(`Hello World!`);
+	},
+};

package/templates/new-worker.js

@@ -9,7 +9,7 @@
  */
 
 export default {
-  async fetch(request) {
-    return new Response("Hello World!");
-  },
+	async fetch(request) {
+		return new Response("Hello World!");
+	},
 };

package/templates/new-worker.ts

@@ -8,8 +8,23 @@
  * Learn more at https://developers.cloudflare.com/workers/
  */
 
+export interface Env {
+	// Example binding to KV. Learn more at https://developers.cloudflare.com/workers/runtime-apis/kv/
+	// MY_KV_NAMESPACE: KVNamespace;
+	//
+	// Example binding to Durable Object. Learn more at https://developers.cloudflare.com/workers/runtime-apis/durable-objects/
+	// MY_DURABLE_OBJECT: DurableObjectNamespace;
+	//
+	// Example binding to R2. Learn more at https://developers.cloudflare.com/workers/runtime-apis/r2/
+	// MY_BUCKET: R2Bucket;
+}
+
 export default {
-  async fetch(request: Request): Promise<Response> {
-    return new Response("Hello World!");
-  },
+	async fetch(
+		request: Request,
+		env: Env,
+		ctx: ExecutionContext
+	): Promise<Response> {
+		return new Response("Hello World!");
+	},
 };

package/templates/no-op-worker.js

@@ -0,0 +1,10 @@
+export default {
+	fetch() {
+		return new Response("Not found", {
+			status: 404,
+			headers: {
+				"Content-Type": "text/html",
+			},
+		});
+	},
+};

package/templates/pages-dev-pipeline.ts

@@ -0,0 +1,35 @@
+// @ts-ignore entry point will get replaced
+import worker from "__ENTRY_POINT__";
+// @ts-ignore entry point will get replaced
+export * from "__ENTRY_POINT__";
+
+const transformToRegex = (filter: string) => {
+	return filter.replace("*", ".*");
+};
+
+const routes = {
+	// @ts-ignore routes are injected
+	include: __ROUTES__.include.map(transformToRegex),
+	// @ts-ignore routes are injected
+	exclude: __ROUTES__.exclude.map(transformToRegex) || [],
+};
+
+export default {
+	fetch(request, env, context) {
+		const { pathname } = new URL(request.url);
+
+		for (const exclude of routes.exclude) {
+			if (pathname.match(exclude)) {
+				return env.ASSETS.fetch(request);
+			}
+		}
+
+		for (const include of routes.include) {
+			if (pathname.match(include)) {
+				return worker.fetch(request, env, context);
+			}
+		}
+
+		return env.ASSETS.fetch(request);
+	},
+};

package/templates/pages-shim.ts

@@ -0,0 +1,9 @@
+// This Worker is used as a default when no Pages Functions are present.
+// It proxies the request directly on to the asset server binding.
+
+export default {
+	async fetch(request, env, context) {
+		const response = await env.ASSETS.fetch(request.url, request);
+		return new Response(response.body, response);
+	},
+};

package/templates/pages-template-plugin.ts

@@ -0,0 +1,167 @@
+import { match } from "path-to-regexp";
+
+//note: this explicitly does not include the * character, as pages requires this
+const escapeRegex = /[.+?^${}()|[\]\\]/g;
+
+type HTTPMethod =
+	| "HEAD"
+	| "OPTIONS"
+	| "GET"
+	| "POST"
+	| "PUT"
+	| "PATCH"
+	| "DELETE";
+
+/* TODO: Grab these from @cloudflare/workers-types instead */
+type Params<P extends string = string> = Record<P, string | string[]>;
+
+type EventContext<Env, P extends string, Data> = {
+	request: Request;
+	functionPath: string;
+	waitUntil: (promise: Promise<unknown>) => void;
+	next: (input?: Request | string, init?: RequestInit) => Promise<Response>;
+	env: Env & { ASSETS: { fetch: typeof fetch } };
+	params: Params<P>;
+	data: Data;
+};
+
+type EventPluginContext<Env, P extends string, Data, PluginArgs> = {
+	request: Request;
+	functionPath: string;
+	waitUntil: (promise: Promise<unknown>) => void;
+	next: (input?: Request | string, init?: RequestInit) => Promise<Response>;
+	env: Env & { ASSETS: { fetch: typeof fetch } };
+	params: Params<P>;
+	data: Data;
+	pluginArgs: PluginArgs;
+};
+
+declare type PagesFunction<
+	Env = unknown,
+	P extends string = string,
+	Data extends Record<string, unknown> = Record<string, unknown>
+> = (context: EventContext<Env, P, Data>) => Response | Promise<Response>;
+
+declare type PagesPluginFunction<
+	Env = unknown,
+	P extends string = string,
+	Data extends Record<string, unknown> = Record<string, unknown>,
+	PluginArgs = unknown
+> = (
+	context: EventPluginContext<Env, P, Data, PluginArgs>
+) => Response | Promise<Response>;
+/* end @cloudflare/workers-types */
+
+type RouteHandler = {
+	routePath: string;
+	mountPath: string;
+	method?: HTTPMethod;
+	modules: PagesFunction[];
+	middlewares: PagesFunction[];
+};
+
+// inject `routes` via ESBuild
+declare const routes: RouteHandler[];
+
+function* executeRequest(request: Request, relativePathname: string) {
+	// First, iterate through the routes (backwards) and execute "middlewares" on partial route matches
+	for (const route of [...routes].reverse()) {
+		if (route.method && route.method !== request.method) {
+			continue;
+		}
+
+		// replaces with "\\$&", this prepends a backslash to the matched string, e.g. "[" becomes "\["
+		const routeMatcher = match(route.routePath.replace(escapeRegex, "\\$&"), {
+			end: false,
+		});
+		const mountMatcher = match(route.mountPath.replace(escapeRegex, "\\$&"), {
+			end: false,
+		});
+		const matchResult = routeMatcher(relativePathname);
+		const mountMatchResult = mountMatcher(relativePathname);
+		if (matchResult && mountMatchResult) {
+			for (const handler of route.middlewares.flat()) {
+				yield {
+					handler,
+					params: matchResult.params as Params,
+					path: mountMatchResult.path,
+				};
+			}
+		}
+	}
+
+	// Then look for the first exact route match and execute its "modules"
+	for (const route of routes) {
+		if (route.method && route.method !== request.method) {
+			continue;
+		}
+
+		const routeMatcher = match(route.routePath.replace(escapeRegex, "\\$&"), {
+			end: true,
+		});
+		const mountMatcher = match(route.mountPath.replace(escapeRegex, "\\$&"), {
+			end: false,
+		});
+		const matchResult = routeMatcher(relativePathname);
+		const mountMatchResult = mountMatcher(relativePathname);
+		if (matchResult && mountMatchResult && route.modules.length) {
+			for (const handler of route.modules.flat()) {
+				yield {
+					handler,
+					params: matchResult.params as Params,
+					path: matchResult.path,
+				};
+			}
+			break;
+		}
+	}
+}
+
+export default function (pluginArgs) {
+	const onRequest: PagesPluginFunction = async (workerContext) => {
+		let { request } = workerContext;
+		const { env, next, data } = workerContext;
+
+		const url = new URL(request.url);
+		const relativePathname = `/${
+			url.pathname.split(workerContext.functionPath)[1] || ""
+		}`.replace(/^\/\//, "/");
+
+		const handlerIterator = executeRequest(request, relativePathname);
+		const pluginNext = async (input?: RequestInfo, init?: RequestInit) => {
+			if (input !== undefined) {
+				request = new Request(input, init);
+			}
+
+			const result = handlerIterator.next();
+			// Note we can't use `!result.done` because this doesn't narrow to the correct type
+			if (result.done === false) {
+				const { handler, params, path } = result.value;
+				const context = {
+					request,
+					functionPath: workerContext.functionPath + path,
+					next: pluginNext,
+					params,
+					data,
+					pluginArgs,
+					env,
+					waitUntil: workerContext.waitUntil.bind(workerContext),
+				};
+
+				const response = await handler(context);
+
+				// https://fetch.spec.whatwg.org/#null-body-status
+				return new Response(
+					[101, 204, 205, 304].includes(response.status) ? null : response.body,
+					{ ...response, headers: new Headers(response.headers) }
+				);
+			} else {
+				return next();
+			}
+		};
+
+		return pluginNext();
+	};
+
+	return onRequest;
+}