perf(collab): faster WS reconnect + lower test timeouts

CONNECT_TIMEOUT_MS: 5s → 2s (localhost WS opens in <50ms)
Reconnect backoff: 1s base/30s cap → 250ms base/5s cap
onclose: reconnect on code 1000 if connection never fully initialized

Test timeouts: 135s → 30s (removed test.slow()), waitForEditorReady
60s → 25s. Suite runs in 2m vs 3.3m previously.

Remaining Firefox flake is browser-level: WS upgrade hangs at HTTP
protocol level after ~128 prior tests. Always passes on retry.

Author: dezren39

pkgs/id/e2e/tests/websocket.spec.ts

@@ -1,9 +1,10 @@
 import { expect, type Page, test } from "@playwright/test";
 
 // WebSocket tests need more headroom than basic tests because Firefox's WS
-// handshake can occasionally hang (~20s browser timeout + 1s reconnect delay).
-// 45s gives enough room for one reconnect cycle within a single test.
-test.setTimeout(45_000);
+// handshake can occasionally hang (~20s browser timeout + reconnect delay).
+// 30s gives enough room for multiple reconnect cycles (2s timeout + 0.25–5s
+// backoff each) within a single test.
+test.setTimeout(30_000);
 
 /**
  * WebSocket & Collab E2E tests for the id web UI.
@@ -98,12 +99,12 @@ async function createFileWithUniqueContent(page: Page, name: string, baseURL: st
   expect(saveResp.ok()).toBeTruthy();
 
   // Navigate directly to file — tests that direct URL access works (bookmarks,
-  // link sharing, page refresh). The 5s connect timeout in collab.ts handles
+  // link sharing, page refresh). The 2s connect timeout in collab.ts handles
   // any WS init race on full page load.
   //
   // NOTE: Do NOT use waitForLoadState("networkidle") here. The WS upgrade
   // request counts as a pending connection; if Firefox's handshake hangs,
-  // the 5s connect timeout fires → scheduleReconnect → new pending request,
+  // the 2s connect timeout fires → scheduleReconnect → new pending request,
   // resetting networkidle's 500ms idle counter. This loop eats 30s+ of test
   // budget before networkidle gives up. waitForEditorReady() handles all the
   // real waiting by polling JS/DOM state directly.
@@ -119,11 +120,10 @@ test.describe("WebSocket Connection + Editor Ready", () => {
   test("editor status shows connected after WS handshake", async ({ page, baseURL }) => {
     // This is the first WS test in the full suite (~test #129). In Firefox,
     // the browser process accumulates state from ~128 prior tests that can
-    // cause the first WS upgrade request to hang in CONNECTING state. The 5s
-    // connect timeout + reconnect mechanism in collab.ts handles recovery,
-    // but may need multiple cycles. Mark slow (3x timeout = 135s) to allow
-    // up to ~5 reconnect attempts without timing out.
-    test.slow();
+    // cause the first WS upgrade request to hang in CONNECTING state. The 2s
+    // connect timeout + fast reconnect (250ms base backoff) in collab.ts
+    // recovers in ~2.5s per attempt, so default 20s waitForEditorReady
+    // easily handles 5+ reconnect cycles without needing test.slow().
 
     const fileName = `ws-connect-${Date.now()}.txt`;
 
@@ -138,10 +138,8 @@ test.describe("WebSocket Connection + Editor Ready", () => {
     // Use unique content to avoid shared collab document under Firefox load
     await createFileWithUniqueContent(page, fileName, baseURL!);
 
-    // Wait for editor to be fully ready — generous timeout for first WS
-    // connection which may need multiple reconnect cycles in Firefox.
-    // 5s connect timeout + 1-8s backoff per attempt × up to 5 attempts ≈ 55s
-    await waitForEditorReady(page, 60_000);
+    // Wait for editor to be fully ready
+    await waitForEditorReady(page);
 
     // Verify WebSocket is connected
     const wsConnected = await page.evaluate(() => {

pkgs/id/web/src/collab.ts

@@ -103,10 +103,10 @@ export function initCollab(
   // we don't spuriously reconnect after an intentional disconnect.
   let intentionalClose = false;
   // App-level connection timeout — if the WS doesn't reach OPEN within this
-  // many ms, we close it and let onclose → scheduleReconnect handle retry.
+  // many ms, we close it and schedule reconnect directly.
   // Browsers default to ~20s TCP timeout which is far too slow for UX.
   let connectTimer: ReturnType<typeof setTimeout> | null = null;
-  const CONNECT_TIMEOUT_MS = 5000;
+  const CONNECT_TIMEOUT_MS = 2000;
 
   // Track our clientID (set when editor initializes)
   let myClientID: number | null = null;
@@ -142,8 +142,10 @@ export function initCollab(
     }
 
     // Exponential backoff with jitter: base * 2^attempt + random jitter
-    const baseDelay = Math.min(1000 * 2 ** reconnectAttempts, 30000);
-    const jitter = Math.random() * Math.min(1000, baseDelay * 0.2);
+    // Fast initial retries (250ms) for localhost/LAN; caps at 5s for WAN.
+    // Combined with 2s connect timeout: worst-case cycle ≈ 2.25–7s per attempt.
+    const baseDelay = Math.min(250 * 2 ** reconnectAttempts, 5000);
+    const jitter = Math.random() * Math.min(250, baseDelay * 0.2);
     const delay = baseDelay + jitter;
     reconnectAttempts++;
 
@@ -405,16 +407,21 @@ export function initCollab(
         connectTimer = null;
       }
       console.log("[collab] Disconnected:", event.code, event.reason);
+      const wasConnected = connected;
       connected = false;
       // Only reconnect if this was NOT an intentional disconnect.
       // We check both the intentionalClose flag AND event.code because:
       // - intentionalClose: covers client-initiated disconnect() calls where the
       //   close handshake may fail/timeout, causing the browser to fire onclose
       //   with code 1006 instead of the requested 1000
-      // - event.code === 1000: covers server-initiated clean closes
+      // - event.code === 1000 AND wasConnected: covers server-initiated clean
+      //   closes when we had a working session. We MUST still reconnect if the
+      //   connection dropped before we were fully connected (e.g., immediately
+      //   after WS handshake but before Init message was processed), because
+      //   that indicates a transient failure, not an intentional close.
       const wasIntentional = intentionalClose;
       intentionalClose = false;
-      if (!wasIntentional && event.code !== 1000) {
+      if (!wasIntentional && !(event.code === 1000 && wasConnected)) {
         // Update cursor state if editor was already initialized
         if (editorInstance) {
           setConnectionState(editorInstance.view, "disconnected");