slightly improve wrangler dev bindings loggings (#9507)

* slightly improve wrangler dev bindings loggings

* fixup! slightly improve wrangler dev bindings loggings

update dev-mixed-mode snapshot

Author: dario-piotrowicz

.changeset/clean-eyes-lead.md

@@ -0,0 +1,10 @@
+---
+"wrangler": patch
+---
+
+slightly improve wrangler dev bindings loggings
+
+improve the bindings loggings by:
+
+- removing the unnecessary (and potentially incorrect) `[connected]` suffix for remote bindings
+- making sure that the modes presented in the bindings logs are correctly aligned

packages/wrangler/e2e/dev-mixed-mode.test.ts

@@ -186,7 +186,7 @@ describe("wrangler dev - mixed mode", () => {
 		expect(normalizeOutput(worker.currentOutput)).toMatchInlineSnapshot(`
 			"Your Worker has access to the following bindings:
 			Binding        Resource      Mode
-			env.AI         AI      remote
+			env.AI         AI            remote
 			[wrangler:info] Ready on http://<HOST>:<PORT>
 			▲ [WARNING] AI bindings always access remote resources, and so may incur usage charges even in local dev. To suppress this warning, set \`remote: true\` for the binding definition in your configuration file.
 			⎔ Starting local server...

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

@@ -1585,8 +1585,8 @@ describe.sequential("wrangler dev", () => {
 			expect(std.out).toMatchInlineSnapshot(`
 				"Your Worker has access to the following bindings:
 				Binding              Resource      Mode
-				env.WorkerA (A)      Worker      local [not connected]
-				env.WorkerB (B)      Worker      local [not connected]
+				env.WorkerA (A)      Worker        local [not connected]
+				env.WorkerB (B)      Worker        local [not connected]
 
 				"
 			`);
@@ -1607,8 +1607,8 @@ describe.sequential("wrangler dev", () => {
 			expect(std.out).toMatchInlineSnapshot(`
 				"Your Worker has access to the following bindings:
 				Binding              Resource      Mode
-				env.WorkerA (A)      Worker      local [not connected]
-				env.WorkerB (B)      Worker      local [not connected]
+				env.WorkerA (A)      Worker        local [not connected]
+				env.WorkerB (B)      Worker        local [not connected]
 
 				"
 			`);
@@ -1756,7 +1756,7 @@ describe.sequential("wrangler dev", () => {
 				env.MY_QUEUE_PRODUCES (my-queue)                 Queue             remote
 				env.MY_D1 (xxx)                                  D1 Database       remote
 				env.MY_R2 (my-bucket)                            R2 Bucket         remote
-				env.WorkerA (A)                                  Worker            remote [connected]
+				env.WorkerA (A)                                  Worker            remote
 
 				"
 			`);

packages/wrangler/src/utils/print-bindings.ts

@@ -349,7 +349,7 @@ export function printBindings(
 				}
 
 				if (remote) {
-					mode = getMode({ isSimulatedLocally: false, connected: true });
+					mode = getMode({ isSimulatedLocally: false });
 				} else if (context.local && context.registry !== null) {
 					const registryDefinition = context.registry?.[service];
 					hasConnectionStatus = true;
@@ -585,15 +585,26 @@ export function printBindings(
 			title = "Your Worker has access to the following bindings:";
 		}
 
+		const headings = {
+			binding: "Binding",
+			resource: "Resource",
+			mode: "Mode",
+		} as const;
+
 		const maxValueLength = Math.max(
 			...output.map((b) =>
 				typeof b.value === "symbol" ? "inherited".length : b.value?.length ?? 0
 			)
 		);
 		const maxNameLength = Math.max(...output.map((b) => b.name.length));
-		const maxTypeLength = Math.max(...output.map((b) => b.type.length));
+		const maxTypeLength = Math.max(
+			...output.map((b) => b.type.length),
+			headings.resource.length
+		);
 		const maxModeLength = Math.max(
-			...output.map((b) => (b.mode ? stripAnsi(b.mode).length : "Mode".length))
+			...output.map((b) =>
+				b.mode ? stripAnsi(b.mode).length : headings.mode.length
+			)
 		);
 
 		const hasMode = output.some((b) => b.mode);
@@ -622,7 +633,7 @@ export function printBindings(
 			: " ".repeat(columnGapSpaces);
 
 		logger.log(
-			`${padEndAnsi(dim("Binding"), shouldWrap ? bindingPrefix.length + maxNameLength : bindingLength)}${columnGap}${padEndAnsi(dim("Resource"), maxTypeLength)}${columnGap}${hasMode ? dim("Mode") : ""}`
+			`${padEndAnsi(dim(headings.binding), shouldWrap ? bindingPrefix.length + maxNameLength : bindingLength)}${columnGap}${padEndAnsi(dim(headings.resource), maxTypeLength)}${columnGap}${hasMode ? dim(headings.mode) : ""}`
 		);
 
 		for (const binding of output) {