🤖 tests: reinstall DnD module mocks before each suite

Re-register the AppLoader auth and ProjectSidebar drag-and-drop module mocks in beforeEach so `mock.restore()` cannot leave later tests resolving the real react-dnd stack before happy-dom exists.

---

_Generated with `mux` • Model: `openai:gpt-5.4` • Thinking: `xhigh` • Cost: `$447.91`_

<!-- mux-attribution: model=openai:gpt-5.4 thinking=xhigh costs=447.91 -->

Author: ammar-agent

src/browser/components/AppLoader/AppLoader.auth.test.tsx

@@ -13,97 +13,100 @@ let apiError: string | null = "Authentication required";
 
 const passthroughRef = <T,>(value: T): T => value;
 
-void mock.module("react-dnd", () => ({
-  DndProvider: (props: { children: React.ReactNode }) => props.children,
-  useDrag: () => [{ isDragging: false }, passthroughRef, () => undefined] as const,
-  useDrop: () => [{ isOver: false }, passthroughRef] as const,
-  useDragLayer: () => ({ isDragging: false, item: null, currentOffset: null }),
-}));
-
-void mock.module("react-dnd-html5-backend", () => ({
-  HTML5Backend: {},
-  getEmptyImage: () => null,
-}));
-
-// AppLoader imports App, which pulls in Lottie-based components. In happy-dom,
-// lottie-web's canvas bootstrap can throw during module evaluation.
-void mock.module("lottie-react", () => ({
-  __esModule: true,
-  default: () => <div data-testid="LottieMock" />,
-}));
-
-void mock.module("@/browser/contexts/API", () => ({
-  APIProvider: (props: { children: React.ReactNode }) => props.children,
-  useAPI: () => {
-    if (apiStatus === "auth_required") {
-      return {
-        api: null,
-        status: "auth_required" as const,
-        error: apiError,
-        authenticate: () => undefined,
-        retry: () => undefined,
-      };
-    }
+function installAppLoaderModuleMocks() {
+  void mock.module("react-dnd", () => ({
+    DndProvider: (props: { children: React.ReactNode }) => props.children,
+    useDrag: () => [{ isDragging: false }, passthroughRef, () => undefined] as const,
+    useDrop: () => [{ isOver: false }, passthroughRef] as const,
+    useDragLayer: () => ({ isDragging: false, item: null, currentOffset: null }),
+  }));
+
+  void mock.module("react-dnd-html5-backend", () => ({
+    HTML5Backend: {},
+    getEmptyImage: () => null,
+  }));
+
+  // AppLoader imports App, which pulls in Lottie-based components. In happy-dom,
+  // lottie-web's canvas bootstrap can throw during module evaluation.
+  void mock.module("lottie-react", () => ({
+    __esModule: true,
+    default: () => <div data-testid="LottieMock" />,
+  }));
+
+  void mock.module("@/browser/contexts/API", () => ({
+    APIProvider: (props: { children: React.ReactNode }) => props.children,
+    useAPI: () => {
+      if (apiStatus === "auth_required") {
+        return {
+          api: null,
+          status: "auth_required" as const,
+          error: apiError,
+          authenticate: () => undefined,
+          retry: () => undefined,
+        };
+      }
+
+      if (apiStatus === "error") {
+        return {
+          api: null,
+          status: "error" as const,
+          error: apiError ?? "Connection error",
+          authenticate: () => undefined,
+          retry: () => undefined,
+        };
+      }
 
-    if (apiStatus === "error") {
       return {
         api: null,
-        status: "error" as const,
-        error: apiError ?? "Connection error",
+        status: "connecting" as const,
+        error: null,
         authenticate: () => undefined,
         retry: () => undefined,
       };
-    }
-
-    return {
-      api: null,
-      status: "connecting" as const,
-      error: null,
-      authenticate: () => undefined,
-      retry: () => undefined,
-    };
-  },
-}));
-
-void mock.module("../../App", () => ({
-  __esModule: true,
-  // App imports the full sidebar tree (including react-dnd) even though these auth-path tests only
-  // need AppLoader's pre-App branching. Keep the unit focused so cross-file DOM teardown cannot
-  // trip react-dnd's MutationObserver bootstrap between test files.
-  default: () => <div data-testid="AppMock" />,
-}));
-
-void mock.module("@/browser/components/LoadingScreen/LoadingScreen", () => ({
-  LoadingScreen: () => {
-    const { theme } = useTheme();
-    return <div data-testid="LoadingScreenMock">{theme}</div>;
-  },
-}));
-
-void mock.module("@/browser/components/StartupConnectionError/StartupConnectionError", () => ({
-  StartupConnectionError: (props: { error: string }) => (
-    <div data-testid="StartupConnectionErrorMock">{props.error}</div>
-  ),
-}));
-
-void mock.module("@/browser/components/AuthTokenModal/AuthTokenModal", () => ({
-  // Note: Module mocks leak between bun test files.
-  // Export all commonly-used symbols to avoid cross-test import errors.
-  AuthTokenModal: (props: { error?: string | null }) => (
-    <div data-testid="AuthTokenModalMock">{props.error ?? "no-error"}</div>
-  ),
-  getStoredAuthToken: () => null,
-  // eslint-disable-next-line @typescript-eslint/no-empty-function
-  setStoredAuthToken: () => {},
-  // eslint-disable-next-line @typescript-eslint/no-empty-function
-  clearStoredAuthToken: () => {},
-}));
+    },
+  }));
+
+  void mock.module("../../App", () => ({
+    __esModule: true,
+    // App imports the full sidebar tree (including react-dnd) even though these auth-path tests
+    // only need AppLoader's pre-App branching. Keep the unit focused so cross-file DOM teardown
+    // cannot trip react-dnd's MutationObserver bootstrap between test files.
+    default: () => <div data-testid="AppMock" />,
+  }));
+
+  void mock.module("@/browser/components/LoadingScreen/LoadingScreen", () => ({
+    LoadingScreen: () => {
+      const { theme } = useTheme();
+      return <div data-testid="LoadingScreenMock">{theme}</div>;
+    },
+  }));
+
+  void mock.module("@/browser/components/StartupConnectionError/StartupConnectionError", () => ({
+    StartupConnectionError: (props: { error: string }) => (
+      <div data-testid="StartupConnectionErrorMock">{props.error}</div>
+    ),
+  }));
+
+  void mock.module("@/browser/components/AuthTokenModal/AuthTokenModal", () => ({
+    // Note: Module mocks leak between bun test files.
+    // Export all commonly-used symbols to avoid cross-test import errors.
+    AuthTokenModal: (props: { error?: string | null }) => (
+      <div data-testid="AuthTokenModalMock">{props.error ?? "no-error"}</div>
+    ),
+    getStoredAuthToken: () => null,
+    // eslint-disable-next-line @typescript-eslint/no-empty-function
+    setStoredAuthToken: () => {},
+    // eslint-disable-next-line @typescript-eslint/no-empty-function
+    clearStoredAuthToken: () => {},
+  }));
+}
 
 let AppLoader: (typeof import("../AppLoader/AppLoader"))["AppLoader"];
 
 describe("AppLoader", () => {
   beforeEach(async () => {
     cleanupDom = installDom();
+    installAppLoaderModuleMocks();
     ({ AppLoader } = await import("../AppLoader/AppLoader"));
   });
 

src/browser/components/ProjectSidebar/ProjectSidebar.test.tsx

@@ -48,17 +48,19 @@ const passthroughRef = <T,>(value: T): T => value;
 
 let ProjectSidebar: (typeof import("./ProjectSidebar"))["default"];
 
-void mock.module("react-dnd", () => ({
-  DndProvider: TestWrapper,
-  useDrag: () => [{ isDragging: false }, passthroughRef, () => undefined] as const,
-  useDrop: () => [{ isOver: false }, passthroughRef] as const,
-  useDragLayer: () => ({ isDragging: false, item: null, currentOffset: null }),
-}));
+function installProjectSidebarModuleMocks() {
+  void mock.module("react-dnd", () => ({
+    DndProvider: TestWrapper,
+    useDrag: () => [{ isDragging: false }, passthroughRef, () => undefined] as const,
+    useDrop: () => [{ isOver: false }, passthroughRef] as const,
+    useDragLayer: () => ({ isDragging: false, item: null, currentOffset: null }),
+  }));
 
-void mock.module("react-dnd-html5-backend", () => ({
-  HTML5Backend: {},
-  getEmptyImage: () => null,
-}));
+  void mock.module("react-dnd-html5-backend", () => ({
+    HTML5Backend: {},
+    getEmptyImage: () => null,
+  }));
+}
 
 function resolveVoidResult() {
   return Promise.resolve({ success: true as const, data: undefined });
@@ -305,6 +307,7 @@ describe("ProjectSidebar multi-project completed-subagent toggles", () => {
       EXPANDED_PROJECTS_KEY,
       JSON.stringify([MULTI_PROJECT_SIDEBAR_SECTION_ID])
     );
+    installProjectSidebarModuleMocks();
     installProjectSidebarTestDoubles();
     ({ default: ProjectSidebar } = await import("./ProjectSidebar"));
   });