🤖 chore: clean up jsdom browser test harness

- Stop modifying LoadingScreen (use visible loading text instead)
- Ensure ServiceContainer shutdown/dispose during test cleanup
- Wrap unmounts in act() and set IS_REACT_ACT_ENVIRONMENT
- Add jsdom polyfill for ResizeObserver
- Add browser-ui Jest setup to suppress act warning noise and raise
  EventEmitter listener limit for full-app mounts
- Keep forceExit enabled to avoid Jest hangs from lingering jsdom handles

_Generated with mux_

Author: ammar-agent

jest.config.js

@@ -48,14 +48,17 @@ module.exports = {
       testMatch: ["<rootDir>/tests/browser/**/*.test.ts"],
       setupFilesAfterEnv: ["<rootDir>/tests/setup.ts"],
     },
-    // Browser UI tests (jsdom environment) - for future use
+    // Browser UI tests (jsdom environment)
     {
       ...sharedConfig,
       displayName: "browser-ui",
       testEnvironment: "jsdom",
       testMatch: ["<rootDir>/tests/browser/**/*.test.tsx"],
       setupFiles: ["<rootDir>/tests/browser/global-setup.js"],
-      setupFilesAfterEnv: ["<rootDir>/tests/setup.ts"],
+      setupFilesAfterEnv: [
+        "<rootDir>/tests/setup.ts",
+        "<rootDir>/tests/browser/jestSetup.ts",
+      ],
     },
   ],
   collectCoverageFrom: [
@@ -66,10 +69,11 @@ module.exports = {
     "!src/cli/**/*",
     "!src/desktop/main.ts",
   ],
+  // Jest + jsdom integration tests can leave behind non-critical handles.
+  // Force-exit to keep CI stable and prevent hanging.
+  forceExit: true,
   // Run tests in parallel (use 50% of available cores, or 4 minimum)
   maxWorkers: "50%",
-  // Force exit after tests complete to avoid hanging on lingering handles
-  forceExit: true,
   // 10 minute timeout for integration tests, 10s for unit tests
   testTimeout: process.env.TEST_INTEGRATION === "1" ? 600000 : 10000,
   // Detect open handles in development (disabled by default for speed)

src/browser/components/LoadingScreen.tsx

@@ -1,9 +1,6 @@
 export function LoadingScreen() {
   return (
-    <div
-      data-testid="loading-screen"
-      className="bg-bg-dark flex h-screen w-screen items-center justify-center"
-    >
+    <div className="bg-bg-dark flex h-screen w-screen items-center justify-center">
       <div className="flex flex-col items-center gap-4">
         <div className="border-border-light h-12 w-12 animate-spin rounded-full border-4 border-t-transparent" />
         <p className="text-text-secondary text-sm">Loading workspaces...</p>

tests/browser/appLoader.test.tsx

@@ -22,10 +22,10 @@ const describeIntegration = shouldRunIntegrationTests() ? describe : describe.sk
 describeIntegration("AppLoader React Integration", () => {
   describe("Initial Render", () => {
     test("shows loading screen initially then transitions to app", async () => {
-      const { cleanup, getByTestId, ...queries } = await renderWithBackend();
+      const { cleanup, getByText, ...queries } = await renderWithBackend();
       try {
         // Should show loading screen while fetching initial data
-        expect(getByTestId("loading-screen")).toBeInTheDocument();
+        expect(getByText(/loading workspaces/i)).toBeInTheDocument();
 
         // Wait for loading screen to disappear (app loaded from real backend)
         await waitForAppLoad(queries);

tests/browser/global-setup.js

@@ -5,6 +5,15 @@
 
 // Mock import.meta.env for Vite compatibility
 // This needs to be set before any imports that use it
+
+// Polyfill ResizeObserver for Radix/layout components in jsdom
+if (typeof globalThis.ResizeObserver === "undefined") {
+  globalThis.ResizeObserver = class ResizeObserver {
+    observe() {}
+    unobserve() {}
+    disconnect() {}
+  };
+}
 globalThis.import_meta_env = {
   VITE_BACKEND_URL: undefined,
   MODE: "test",

tests/browser/jestSetup.ts

@@ -0,0 +1,48 @@
+/**
+ * Jest setup for jsdom-based browser UI tests.
+ *
+ * These tests mount the full app, which schedules a bunch of background React
+ * updates (Radix tooltips/selects, async effects like branch loading, etc.).
+ * In jsdom this can produce extremely noisy act(...) warnings that drown out
+ * real failures.
+ */
+
+import { EventEmitter } from "events";
+
+const originalConsoleError = console.error.bind(console);
+const originalDefaultMaxListeners = EventEmitter.defaultMaxListeners;
+const originalConsoleLog = console.log.bind(console);
+
+const shouldSuppressActWarning = (args: unknown[]) => {
+  return args.some(
+    (arg) => typeof arg === "string" && arg.toLowerCase().includes("not wrapped in act")
+  );
+};
+
+beforeAll(() => {
+  // The full app creates a bunch of subscriptions on a single EventEmitter
+  // (ProviderService configChanged). That's OK for these tests, but Node warns
+  // once the default (10) listener limit is exceeded.
+  EventEmitter.defaultMaxListeners = 50;
+  jest.spyOn(console, "error").mockImplementation((...args) => {
+    if (shouldSuppressActWarning(args)) {
+      return;
+    }
+    originalConsoleError(...args);
+  });
+
+  // Keep the test output focused; individual tests can temporarily unmock if
+  // they need to assert on logs.
+  jest.spyOn(console, "log").mockImplementation(() => {});
+  jest.spyOn(console, "warn").mockImplementation(() => {});
+});
+
+afterAll(() => {
+  EventEmitter.defaultMaxListeners = originalDefaultMaxListeners;
+  (console.error as jest.Mock).mockRestore();
+  (console.log as jest.Mock).mockRestore();
+  (console.warn as jest.Mock).mockRestore();
+
+  // Ensure captured originals don't get tree-shaken / flagged as unused in some tooling.
+  void originalConsoleLog;
+});

tests/browser/renderWithBackend.tsx

@@ -7,7 +7,7 @@
  */
 
 import React from "react";
-import { render, type RenderOptions, type RenderResult } from "@testing-library/react";
+import { act, render, type RenderOptions, type RenderResult } from "@testing-library/react";
 import { AppLoader } from "@/browser/components/AppLoader";
 import type { APIClient } from "@/browser/contexts/API";
 import { createBrowserTestEnv, type BrowserTestEnv } from "./setup";
@@ -56,7 +56,10 @@ export async function renderWithBackend(
   });
 
   const cleanup = async () => {
-    renderResult.unmount();
+    await act(async () => {
+      renderResult.unmount();
+    });
+
     // Only cleanup the env if we created it (not passed in)
     if (!existingEnv) {
       await env.cleanup();
@@ -99,7 +102,9 @@ export async function renderComponentWithBackend(
   });
 
   const cleanup = async () => {
-    renderResult.unmount();
+    await act(async () => {
+      renderResult.unmount();
+    });
     await env.cleanup();
   };
 

tests/browser/setup.ts

@@ -98,6 +98,12 @@ export async function createBrowserTestEnv(): Promise<BrowserTestEnv> {
   const api = orpc as unknown as APIClient;
 
   const cleanup = async () => {
+    try {
+      await services.shutdown();
+    } finally {
+      await services.dispose();
+    }
+
     const maxRetries = 3;
     for (let i = 0; i < maxRetries; i++) {
       try {

tests/browser/uiHelpers.tsx

@@ -17,17 +17,17 @@ type Queries = Pick<
   | "findByText"
   | "findByPlaceholderText"
   | "queryByRole"
-  | "queryByTestId"
+  | "queryByText"
   | "getByRole"
 >;
 
 /**
  * Wait for the app to finish loading (loading screen disappears).
  */
-export async function waitForAppLoad(queries: Pick<Queries, "queryByTestId">) {
+export async function waitForAppLoad(queries: Pick<Queries, "queryByText">) {
   await waitFor(
     () => {
-      expect(queries.queryByTestId("loading-screen")).not.toBeInTheDocument();
+      expect(queries.queryByText(/loading workspaces/i)).not.toBeInTheDocument();
     },
     { timeout: 5000 }
   );

tests/setup.ts

@@ -6,6 +6,11 @@
 import assert from "assert";
 import "disposablestack/auto";
 
+// Required by React to avoid noisy act(...) warnings in tests.
+// @testing-library/react sets this in many setups, but being explicit keeps
+// our Jest environment consistent across projects.
+(globalThis as any).IS_REACT_ACT_ENVIRONMENT = true;
+
 assert.equal(typeof Symbol.dispose, "symbol");
 // Use fast approximate token counting in Jest to avoid 10s WASM cold starts
 // Individual tests can override with MUX_FORCE_REAL_TOKENIZER=1