chore: bump esbuild to 0.18.20

.changeset/empty-kids-agree.md

@@ -0,0 +1,15 @@
+---
+"wrangler": major
+---
+
+chore: bump `esbuild` to [`0.18.20`](https://github.com/evanw/esbuild/blob/main/CHANGELOG.md#01820)
+
+Previously, Wrangler used `esbuild@0.17.19` when bundling your Worker. Notable changes include:
+
+- [Breaking changes](https://github.com/evanw/esbuild/blob/main/CHANGELOG.md#0180) to `tsconfig.json` support
+- Support for [auto-accessors](https://github.com/tc39/proposal-grouped-and-auto-accessors?tab=readme-ov-file#auto-accessors)
+- Support for [explicit resource management](https://github.com/tc39/proposal-explicit-resource-management) with `using` declarations
+
+Note `esbuild` only transforms `using` syntax by default, relying on runtime support for `Symbol.dispose` and `Symbol.asyncDispose`. The Workers runtime doesn't provide these symbols yet, so Wrangler automatically injects polyfills for them. This allows you to use `using` without any additional changes.
+
+Unfortunately, we currently aren't able to bump to [`0.19.0`](https://github.com/evanw/esbuild/blob/main/CHANGELOG.md#0190) and above. This version changes how dynamic `import()`s are handled in a way that's incompatible with Wrangler's own module collection behaviour. We're currently investigating potential workarounds.

fixtures/worker-app/src/index.js

@@ -12,6 +12,31 @@ function hexEncode(array) {
 		.join("");
 }
 
+/** @param {string[]} logs */
+function connect(logs) {
+	logs.push("Connected");
+	return {
+		send(message) {
+			logs.push(`Sent ${message}`);
+		},
+		[Symbol.dispose]() {
+			logs.push("Disconnected synchronously");
+		},
+		async [Symbol.asyncDispose]() {
+			logs.push("Disconnected asynchronously");
+		},
+	};
+}
+
+/** @param {string[]} logs */
+async function testExplicitResourceManagement(logs) {
+	using syncConnect = connect(logs);
+	await using asyncConnect = connect(logs);
+
+	syncConnect.send("hello");
+	asyncConnect.send("goodbye");
+}
+
 export default {
 	async fetch(request) {
 		console.log("request log");
@@ -39,6 +64,12 @@ export default {
 				],
 			});
 
+		if (pathname === "/explicit-resource-management") {
+			const logs = [];
+			await testExplicitResourceManagement(logs);
+			return Response.json(logs);
+		}
+
 		if (request.headers.get("X-Test-URL") !== null) {
 			return new Response(request.url);
 		}

fixtures/worker-app/tests/index.test.ts

@@ -148,4 +148,20 @@ describe("'wrangler dev' correctly renders pages", () => {
 			`hello2=world2; Domain=${ip}; Secure`,
 		]);
 	});
+
+	it("uses explicit resource management", async ({ expect }) => {
+		const response = await fetch(
+			`http://${ip}:${port}/explicit-resource-management`
+		);
+		expect(await response.json()).toMatchInlineSnapshot(`
+			[
+			  "Connected",
+			  "Connected",
+			  "Sent hello",
+			  "Sent goodbye",
+			  "Disconnected asynchronously",
+			  "Disconnected synchronously",
+			]
+		`);
+	});
 });

package.json

@@ -47,7 +47,7 @@
 		"@turbo/gen": "^1.10.13",
 		"@vue/compiler-sfc": "^3.3.4",
 		"dotenv-cli": "^7.3.0",
-		"esbuild": "0.17.19",
+		"esbuild": "0.18.20",
 		"turbo": "^1.10.14"
 	},
 	"engines": {

packages/cli/package.json

@@ -29,7 +29,7 @@
 		"@typescript-eslint/eslint-plugin": "^5.55.0",
 		"@typescript-eslint/parser": "^5.55.0",
 		"chalk": "^2.4.2",
-		"esbuild": "^0.17.12",
+		"esbuild": "0.18.20",
 		"log-update": "^5.0.1",
 		"pnpm": "^8.6.11",
 		"undici": "5.28.3"

packages/miniflare/package.json

@@ -75,7 +75,7 @@
 		"concurrently": "^8.2.2",
 		"devalue": "^4.3.0",
 		"devtools-protocol": "^0.0.1182435",
-		"esbuild": "^0.16.17",
+		"esbuild": "0.18.20",
 		"eslint": "^8.6.0",
 		"eslint-config-prettier": "^9.0.0",
 		"eslint-plugin-es": "^4.1.0",

packages/miniflare/scripts/build.mjs

@@ -70,9 +70,9 @@ const rewriteNodeToInternalPlugin = {
 };
 
 /**
- * @type {Map<string, esbuild.BuildResult>}
+ * @type {Map<string, esbuild.BuildContext>}
  */
-const workersBuilders = new Map();
+const workerContexts = new Map();
 /**
  * @type {esbuild.Plugin}
  */
@@ -93,9 +93,9 @@ const embedWorkersPlugin = {
 			return { path: result.path, namespace };
 		});
 		build.onLoad({ filter: /.*/, namespace }, async (args) => {
-			let builder = workersBuilders.get(args.path);
-			if (builder === undefined) {
-				builder = await esbuild.build({
+			let context = workerContexts.get(args.path);
+			if (context === undefined) {
+				context = await esbuild.context({
 					platform: "node", // Marks `node:*` imports as external
 					format: "esm",
 					target: "esnext",
@@ -104,7 +104,6 @@ const embedWorkersPlugin = {
 					sourcesContent: false,
 					external: ["miniflare:shared", "miniflare:zod"],
 					metafile: true,
-					incremental: watch, // Allow `rebuild()` calls if watching
 					entryPoints: [args.path],
 					minifySyntax: true,
 					outdir: build.initialOptions.outdir,
@@ -115,22 +114,21 @@ const embedWorkersPlugin = {
 							? [rewriteNodeToInternalPlugin]
 							: [],
 				});
-			} else {
-				builder = await builder.rebuild();
+				workerContexts.set(args.path, context);
 			}
-			workersBuilders.set(args.path, builder);
+			const result = await context.rebuild();
 			await fs.mkdir("worker-metafiles", { recursive: true });
 			await fs.writeFile(
 				path.join(
 					"worker-metafiles",
 					path.basename(args.path) + ".metafile.json"
 				),
-				JSON.stringify(builder.metafile)
+				JSON.stringify(result.metafile)
 			);
 			let outPath = args.path.substring(workersRoot.length + 1);
 			outPath = outPath.substring(0, outPath.lastIndexOf(".")) + ".js";
 			outPath = JSON.stringify(outPath);
-			const watchFiles = Object.keys(builder.metafile.inputs);
+			const watchFiles = Object.keys(result.metafile.inputs);
 			const contents = `
       import fs from "fs";
       import path from "path";
@@ -164,7 +162,7 @@ async function buildPackage() {
 	}
 	const outPath = path.join(pkgRoot, "dist");
 
-	await esbuild.build({
+	const context = await esbuild.context({
 		platform: "node",
 		format: "cjs",
 		target: "esnext",
@@ -187,11 +185,19 @@ async function buildPackage() {
 		],
 		plugins: [embedWorkersPlugin],
 		logLevel: watch ? "info" : "warning",
-		watch,
 		outdir: outPath,
 		outbase: pkgRoot,
 		entryPoints: [indexPath, ...testPaths],
 	});
+	if (watch) {
+		await context.watch();
+	} else {
+		await context.rebuild();
+		await context.dispose();
+		for (const workerContext of workerContexts.values()) {
+			await workerContext.dispose();
+		}
+	}
 }
 
 await buildPackage();

packages/vitest-pool-workers/package.json

@@ -41,7 +41,7 @@
 		"birpc": "0.2.14",
 		"cjs-module-lexer": "^1.2.3",
 		"devalue": "^4.3.0",
-		"esbuild": "0.17.19",
+		"esbuild": "0.18.20",
 		"import-meta-resolve": "^4.0.0",
 		"miniflare": "workspace:*",
 		"wrangler": "workspace:*",

packages/wrangler/package.json

@@ -106,7 +106,7 @@
 		"@esbuild-plugins/node-modules-polyfill": "^0.2.2",
 		"blake3-wasm": "^2.1.5",
 		"chokidar": "^3.5.3",
-		"esbuild": "0.17.19",
+		"esbuild": "0.18.20",
 		"miniflare": "workspace:*",
 		"nanoid": "^3.3.3",
 		"path-to-regexp": "^6.2.0",

packages/wrangler/src/__tests__/middleware.test.ts

@@ -842,15 +842,15 @@ describe("middleware", () => {
 			}
 
 
-			var __Facade_ScheduledController__ = class {
+			var __Facade_ScheduledController__ = class ___Facade_ScheduledController__ {
 			  constructor(scheduledTime, cron, noRetry) {
 			    this.scheduledTime = scheduledTime;
 			    this.cron = cron;
 			    this.#noRetry = noRetry;
 			  }
 			  #noRetry;
 			  noRetry() {
-			    if (!(this instanceof __Facade_ScheduledController__)) {
+			    if (!(this instanceof ___Facade_ScheduledController__)) {
 			      throw new TypeError(\\"Illegal invocation\\");
 			    }
 			    this.#noRetry();

packages/wrangler/src/deployment-bundle/bundle.ts

@@ -298,6 +298,12 @@ export async function bundleWorker(
 	// imported in this injected module. Importing that module registers watchers.
 	inject.push(path.resolve(getBasePath(), "templates/modules-watch-stub.js"));
 
+	// Whilst `esbuild` includes support for transforming `using` and
+	// `await using` syntax, it doesn't polyfill missing built-in `Symbol`s.
+	// These aren't defined by the version of V8 `workerd` uses at the moment,
+	// so polyfill them if they're not set.
+	inject.push(path.resolve(getBasePath(), "templates/symbol-dispose.js"));
+
 	const buildOptions: esbuild.BuildOptions & { metafile: true } = {
 		// Don't use entryFile here as the file may have been changed when applying the middleware
 		entryPoints: [entry.file],

packages/wrangler/templates/symbol-dispose.js

@@ -0,0 +1,6 @@
+// Whilst `esbuild` includes support for transforming `using` and `await using`
+// syntax, it doesn't polyfill missing built-in `Symbol`s. These aren't defined
+// by the version of V8 `workerd` uses at the moment, so polyfill them if
+// they're not set.
+Symbol.dispose ??= Symbol("Symbol.dispose");
+Symbol.asyncDispose ??= Symbol("Symbol.asyncDispose");