wrangler 0.0.0-e739b7fe → 0.0.0-e75c5812f

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "wrangler",
-  "version": "0.0.0-e739b7fe",
+  "version": "0.0.0-e75c5812f",
   "description": "Command-line interface for all things Cloudflare Workers",
   "keywords": [
     "wrangler",
@@ -47,105 +47,71 @@
     "wrangler-dist",
     "templates",
     "kv-asset-handler.js",
-    "Cloudflare_CA.pem"
+    "config-schema.json"
   ],
-  "jest": {
-    "coverageReporters": [
-      "json",
-      "html",
-      "text",
-      "cobertura"
-    ],
-    "moduleNameMapper": {
-      "clipboardy": "<rootDir>/src/__tests__/helpers/clipboardy-mock.js",
-      "miniflare/cli": "<rootDir>/../../node_modules/miniflare/dist/src/cli.js"
-    },
-    "restoreMocks": true,
-    "setupFilesAfterEnv": [
-      "<rootDir>/src/__tests__/jest.setup.ts"
-    ],
-    "testRegex": "src/__tests__/.*\\.(test|spec)\\.[jt]sx?$",
-    "testTimeout": 50000,
-    "transform": {
-      "^.+\\.c?(t|j)sx?$": [
-        "esbuild-jest",
-        {
-          "sourcemap": true
-        }
-      ]
-    },
-    "transformIgnorePatterns": [
-      "node_modules/.pnpm/(?!find-up|locate-path|p-locate|p-limit|p-timeout|p-queue|yocto-queue|path-exists|execa|strip-final-newline|npm-run-path|path-key|onetime|mimic-fn|human-signals|is-stream|get-port|supports-color|pretty-bytes|strip-ansi|ansi-regex)"
-    ],
-    "snapshotFormat": {
-      "escapeString": true,
-      "printBasicPrototype": true
-    }
-  },
   "dependencies": {
     "@esbuild-plugins/node-globals-polyfill": "^0.2.3",
     "@esbuild-plugins/node-modules-polyfill": "^0.2.2",
     "blake3-wasm": "^2.1.5",
     "chokidar": "^3.5.3",
+    "date-fns": "^3.6.0",
     "esbuild": "0.17.19",
     "nanoid": "^3.3.3",
     "path-to-regexp": "^6.2.0",
     "resolve": "^1.22.8",
     "resolve.exports": "^2.0.2",
     "selfsigned": "^2.0.1",
-    "source-map": "0.6.1",
+    "source-map": "^0.6.1",
+    "unenv": "npm:unenv-nightly@1.10.0-1717606461.a117952",
+    "workerd": "1.20240806.0",
     "xxhash-wasm": "^1.0.1",
-    "@cloudflare/kv-asset-handler": "0.3.1",
-    "miniflare": "3.20240314.0"
+    "@cloudflare/workers-shared": "0.0.0-e75c5812f",
+    "miniflare": "3.20240806.1",
+    "@cloudflare/kv-asset-handler": "0.3.4"
   },
   "devDependencies": {
-    "@cloudflare/ai": "^1.0.35",
-    "@cloudflare/eslint-config-worker": "*",
     "@cloudflare/types": "^6.18.4",
-    "@cloudflare/workers-types": "^4.20230914.0",
+    "@cloudflare/workers-types": "^4.20240806.0",
     "@cspotcode/source-map-support": "0.8.1",
     "@iarna/toml": "^3.0.0",
-    "@microsoft/api-extractor": "^7.28.3",
+    "@microsoft/api-extractor": "^7.47.0",
     "@sentry/node": "^7.86.0",
     "@sentry/types": "^7.86.0",
     "@sentry/utils": "^7.86.0",
     "@types/body-parser": "^1.19.2",
-    "@types/busboy": "^1.5.0",
     "@types/command-exists": "^1.2.0",
     "@types/express": "^4.17.13",
-    "@types/glob-to-regexp": "0.4.1",
+    "@types/glob-to-regexp": "^0.4.1",
     "@types/is-ci": "^3.0.0",
     "@types/javascript-time-ago": "^2.0.3",
-    "@types/jest": "^29.5.5",
-    "@types/mime": "^2.0.3",
+    "@types/mime": "^3.0.4",
     "@types/minimatch": "^5.1.2",
     "@types/prompts": "^2.0.14",
-    "@types/react": "^17.0.37",
+    "@types/react": "^18.3.3",
     "@types/resolve": "^1.20.6",
     "@types/serve-static": "^1.13.10",
     "@types/shell-quote": "^1.7.2",
     "@types/signal-exit": "^3.0.1",
-    "@types/source-map-support": "^0.5.7",
     "@types/supports-color": "^8.1.1",
-    "@types/ws": "^8.5.3",
-    "@types/yargs": "^17.0.10",
+    "@types/ws": "^8.5.7",
+    "@types/yargs": "^17.0.22",
+    "@vitest/ui": "^1.6.0",
     "@webcontainer/env": "^1.1.0",
     "body-parser": "^1.20.0",
-    "chalk": "^2.4.2",
+    "chalk": "^5.2.0",
     "cli-table3": "^0.6.3",
     "clipboardy": "^3.0.0",
     "cmd-shim": "^4.1.0",
     "command-exists": "^1.2.9",
-    "concurrently": "^7.2.2",
-    "devtools-protocol": "^0.0.955664",
+    "concurrently": "^8.2.2",
+    "devtools-protocol": "^0.0.1182435",
     "dotenv": "^16.0.0",
-    "esbuild-jest": "0.5.0",
+    "es-module-lexer": "^1.3.0",
     "execa": "^6.1.0",
     "express": "^4.18.1",
-    "finalhandler": "^1.2.0",
     "find-up": "^6.3.0",
-    "get-port": "^6.1.2",
-    "glob-to-regexp": "0.4.1",
+    "get-port": "^7.0.0",
+    "glob-to-regexp": "^0.4.1",
     "http-terminator": "^3.2.0",
     "https-proxy-agent": "7.0.2",
     "ignore": "^5.2.0",
@@ -153,74 +119,79 @@
     "ink-select-input": "^4.2.1",
     "ink-spinner": "^4.0.3",
     "ink-table": "^3.0.0",
-    "ink-testing-library": "^2.1.0",
-    "ink-text-input": "^4.0.3",
     "is-ci": "^3.0.1",
     "javascript-time-ago": "^2.5.4",
-    "jest": "^29.7.0",
-    "jest-fetch-mock": "^3.0.3",
-    "jest-websocket-mock": "^2.5.0",
+    "md5-file": "5.0.0",
     "mime": "^3.0.0",
     "minimatch": "^5.1.0",
-    "msw": "^0.49.1",
+    "mock-socket": "^9.3.1",
+    "msw": "^2.3.0",
     "open": "^8.4.0",
     "p-queue": "^7.2.0",
     "patch-console": "^1.0.0",
     "pretty-bytes": "^6.0.0",
     "prompts": "^2.4.2",
-    "react": "^17.0.2",
+    "ps-list": "^8.1.1",
+    "react": "^18.3.1",
     "react-error-boundary": "^3.1.4",
-    "remove-accents-esm": "^0.0.1",
     "semiver": "^1.1.0",
     "serve-static": "^1.15.0",
     "shell-quote": "^1.8.1",
     "shellac": "^0.8.0",
     "signal-exit": "^3.0.7",
-    "strip-ansi": "^7.0.1",
+    "strip-ansi": "^7.1.0",
     "supports-color": "^9.2.2",
     "timeago.js": "^4.0.2",
     "ts-dedent": "^2.2.0",
-    "undici": "5.28.3",
+    "ts-json-schema-generator": "^1.5.0",
+    "undici": "^5.28.4",
     "update-check": "^1.5.4",
-    "ws": "^8.5.0",
+    "vitest": "^1.6.0",
+    "vitest-websocket-mock": "^0.3.0",
+    "ws": "^8.17.1",
     "xdg-app-paths": "^8.3.0",
     "yargs": "^17.7.2",
     "yoga-layout": "file:../../vendor/yoga-layout-2.0.0-beta.1.tgz",
+    "@cloudflare/pages-shared": "^0.11.52",
+    "@cloudflare/workers-tsconfig": "0.0.0",
     "@cloudflare/cli": "1.1.1",
-    "@cloudflare/pages-shared": "^0.11.20",
-    "@cloudflare/workers-tsconfig": "0.0.0"
-  },
-  "optionalDependencies": {
-    "fsevents": "~2.3.2"
+    "@cloudflare/eslint-config-worker": "1.1.0"
   },
   "peerDependencies": {
-    "@cloudflare/workers-types": "^4.20230914.0"
+    "@cloudflare/workers-types": "^4.20240806.0"
   },
   "peerDependenciesMeta": {
     "@cloudflare/workers-types": {
       "optional": true
     }
   },
+  "optionalDependencies": {
+    "fsevents": "~2.3.2"
+  },
   "engines": {
     "node": ">=16.17.0"
   },
+  "volta": {
+    "extends": "../../package.json"
+  },
   "workers-sdk": {
     "prerelease": true
   },
   "scripts": {
     "assert-git-version": "node -r esbuild-register scripts/assert-git-version.ts",
-    "build": "pnpm run clean && pnpm run bundle && pnpm run emit-types",
+    "build": "pnpm run clean && pnpm run bundle && pnpm run emit-types && pnpm run generate-json-schema",
     "bundle": "node -r esbuild-register scripts/bundle.ts",
-    "check:lint": "eslint .",
+    "check:lint": "eslint . --max-warnings=0",
     "check:type": "tsc",
     "clean": "rimraf wrangler-dist miniflare-dist emitted-types",
     "dev": "pnpm run clean && concurrently -c black,blue --kill-others-on-fail false \"pnpm run bundle --watch\" \"pnpm run check:type --watch --preserveWatchOutput\"",
     "emit-types": "tsc -p tsconfig.emit.json && node -r esbuild-register scripts/emit-types.ts",
+    "generate-json-schema": "pnpm exec ts-json-schema-generator --no-type-check --path src/config/config.ts --type RawConfig --out config-schema.json",
     "start": "pnpm run bundle && cross-env NODE_OPTIONS=--enable-source-maps ./bin/wrangler.js",
-    "test": "pnpm run assert-git-version && jest",
-    "test:ci": "pnpm run test --coverage",
+    "test": "pnpm run assert-git-version && vitest",
+    "test:ci": "pnpm run test run",
     "test:debug": "pnpm run test --silent=false --verbose=true",
-    "test:e2e": "vitest -c ./e2e/vitest.config.ts",
+    "test:e2e": "vitest -c ./e2e/vitest.config.mts",
     "test:watch": "pnpm run test --testTimeout=50000 --watch",
     "type:tests": "tsc -p ./src/__tests__/tsconfig.json && tsc -p ./e2e/tsconfig.json"
   }

package/templates/checked-fetch.js

@@ -9,7 +9,7 @@ function checkURL(request, init) {
 						? new Request(request, init)
 						: request
 					).url
-			  );
+				);
 	if (url.port && url.port !== "443" && url.protocol === "https:") {
 		if (!urls.has(url.toString())) {
 			urls.add(url.toString());

package/templates/facade.d.ts

@@ -1,10 +1,12 @@
 declare module "__ENTRY_POINT__" {
-	import type { Middleware } from "./middleware/common";
-	const worker: ExportedHandler & {
-		middleware?: Middleware[];
-		envWrappers: ((env: Record<string, unknown>) => Record<string, unknown>)[];
-	};
+	import { Middleware } from "./middleware/common";
+	import { WorkerEntrypoint } from "cloudflare:workers";
+
+	export type WorkerEntrypointConstructor = typeof WorkerEntrypoint;
+
+	const worker: ExportedHandler | WorkerEntrypointConstructor;
 	export default worker;
+	export const __INTERNAL_WRANGLER_MIDDLEWARE__: Middleware[];
 }
 
 declare module "__KV_ASSET_HANDLER__" {

package/templates/gitignore

@@ -165,3 +165,6 @@ dist
 .yarn/build-state.yml
 .yarn/install-state.gz
 .pnp.\*
+
+.wrangler
+.DS_Store

package/templates/middleware/loader-modules.ts

@@ -1,22 +1,17 @@
-// // This loads all middlewares exposed on the middleware object
-// // and then starts the invocation chain.
-// // The big idea is that we can add these to the middleware export dynamically
-// // through wrangler, or we can potentially let users directly add them as a sort
-// // of "plugin" system.
+// This loads all middlewares exposed on the middleware object and then starts
+// the invocation chain. The big idea is that we can add these to the middleware
+// export dynamically through wrangler, or we can potentially let users directly
+// add them as a sort of "plugin" system.
 
-import worker from "__ENTRY_POINT__";
-import {
-	__facade_invoke__,
-	__facade_register__,
-	Dispatcher,
-	Middleware,
-} from "./common";
+import ENTRY, { __INTERNAL_WRANGLER_MIDDLEWARE__ } from "__ENTRY_POINT__";
+import { __facade_invoke__, __facade_register__, Dispatcher } from "./common";
+import type { WorkerEntrypointConstructor } from "__ENTRY_POINT__";
 
-// We need to preserve all of the exports from the worker
+// Preserve all the exports from the worker
 export * from "__ENTRY_POINT__";
 
 class __Facade_ScheduledController__ implements ScheduledController {
-	#noRetry: ScheduledController["noRetry"];
+	readonly #noRetry: ScheduledController["noRetry"];
 
 	constructor(
 		readonly scheduledTime: number,
@@ -35,71 +30,34 @@ class __Facade_ScheduledController__ implements ScheduledController {
 	}
 }
 
-const __facade_modules_fetch__: ExportedHandlerFetchHandler = function (
-	request,
-	env,
-	ctx
-) {
-	if (worker.fetch === undefined)
-		throw new Error("Handler does not export a fetch() function.");
-	return worker.fetch(request, env, ctx);
-};
-
-function getMaskedEnv(rawEnv: unknown) {
-	let env = rawEnv as Record<string, unknown>;
-	if (worker.envWrappers && worker.envWrappers.length > 0) {
-		for (const wrapFn of worker.envWrappers) {
-			env = wrapFn(env);
-		}
+function wrapExportedHandler(worker: ExportedHandler): ExportedHandler {
+	// If we don't have any middleware defined, just return the handler as is
+	if (
+		__INTERNAL_WRANGLER_MIDDLEWARE__ === undefined ||
+		__INTERNAL_WRANGLER_MIDDLEWARE__.length === 0
+	) {
+		return worker;
+	}
+	// Otherwise, register all middleware once
+	for (const middleware of __INTERNAL_WRANGLER_MIDDLEWARE__) {
+		__facade_register__(middleware);
 	}
-	return env;
-}
-
-/**
- * This type is here to cause a type error if a new export handler is added to
- * `ExportHandler` without it being included in the `facade` below.
- */
-type MissingExportHandlers = Omit<
-	Required<ExportedHandler>,
-	"tail" | "trace" | "scheduled" | "queue" | "test" | "email" | "fetch"
->;
-
-let registeredMiddleware = false;
-
-const facade: ExportedHandler<unknown> & MissingExportHandlers = {
-	...(worker.tail && {
-		tail: maskHandlerEnv(worker.tail),
-	}),
-	...(worker.trace && {
-		trace: maskHandlerEnv(worker.trace),
-	}),
-	...(worker.scheduled && {
-		scheduled: maskHandlerEnv(worker.scheduled),
-	}),
-	...(worker.queue && {
-		queue: maskHandlerEnv(worker.queue),
-	}),
-	...(worker.test && {
-		test: maskHandlerEnv(worker.test),
-	}),
-	...(worker.email && {
-		email: maskHandlerEnv(worker.email),
-	}),
 
-	fetch(request, rawEnv, ctx) {
-		const env = getMaskedEnv(rawEnv);
-		// Get the chain of middleware from the worker object
-		if (worker.middleware && worker.middleware.length > 0) {
-			// Make sure we only register middleware once:
-			// https://github.com/cloudflare/workers-sdk/issues/2386#issuecomment-1614715911
-			if (!registeredMiddleware) {
-				registeredMiddleware = true;
-				for (const middleware of worker.middleware) {
-					__facade_register__(middleware);
-				}
-			}
+	const fetchDispatcher: ExportedHandlerFetchHandler = function (
+		request,
+		env,
+		ctx
+	) {
+		if (worker.fetch === undefined) {
+			throw new Error("Handler does not export a fetch() function.");
+		}
+		return worker.fetch(request, env, ctx);
+	};
 
-			const __facade_modules_dispatch__: Dispatcher = function (type, init) {
+	return {
+		...worker,
+		fetch(request, env, ctx) {
+			const dispatcher: Dispatcher = function (type, init) {
 				if (type === "scheduled" && worker.scheduled !== undefined) {
 					const controller = new __Facade_ScheduledController__(
 						Date.now(),
@@ -109,28 +67,68 @@ const facade: ExportedHandler<unknown> & MissingExportHandlers = {
 					return worker.scheduled(controller, env, ctx);
 				}
 			};
+			return __facade_invoke__(request, env, ctx, dispatcher, fetchDispatcher);
+		},
+	};
+}
+
+function wrapWorkerEntrypoint(
+	klass: WorkerEntrypointConstructor
+): WorkerEntrypointConstructor {
+	// If we don't have any middleware defined, just return the handler as is
+	if (
+		__INTERNAL_WRANGLER_MIDDLEWARE__ === undefined ||
+		__INTERNAL_WRANGLER_MIDDLEWARE__.length === 0
+	) {
+		return klass;
+	}
+	// Otherwise, register all middleware once
+	for (const middleware of __INTERNAL_WRANGLER_MIDDLEWARE__) {
+		__facade_register__(middleware);
+	}
 
+	// `extend`ing `klass` here so other RPC methods remain callable
+	return class extends klass {
+		#fetchDispatcher: ExportedHandlerFetchHandler<Record<string, unknown>> = (
+			request,
+			env,
+			ctx
+		) => {
+			this.env = env;
+			this.ctx = ctx;
+			if (super.fetch === undefined) {
+				throw new Error("Entrypoint class does not define a fetch() function.");
+			}
+			return super.fetch(request);
+		};
+
+		#dispatcher: Dispatcher = (type, init) => {
+			if (type === "scheduled" && super.scheduled !== undefined) {
+				const controller = new __Facade_ScheduledController__(
+					Date.now(),
+					init.cron ?? "",
+					() => {}
+				);
+				return super.scheduled(controller);
+			}
+		};
+
+		fetch(request: Request<unknown, IncomingRequestCfProperties>) {
 			return __facade_invoke__(
 				request,
-				env,
-				ctx,
-				__facade_modules_dispatch__,
-				__facade_modules_fetch__
+				this.env,
+				this.ctx,
+				this.#dispatcher,
+				this.#fetchDispatcher
 			);
-		} else {
-			// We didn't have any middleware so we can skip the invocation chain,
-			// and just call the fetch handler directly
-
-			// We "don't care" if this is undefined as we want to have the same behavior
-			// as if the worker completely bypassed middleware.
-			return __facade_modules_fetch__(request, env, ctx);
 		}
-	},
-};
-
-type HandlerFn<D, R> = (data: D, env: unknown, ctx: ExecutionContext) => R;
-function maskHandlerEnv<D, R>(handler: HandlerFn<D, R>): HandlerFn<D, R> {
-	return (data, env, ctx) => handler(data, getMaskedEnv(env), ctx);
+	};
 }
 
-export default facade;
+let WRAPPED_ENTRY: ExportedHandler | WorkerEntrypointConstructor | undefined;
+if (typeof ENTRY === "object") {
+	WRAPPED_ENTRY = wrapExportedHandler(ENTRY);
+} else if (typeof ENTRY === "function") {
+	WRAPPED_ENTRY = wrapWorkerEntrypoint(ENTRY);
+}
+export default WRAPPED_ENTRY;

package/templates/middleware/middleware-ensure-req-body-drained.ts

@@ -16,4 +16,3 @@ const drainBody: Middleware = async (request, env, _ctx, middlewareCtx) => {
 };
 
 export default drainBody;
-export const wrap = undefined;

package/templates/middleware/middleware-miniflare3-json-error.ts

@@ -30,4 +30,3 @@ const jsonError: Middleware = async (request, env, _ctx, middlewareCtx) => {
 };
 
 export default jsonError;
-export const wrap = undefined;

package/templates/no-op-assets-worker.ts

@@ -0,0 +1,33 @@
+/**
+ * This Worker is used as a default entry-point for Assets-only
+ * Workers. It proxies the request directly on to the Asset Sever
+ * Worker service binding.
+ *
+ * In an Assets-only Workers world, we want to enable users
+ * to deploy a Worker with Assets without ever having to provide
+ * a User Worker.
+ *
+ * ```bash
+ * wrangler dev --experimental-assets dist
+ * wrangler deploy --experimental-assets dist
+ * ```
+ *
+ * ```toml
+ * name = "assets-only-worker"
+ * compatibility_date = "2024-01-01"
+ * ```
+ *
+ * Without a user-defined Worker, which usually serves as the entry
+ * point in the bundling process, wrangler needs to default to some
+ * other entry-point Worker for all intents and purposes. This is what
+ * this Worker is.
+ */
+type Env = {
+	ASSET_SERVER: Fetcher;
+};
+
+export default {
+	async fetch(request: Request, env: Env) {
+		return env.ASSET_SERVER.fetch(request);
+	},
+};

package/templates/pages-template-plugin.ts

@@ -41,14 +41,14 @@ type EventPluginContext<Env, P extends string, Data, PluginArgs> = {
 declare type PagesFunction<
 	Env = unknown,
 	P extends string = string,
-	Data extends Record<string, unknown> = Record<string, unknown>
+	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
+	PluginArgs = unknown,
 > = (
 	context: EventPluginContext<Env, P, Data, PluginArgs>
 ) => Response | Promise<Response>;

package/templates/pages-template-worker.ts

@@ -29,7 +29,7 @@ type EventContext<Env, P extends string, Data> = {
 declare type PagesFunction<
 	Env = unknown,
 	P extends string = string,
-	Data extends Record<string, unknown> = Record<string, unknown>
+	Data extends Record<string, unknown> = Record<string, unknown>,
 > = (context: EventContext<Env, P, Data>) => Response | Promise<Response>;
 /* end @cloudflare/workers-types */
 

package/templates/startDevWorker/InspectorProxyWorker.ts

@@ -60,7 +60,10 @@ function isDevToolsEvent<Method extends DevToolsEvents["method"]>(
 }
 
 export class InspectorProxyWorker implements DurableObject {
-	constructor(_state: DurableObjectState, readonly env: Env) {}
+	constructor(
+		_state: DurableObjectState,
+		readonly env: Env
+	) {}
 
 	websockets: {
 		proxyController?: WebSocket;

package/templates/startDevWorker/ProxyWorker.ts

@@ -33,7 +33,10 @@ export default {
 } as ExportedHandler<Env, unknown, ProxyWorkerIncomingRequestBody>;
 
 export class ProxyWorker implements DurableObject {
-	constructor(readonly state: DurableObjectState, readonly env: Env) {}
+	constructor(
+		readonly state: DurableObjectState,
+		readonly env: Env
+	) {}
 
 	proxyData?: ProxyData;
 	requestQueue = new Map<Request, DeferredPromise<Response>>();
@@ -121,11 +124,18 @@ export class ProxyWorker implements DurableObject {
 			Object.assign(userWorkerUrl, proxyData.userWorkerUrl);
 
 			// set request.url in the UserWorker
-			const innerUrl = new URL(request.url);
-			Object.assign(innerUrl, proxyData.userWorkerInnerUrlOverrides);
+			const innerUrl = urlFromParts(
+				proxyData.userWorkerInnerUrlOverrides ?? {},
+				request.url
+			);
 			headers.set("MF-Original-URL", innerUrl.href);
 			headers.set("MF-Disable-Pretty-Error", "true"); // disables the UserWorker miniflare instance from rendering the pretty error -- instead the ProxyWorker miniflare instance will intercept the json error response and render the pretty error page
 
+			// Preserve client `Accept-Encoding`, rather than using Worker's default
+			// of `Accept-Encoding: br, gzip`
+			const encoding = request.cf?.clientAcceptEncoding;
+			if (encoding !== undefined) headers.set("Accept-Encoding", encoding);
+
 			rewriteUrlRelatedHeaders(headers, outerUrl, innerUrl);
 
 			// merge proxyData headers with the request headers
@@ -268,28 +278,7 @@ function insertLiveReloadScript(
 				websocketUrl.protocol =
 					websocketUrl.protocol === "http:" ? "ws:" : "wss:";
 
-				end.append(
-					`
-					<script>
-						(function() {
-							var ws;
-							function recover() {
-								ws = null;
-								setTimeout(initLiveReload, 100);
-							}
-							function initLiveReload() {
-								if (ws) return;
-                var origin = (location.protocol === "http:" ? "ws://" : "wss://") + location.host;
-								ws = new WebSocket(origin + "/cdn-cgi/live-reload", "${LIVE_RELOAD_PROTOCOL}");
-								ws.onclose = recover;
-								ws.onerror = recover;
-								ws.onmessage = location.reload.bind(location);
-							}
-						})();
-					</script>
-				`,
-					{ html: true }
-				);
+				end.append(liveReloadScript, { html: true });
 			}
 		},
 	});
@@ -297,6 +286,27 @@ function insertLiveReloadScript(
 	return htmlRewriter.transform(response);
 }
 
+const liveReloadScript = `
+<script defer type="application/javascript">
+	(function() {
+		var ws;
+		function recover() {
+			ws = null;
+			setTimeout(initLiveReload, 100);
+		}
+		function initLiveReload() {
+			if (ws) return;
+			var origin = (location.protocol === "http:" ? "ws://" : "wss://") + location.host;
+			ws = new WebSocket(origin + "/cdn-cgi/live-reload", "${LIVE_RELOAD_PROTOCOL}");
+			ws.onclose = recover;
+			ws.onerror = recover;
+			ws.onmessage = location.reload.bind(location);
+		}
+		initLiveReload();
+	})();
+</script>
+`;
+
 /**
  * Rewrite references to URLs in request/response headers.
  *