wrangler: Hyperdrive dev bindings (#4222)

* Add Hyperdrive binding support in wrangler dev

* remove hyperdrive local dev warning

* Add changeset

* Add e2e tests for Hyperdrive

* empty commit to kick off builds

.changeset/silver-goats-tickle.md

@@ -0,0 +1,5 @@
+---
+"wrangler": patch
+---
+
+Support for hyperdrive bindings in local wrangler dev

packages/wrangler/e2e/dev.test.ts

@@ -1,10 +1,11 @@
 import crypto from "node:crypto";
+import * as nodeNet from "node:net";
 import path from "node:path";
 import { setTimeout } from "node:timers/promises";
 import getPort from "get-port";
 import shellac from "shellac";
 import { fetch } from "undici";
-import { beforeEach, describe, expect, it } from "vitest";
+import { afterEach, beforeEach, describe, expect, it } from "vitest";
 import { retry } from "./helpers/retry";
 import { dedent, makeRoot, seed } from "./helpers/setup";
 import { WRANGLER } from "./helpers/wrangler-command";
@@ -278,3 +279,94 @@ describe("dev registry", () => {
 		});
 	});
 });
+
+describe("hyperdrive dev tests", () => {
+	let worker: DevWorker;
+	let server: nodeNet.Server;
+
+	beforeEach(async () => {
+		worker = await makeWorker();
+		server = nodeNet.createServer().listen();
+		let port = 5432;
+		if (server.address() && typeof server.address() !== "string") {
+			port = (server.address() as nodeNet.AddressInfo).port;
+		}
+		await worker.seed((workerName) => ({
+			"wrangler.toml": dedent`
+					name = "${workerName}"
+					main = "src/index.ts"
+					compatibility_date = "2023-10-25"
+					
+					[[hyperdrive]]
+					binding = "HYPERDRIVE"
+					id = "hyperdrive_id"
+					localConnectionString = "postgresql://user:[email protected]:${port}/some_db"
+			`,
+			"src/index.ts": dedent`
+					export default {
+						async fetch(request, env) {
+							if (request.url.includes("connect")) {
+								const conn = env.HYPERDRIVE.connect();
+								await conn.writable.getWriter().write(new TextEncoder().encode("test string"));
+							}
+							return new Response(env.HYPERDRIVE?.connectionString ?? "no")
+						}
+					}`,
+			"package.json": dedent`
+					{
+						"name": "${workerName}",
+						"version": "0.0.0",
+						"private": true
+					}
+					`,
+		}));
+	});
+
+	it("matches expected configuration parameters", async () => {
+		await worker.runDevSession("", async (port) => {
+			const { text } = await retry(
+				(s) => {
+					return s.status !== 200;
+				},
+				async () => {
+					const resp = await fetch(`http://127.0.0.1:${port}`);
+					return { text: await resp.text(), status: resp.status };
+				}
+			);
+			const url = new URL(text);
+			expect(url.pathname).toBe("/some_db");
+			expect(url.username).toBe("user");
+			expect(url.password).toBe("pass");
+			expect(url.host).not.toBe("localhost");
+		});
+	});
+
+	it("connects to a socket", async () => {
+		const socketMsgPromise = new Promise((resolve, _) => {
+			server.on("connection", (sock) => {
+				sock.on("data", (data) => {
+					expect(new TextDecoder().decode(data)).toBe("test string");
+					server.close();
+					resolve({});
+				});
+			});
+		});
+		await worker.runDevSession("", async (port) => {
+			await retry(
+				(s) => {
+					return s.status !== 200;
+				},
+				async () => {
+					const resp = await fetch(`http://127.0.0.1:${port}/connect`);
+					return { text: await resp.text(), status: resp.status };
+				}
+			);
+		});
+		await socketMsgPromise;
+	});
+	afterEach(() => {
+		if (server.listening) {
+			server.close();
+		}
+	});
+});

packages/wrangler/src/config/environment.ts

@@ -523,6 +523,8 @@ interface EnvironmentNonInheritable {
 		binding: string;
 		/** The id of the database. */
 		id: string;
+		/** The local database connection string for `wrangler dev` */
+		localConnectionString?: string;
 	}[];
 
 	/**

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

@@ -164,6 +164,7 @@ export interface CfConstellation {
 export interface CfHyperdrive {
 	binding: string;
 	id: string;
+	localConnectionString?: string;
 }
 
 interface CfService {

packages/wrangler/src/dev.tsx

@@ -955,7 +955,14 @@ function getBindings(
 		],
 		vectorize: configParam.vectorize,
 		constellation: configParam.constellation,
-		hyperdrive: configParam.hyperdrive,
+		hyperdrive: configParam.hyperdrive.map((hyperdrive) => {
+			if (!hyperdrive.localConnectionString) {
+				throw new Error(
+					`In development, you should use a local postgres connection string to emulate hyperdrive functionality. Please setup postgres locally and set the value of "${hyperdrive.binding}"'s "localConnectionString" to the postgres connection string in your wrangler.toml`
+				);
+			}
+			return hyperdrive;
+		}),
 	};
 
 	return bindings;

packages/wrangler/src/dev/dev.tsx

@@ -298,12 +298,6 @@ function DevSession(props: DevSessionProps) {
 		);
 	}
 
-	if (props.local && props.bindings.hyperdrive?.length) {
-		logger.warn(
-			"Hyperdrive does not currently support 'wrangler dev' in local mode at this stage of the beta. Use the '--remote' flag to test a Hyperdrive configuration before deploying."
-		);
-	}
-
 	const announceAndOnReady: typeof props.onReady = (finalIp, finalPort) => {
 		if (process.send) {
 			process.send(

packages/wrangler/src/dev/miniflare.ts

@@ -18,6 +18,7 @@ import type { Config } from "../config";
 import type {
 	CfD1Database,
 	CfDurableObject,
+	CfHyperdrive,
 	CfKvNamespace,
 	CfQueue,
 	CfR2Bucket,
@@ -201,6 +202,9 @@ function d1DatabaseEntry(db: CfD1Database): [string, string] {
 function queueProducerEntry(queue: CfQueue): [string, string] {
 	return [queue.binding, queue.queue_name];
 }
+function hyperdriveEntry(hyperdrive: CfHyperdrive): [string, string] {
+	return [hyperdrive.binding, hyperdrive.localConnectionString ?? ""];
+}
 type QueueConsumer = NonNullable<Config["queues"]["consumers"]>[number];
 function queueConsumerEntry(consumer: QueueConsumer) {
 	const options = {
@@ -318,6 +322,9 @@ function buildBindingOptions(config: ConfigBundle) {
 		queueConsumers: Object.fromEntries(
 			config.queueConsumers?.map(queueConsumerEntry) ?? []
 		),
+		hyperdrives: Object.fromEntries(
+			bindings.hyperdrive?.map(hyperdriveEntry) ?? []
+		),
 
 		durableObjects: Object.fromEntries([
 			...internalObjects.map(({ name, class_name }) => [name, class_name]),