fix vitest hook mocks

Author: bgentry

src/components/JobList.test.tsx

@@ -1,21 +1,34 @@
 import { FeaturesContext } from "@contexts/Features";
-import { useSettings } from "@hooks/use-settings";
 import { JobState } from "@services/types";
 import { jobMinimalFactory } from "@test/factories/job";
 import { createFeatures } from "@test/utils/features";
 import { render, screen } from "@testing-library/react";
-import { describe, expect, it, vi } from "vitest";
+import { type ReactNode } from "react";
+import {
+  beforeEach,
+  describe,
+  expect,
+  it,
+  type MockedFunction,
+  vi,
+} from "vitest";
 
 import JobList from "./JobList";
 
+type UseSettings = typeof import("@hooks/use-settings").useSettings;
+
+const { mockUseSettings } = vi.hoisted(() => ({
+  mockUseSettings: vi.fn() as MockedFunction<UseSettings>,
+}));
+
 vi.mock("@tanstack/react-router", () => {
   return {
     Link: ({
       children,
       className,
       to,
     }: {
-      children: React.ReactNode;
+      children: ReactNode;
       className: string;
       to: string;
     }) => (
@@ -28,18 +41,22 @@ vi.mock("@tanstack/react-router", () => {
 
 // Mock the useSettings hook
 vi.mock("@hooks/use-settings", () => ({
-  useSettings: vi.fn(),
+  useSettings: mockUseSettings,
 }));
 
 describe("JobList", () => {
+  beforeEach(() => {
+    mockUseSettings.mockReset();
+  });
+
   it("shows job args by default", () => {
     const job = jobMinimalFactory.build();
     const features = createFeatures({
       jobListHideArgsByDefault: false,
     });
 
     // Mock settings with no override
-    (useSettings as unknown as ReturnType<typeof vi.fn>).mockReturnValue({
+    mockUseSettings.mockReturnValue({
       settings: {},
     });
 
@@ -71,7 +88,7 @@ describe("JobList", () => {
     });
 
     // Mock settings with no override
-    (useSettings as unknown as ReturnType<typeof vi.fn>).mockReturnValue({
+    mockUseSettings.mockReturnValue({
       settings: {},
     });
 
@@ -105,7 +122,7 @@ describe("JobList", () => {
     });
 
     // Mock settings with override to show args
-    (useSettings as unknown as ReturnType<typeof vi.fn>).mockReturnValue({
+    mockUseSettings.mockReturnValue({
       settings: { showJobArgs: true },
     });
 
@@ -138,7 +155,7 @@ describe("JobList", () => {
     });
 
     // Mock settings with override to hide args
-    (useSettings as unknown as ReturnType<typeof vi.fn>).mockReturnValue({
+    mockUseSettings.mockReturnValue({
       settings: { showJobArgs: false },
     });
 

src/components/SettingsPage.test.tsx

@@ -1,35 +1,53 @@
-import { useFeatures } from "@contexts/Features.hook";
-import { useSettings } from "@hooks/use-settings";
 import { createFeatures } from "@test/utils/features";
 import { fireEvent, render, screen } from "@testing-library/react";
-import { describe, expect, it, vi } from "vitest";
+import {
+  beforeEach,
+  describe,
+  expect,
+  it,
+  type MockedFunction,
+  vi,
+} from "vitest";
 
 import SettingsPage from "./SettingsPage";
 
+type UseFeatures = typeof import("@contexts/Features.hook").useFeatures;
+type UseSettings = typeof import("@hooks/use-settings").useSettings;
+
+const { mockUseFeatures, mockUseSettings } = vi.hoisted(() => ({
+  mockUseFeatures: vi.fn() as MockedFunction<UseFeatures>,
+  mockUseSettings: vi.fn() as MockedFunction<UseSettings>,
+}));
+
 // Mock useSettings hook
 vi.mock("@hooks/use-settings", () => ({
-  useSettings: vi.fn(),
+  useSettings: mockUseSettings,
 }));
 
 // Mock useFeatures hook
 vi.mock("@contexts/Features.hook", () => ({
-  useFeatures: vi.fn(),
+  useFeatures: mockUseFeatures,
 }));
 
 describe("SettingsPage", () => {
+  beforeEach(() => {
+    mockUseFeatures.mockReset();
+    mockUseSettings.mockReset();
+  });
+
   it("renders correctly with default settings", () => {
     // Mock settings hook
     const mockSetShowJobArgs = vi.fn();
     const mockClearShowJobArgs = vi.fn();
-    (useSettings as unknown as ReturnType<typeof vi.fn>).mockReturnValue({
+    mockUseSettings.mockReturnValue({
       clearShowJobArgs: mockClearShowJobArgs,
       setShowJobArgs: mockSetShowJobArgs,
       settings: {},
       shouldShowJobArgs: true,
     });
 
     // Mock features
-    (useFeatures as unknown as ReturnType<typeof vi.fn>).mockReturnValue({
+    mockUseFeatures.mockReturnValue({
       features: createFeatures({
         jobListHideArgsByDefault: false,
       }),
@@ -61,15 +79,15 @@ describe("SettingsPage", () => {
     // Mock settings hook with override
     const mockSetShowJobArgs = vi.fn();
     const mockClearShowJobArgs = vi.fn();
-    (useSettings as unknown as ReturnType<typeof vi.fn>).mockReturnValue({
+    mockUseSettings.mockReturnValue({
       clearShowJobArgs: mockClearShowJobArgs,
       setShowJobArgs: mockSetShowJobArgs,
       settings: { showJobArgs: true },
       shouldShowJobArgs: true,
     });
 
     // Mock features
-    (useFeatures as unknown as ReturnType<typeof vi.fn>).mockReturnValue({
+    mockUseFeatures.mockReturnValue({
       features: createFeatures({
         jobListHideArgsByDefault: true,
       }),
@@ -96,15 +114,15 @@ describe("SettingsPage", () => {
     // Mock settings hook
     const mockSetShowJobArgs = vi.fn();
     const mockClearShowJobArgs = vi.fn();
-    (useSettings as unknown as ReturnType<typeof vi.fn>).mockReturnValue({
+    mockUseSettings.mockReturnValue({
       clearShowJobArgs: mockClearShowJobArgs,
       setShowJobArgs: mockSetShowJobArgs,
       settings: {},
       shouldShowJobArgs: false,
     });
 
     // Mock features
-    (useFeatures as unknown as ReturnType<typeof vi.fn>).mockReturnValue({
+    mockUseFeatures.mockReturnValue({
       features: createFeatures({
         jobListHideArgsByDefault: true,
       }),

src/hooks/use-settings.test.tsx

@@ -1,25 +1,46 @@
-import { useFeatures } from "@contexts/Features.hook";
 import { $userSettings } from "@stores/settings";
 import { createFeatures } from "@test/utils/features";
 import { renderHook } from "@testing-library/react";
-import { describe, expect, it, vi } from "vitest";
+import {
+  beforeEach,
+  describe,
+  expect,
+  it,
+  type MockedFunction,
+  vi,
+} from "vitest";
 
 import { useSettings } from "./use-settings";
 
+type UseFeatures = typeof import("@contexts/Features.hook").useFeatures;
+type UseStore = typeof import("@nanostores/react").useStore;
+
+const { mockUseFeatures, mockUseStore } = vi.hoisted(() => ({
+  mockUseFeatures: vi.fn() as MockedFunction<UseFeatures>,
+  mockUseStore: vi.fn() as MockedFunction<UseStore>,
+}));
+
 // Mock nanostores/react
 vi.mock("@nanostores/react", () => ({
-  useStore: vi.fn().mockImplementation((store) => store.get()),
+  useStore: mockUseStore,
 }));
 
 // Mock Features context
 vi.mock("@contexts/Features.hook", () => ({
-  useFeatures: vi.fn(),
+  useFeatures: mockUseFeatures,
 }));
 
 describe("useSettings", () => {
+  beforeEach(() => {
+    vi.restoreAllMocks();
+    mockUseFeatures.mockReset();
+    mockUseStore.mockReset();
+    mockUseStore.mockImplementation((store) => store.get());
+  });
+
   it("should return default show job args value when no override", () => {
     // Mock Features hook
-    (useFeatures as unknown as ReturnType<typeof vi.fn>).mockReturnValue({
+    mockUseFeatures.mockReturnValue({
       features: createFeatures({
         jobListHideArgsByDefault: true,
       }),
@@ -34,7 +55,7 @@ describe("useSettings", () => {
 
   it("should return override when set to true", () => {
     // Mock Features hook with hide args by default
-    (useFeatures as unknown as ReturnType<typeof vi.fn>).mockReturnValue({
+    mockUseFeatures.mockReturnValue({
       features: createFeatures({
         jobListHideArgsByDefault: true,
       }),
@@ -49,7 +70,7 @@ describe("useSettings", () => {
 
   it("should return override when set to false", () => {
     // Mock Features hook with show args by default
-    (useFeatures as unknown as ReturnType<typeof vi.fn>).mockReturnValue({
+    mockUseFeatures.mockReturnValue({
       features: createFeatures({
         jobListHideArgsByDefault: false,
       }),