root/fusion
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

FN-6395: align viewport hook mocks in dashboard tests

Browse Source 
Update dashboard test doubles so mobile viewport helpers match the hook module API.

- Add getViewportMode and isMobileViewport exports to affected useViewportMode mocks.
- Keep mocked mobile detection tied to each test's configurable viewport mode.
- Normalize inline viewport mocks across dashboard component test suites.

Files changed:
 .../components/__tests__/AgentsView.orgchart.test.tsx   |  6 +++++-
 .../app/components/__tests__/AgentsView.test.tsx        |  2 ++
 .../app/components/__tests__/ChatView.rooms.test.tsx    |  1 +
 .../app/components/__tests__/GitManagerModal.test.tsx   |  2 ++
 .../app/components/__tests__/MailboxView.test.tsx       | 13 +++++++++----
 .../__tests__/MilestoneSliceInterviewModal.test.tsx     |  2 ++
 .../__tests__/MissionManager.swipe-back.test.tsx        |  2 ++
 .../__tests__/NewTaskModal.shared-cache.test.tsx        | 17 ++++++++++++++---
 .../app/components/__tests__/NewTaskModal.test.tsx      |  2 ++
 .../__tests__/PlanningModeModal.favorites.test.tsx      |  2 ++
 .../__tests__/PlanningModeModal.questions.test.tsx      |  2 ++
 .../__tests__/PlanningModeModal.swipe-back.test.tsx     |  2 ++
 .../PlanningModeModal.ui-interactions.test.tsx          |  4 ++++
 .../components/__tests__/QuickChatFAB.autosize.test.tsx | 13 +++++++++----
 .../__tests__/QuickChatFAB.shared-cache.test.tsx        | 11 +++++++++--
 .../app/components/__tests__/QuickChatFAB.test.tsx      | 11 +++++++++--
 .../__tests__/SettingsModal.testMode.test.tsx           |  6 +++++-
 .../components/__tests__/SubtaskBreakdownModal.test.tsx |  2 ++
 .../app/components/__tests__/TodoModal.test.tsx         |  2 ++
 .../components/__tests__/navigation-history.test.tsx    |  3 ++-
 20 files changed, 87 insertions(+), 18 deletions(-)

Fusion-Task-Id: FN-6395
Fusion-Task-Lineage: d830938b-4d60-4e17-852d-a2d311b6d71c
This commit is contained in:
gsxdsm
2026-06-13 14:54:23 -07:00
parent b4541a97f3
commit 338e7286c0
20 changed files with 87 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
packages/dashboard/app/components/__tests__/AgentsView.orgchart.test.tsx
View File

@@ -5,7 +5,11 @@ import * as apiModule from "../../api";
const mockViewportMode = vi.fn<() => "mobile" | "tablet" | "desktop">(() => "desktop");
vi.mock("../../hooks/useViewportMode", () => ({
MOBILE_MEDIA_QUERY: "(max-width: 768px), (max-height: 480px)", useViewportMode: () => mockViewportMode() }));
MOBILE_MEDIA_QUERY: "(max-width: 768px), (max-height: 480px)",
getViewportMode: () => mockViewportMode(),
isMobileViewport: () => mockViewportMode() === "mobile",
useViewportMode: () => mockViewportMode(),
}));
vi.mock("../../hooks/useConfirm", () => ({ useConfirm: () => ({ confirm: vi.fn().mockResolvedValue(true) }) }));
vi.mock("../AgentDetailView", () => ({ AgentDetailView: () => null, relativeTime: () => "now" }));

2
packages/dashboard/app/components/__tests__/AgentsView.test.tsx
View File

@@ -77,6 +77,8 @@ const mockViewportMode = vi.fn<() => "mobile" | "tablet" | "desktop">(() => "des
vi.mock("../../hooks/useViewportMode", () => ({
MOBILE_MEDIA_QUERY: "(max-width: 768px), (max-height: 480px)",
getViewportMode: () => mockViewportMode(),
isMobileViewport: () => mockViewportMode() === "mobile",
useViewportMode: () => mockViewportMode(),
}));

1
packages/dashboard/app/components/__tests__/ChatView.rooms.test.tsx
View File

@@ -12,6 +12,7 @@ vi.mock("../../hooks/useChat");
vi.mock("../../hooks/useMobileScrollLock", () => ({
useMobileScrollLock: vi.fn(),
useMobileKeyboardViewportLock: vi.fn(),
useMobileViewportRestoreReset: vi.fn(),
isIOS: () => true,
_resetLockState: vi.fn(),
}));

2
packages/dashboard/app/components/__tests__/GitManagerModal.test.tsx
View File

@@ -31,6 +31,8 @@ vi.mock("../../hooks/useMobileKeyboard", () => ({
vi.mock("../../hooks/useMobileScrollLock", () => ({
useMobileScrollLock: vi.fn(),
useMobileKeyboardViewportLock: vi.fn(),
useMobileViewportRestoreReset: vi.fn(),
}));
// Mock the API module with all functions

13
packages/dashboard/app/components/__tests__/MailboxView.test.tsx
View File

@@ -27,10 +27,15 @@ vi.mock("../../api", () => ({
decideApproval: vi.fn(),
}));
vi.mock("../../hooks/useViewportMode", () => ({
MOBILE_MEDIA_QUERY: "(max-width: 768px), (max-height: 480px)",
useViewportMode: vi.fn(),
}));
vi.mock("../../hooks/useViewportMode", () => {
const useViewportMode = vi.fn();
return {
MOBILE_MEDIA_QUERY: "(max-width: 768px), (max-height: 480px)",
getViewportMode: () => useViewportMode(),
isMobileViewport: () => useViewportMode() === "mobile",
useViewportMode,
};
});
vi.mock("../../hooks/useMobileKeyboard", () => ({
useMobileKeyboard: vi.fn(),

2
packages/dashboard/app/components/__tests__/MilestoneSliceInterviewModal.test.tsx
View File

@@ -66,6 +66,8 @@ vi.mock("../../hooks/useMobileKeyboard", () => ({
vi.mock("../../hooks/useViewportMode", () => ({
MOBILE_MEDIA_QUERY: "(max-width: 768px), (max-height: 480px)",
getViewportMode: () => "mobile",
isMobileViewport: () => true,
useViewportMode: () => "mobile",
}));
vi.mock("lucide-react", () => ({

2
packages/dashboard/app/components/__tests__/MissionManager.swipe-back.test.tsx
View File

@@ -18,6 +18,8 @@ const mockSubscribeSse = vi.fn(() => vi.fn());
vi.mock("../../hooks/useViewportMode", () => ({
MOBILE_MEDIA_QUERY: "(max-width: 768px), (max-height: 480px)",
getViewportMode: () => mockViewportMode(),
isMobileViewport: () => mockViewportMode() === "mobile",
useViewportMode: () => mockViewportMode(),
}));

17
packages/dashboard/app/components/__tests__/NewTaskModal.shared-cache.test.tsx
View File

@@ -18,10 +18,21 @@ vi.mock("../../api", async (importOriginal) => {
vi.mock("../../hooks/useSetupReadiness", () => ({ useSetupReadiness: vi.fn(() => ({ hasAiProvider: true, hasGithub: true, loading: false })) }));
vi.mock("../../hooks/useConfirm", () => ({ useConfirm: vi.fn(() => ({ confirm: vi.fn().mockResolvedValue(true) })) }));
vi.mock("../../hooks/useMobileKeyboard", () => ({ useMobileKeyboard: vi.fn(() => ({ keyboardOverlap: 0, viewportHeight: null, viewportOffsetTop: 0, keyboardOpen: false })) }));
vi.mock("../../hooks/useMobileScrollLock", () => ({ useMobileScrollLock: vi.fn() }));
vi.mock("../../hooks/useMobileScrollLock", () => ({
useMobileScrollLock: vi.fn(),
useMobileKeyboardViewportLock: vi.fn(),
useMobileViewportRestoreReset: vi.fn(),
}));
vi.mock("../../hooks/useNodes", () => ({ useNodes: vi.fn(() => ({ nodes: [] })) }));
vi.mock("../../hooks/useViewportMode", () => ({
MOBILE_MEDIA_QUERY: "(max-width: 768px), (max-height: 480px)", useViewportMode: vi.fn(() => "desktop") }));
vi.mock("../../hooks/useViewportMode", () => {
const useViewportMode = vi.fn(() => "desktop");
return {
MOBILE_MEDIA_QUERY: "(max-width: 768px), (max-height: 480px)",
getViewportMode: () => useViewportMode(),
isMobileViewport: () => useViewportMode() === "mobile",
useViewportMode,
};
});
function deferred<T>() {
let resolve!: (value: T) => void;

2
packages/dashboard/app/components/__tests__/NewTaskModal.test.tsx
View File

@@ -53,6 +53,8 @@ vi.mock("../../hooks/useMobileKeyboard", () => ({
vi.mock("../../hooks/useViewportMode", () => ({
MOBILE_MEDIA_QUERY: "(max-width: 768px), (max-height: 480px)",
getViewportMode: () => "mobile",
isMobileViewport: () => true,
useViewportMode: () => "mobile",
}));

2
packages/dashboard/app/components/__tests__/PlanningModeModal.favorites.test.tsx
View File

@@ -101,6 +101,8 @@ vi.mock("../../hooks/useConfirm", () => ({
vi.mock("../../hooks/useViewportMode", () => ({
MOBILE_MEDIA_QUERY: "(max-width: 768px), (max-height: 480px)",
getViewportMode: () => mockUseViewportMode(),
isMobileViewport: () => mockUseViewportMode() === "mobile",
useViewportMode: () => mockUseViewportMode(),
}));

2
packages/dashboard/app/components/__tests__/PlanningModeModal.questions.test.tsx
View File

@@ -102,6 +102,8 @@ vi.mock("../../hooks/useConfirm", () => ({
vi.mock("../../hooks/useViewportMode", () => ({
MOBILE_MEDIA_QUERY: "(max-width: 768px), (max-height: 480px)",
getViewportMode: () => mockUseViewportMode(),
isMobileViewport: () => mockUseViewportMode() === "mobile",
useViewportMode: () => mockUseViewportMode(),
}));

2
packages/dashboard/app/components/__tests__/PlanningModeModal.swipe-back.test.tsx
View File

@@ -12,6 +12,8 @@ const mockSubscribeSse = vi.fn(() => vi.fn());
vi.mock("../../hooks/useViewportMode", () => ({
MOBILE_MEDIA_QUERY: "(max-width: 768px), (max-height: 480px)",
getViewportMode: () => mockViewportMode(),
isMobileViewport: () => mockViewportMode() === "mobile",
useViewportMode: () => mockViewportMode(),
}));

4
packages/dashboard/app/components/__tests__/PlanningModeModal.ui-interactions.test.tsx
View File

@@ -68,6 +68,7 @@ import {
} from "./PlanningModeModal.test-helpers";
vi.mock("../../api", () => ({
api: vi.fn().mockResolvedValue({ sessions: [] }),
startPlanning: (...args: any[]) => mockStartPlanning(...args),
startPlanningStreaming: (...args: any[]) => mockStartPlanningStreaming(...args),
createPlanningDraft: (...args: any[]) => mockCreatePlanningDraft(...args),
@@ -99,6 +100,7 @@ vi.mock("../../api", () => ({
fetchGlobalSettings: vi.fn().mockResolvedValue({}),
fetchModels: (...args: any[]) => mockFetchModels(...args),
fetchWorkflowSteps: vi.fn().mockResolvedValue([]),
fetchBoardWorkflows: vi.fn().mockResolvedValue({ flagEnabled: false, defaultWorkflowId: "", workflows: [], taskWorkflowIds: {} }),
refineText: vi.fn(),
getRefineErrorMessage: vi.fn((err: any) => err?.message || "Failed to refine"),
updateGlobalSettings: vi.fn().mockResolvedValue({}),
@@ -112,6 +114,8 @@ vi.mock("../../hooks/useConfirm", () => ({
vi.mock("../../hooks/useViewportMode", () => ({
MOBILE_MEDIA_QUERY: "(max-width: 768px), (max-height: 480px)",
getViewportMode: () => mockUseViewportMode(),
isMobileViewport: () => mockUseViewportMode() === "mobile",
useViewportMode: () => mockUseViewportMode(),
}));

13
packages/dashboard/app/components/__tests__/QuickChatFAB.autosize.test.tsx
View File

@@ -84,10 +84,15 @@ vi.mock("../../hooks/useMobileKeyboard", () => ({
})),
}));
vi.mock("../../hooks/useViewportMode", () => ({
MOBILE_MEDIA_QUERY: "(max-width: 768px), (max-height: 480px)",
useViewportMode: vi.fn(() => "desktop"),
}));
vi.mock("../../hooks/useViewportMode", () => {
const useViewportMode = vi.fn(() => "desktop");
return {
MOBILE_MEDIA_QUERY: "(max-width: 768px), (max-height: 480px)",
getViewportMode: () => useViewportMode(),
isMobileViewport: () => useViewportMode() === "mobile",
useViewportMode,
};
});
vi.mock("react-markdown", () => ({
default: ({ children }: { children: string }) => children,

11
packages/dashboard/app/components/__tests__/QuickChatFAB.shared-cache.test.tsx
View File

@@ -46,8 +46,15 @@ vi.mock("../../hooks/useQuickChat", () => ({
}));
vi.mock("../../hooks/useFileMention", () => ({ useFileMention: vi.fn(() => ({ mentionActive: false, detectMention: vi.fn(), dismissMention: vi.fn(), handleKeyDown: vi.fn(), selectTask: vi.fn(), selectFile: vi.fn(), tasks: [], files: [], combinedItems: [], loading: false, mentionQuery: "", selectedIndex: 0, setSelectedIndex: vi.fn() })) }));
vi.mock("../../hooks/useMobileKeyboard", () => ({ useMobileKeyboard: vi.fn(() => ({ keyboardOpen: false, keyboardOverlap: 0, viewportHeight: null, viewportOffsetTop: 0 })) }));
vi.mock("../../hooks/useViewportMode", () => ({
MOBILE_MEDIA_QUERY: "(max-width: 768px), (max-height: 480px)", useViewportMode: vi.fn(() => "desktop") }));
vi.mock("../../hooks/useViewportMode", () => {
const useViewportMode = vi.fn(() => "desktop");
return {
MOBILE_MEDIA_QUERY: "(max-width: 768px), (max-height: 480px)",
getViewportMode: () => useViewportMode(),
isMobileViewport: () => useViewportMode() === "mobile",
useViewportMode,
};
});
vi.mock("react-markdown", () => ({ default: ({ children }: { children: string }) => children }));
function deferred<T>() {

11
packages/dashboard/app/components/__tests__/QuickChatFAB.test.tsx
View File

@@ -29,8 +29,15 @@ vi.mock("../../api", () => ({
}));
vi.mock("../../hooks/useAgents", () => ({ useAgents: vi.fn() }));
vi.mock("../../hooks/useViewportMode", () => ({
MOBILE_MEDIA_QUERY: "(max-width: 768px), (max-height: 480px)", useViewportMode: vi.fn() }));
vi.mock("../../hooks/useViewportMode", () => {
const useViewportMode = vi.fn();
return {
MOBILE_MEDIA_QUERY: "(max-width: 768px), (max-height: 480px)",
getViewportMode: () => useViewportMode(),
isMobileViewport: () => useViewportMode() === "mobile",
useViewportMode,
};
});
vi.mock("../../hooks/useMobileKeyboard", () => ({ useMobileKeyboard: vi.fn() }));
vi.mock("../../hooks/useAppSettings", () => ({ useAppSettings: vi.fn() }));
vi.mock("../../hooks/useChatRooms", () => ({ useChatRooms: vi.fn() }));

6
packages/dashboard/app/components/__tests__/SettingsModal.testMode.test.tsx
View File

@@ -26,7 +26,11 @@ vi.mock("../../hooks/useViewportMode", () => ({
vi.mock("../../hooks/useMobileKeyboard", () => ({
useMobileKeyboard: () => ({ keyboardOverlap: 0, viewportHeight: null, viewportOffsetTop: 0, keyboardOpen: false }),
}));
vi.mock("../../hooks/useMobileScrollLock", () => ({ useMobileScrollLock: vi.fn() }));
vi.mock("../../hooks/useMobileScrollLock", () => ({
useMobileScrollLock: vi.fn(),
useMobileKeyboardViewportLock: vi.fn(),
useMobileViewportRestoreReset: vi.fn(),
}));
vi.mock("../../hooks/useConfirm", () => ({ useConfirm: () => ({ confirm: vi.fn() }) }));
vi.mock("../../hooks/useWorkspaceFileBrowser", () => ({
useWorkspaceFileBrowser: () => ({ entries: [], currentPath: ".", setPath: vi.fn(), loading: false, error: null, refresh: vi.fn() }),

2
packages/dashboard/app/components/__tests__/SubtaskBreakdownModal.test.tsx
View File

@@ -45,6 +45,8 @@ vi.mock("../../hooks/useMobileKeyboard", () => ({
vi.mock("../../hooks/useViewportMode", () => ({
MOBILE_MEDIA_QUERY: "(max-width: 768px), (max-height: 480px)",
getViewportMode: () => "mobile",
isMobileViewport: () => true,
useViewportMode: () => "mobile",
}));

2
packages/dashboard/app/components/__tests__/TodoModal.test.tsx
View File

@@ -19,6 +19,8 @@ vi.mock("../../hooks/useMobileKeyboard", () => ({
vi.mock("../../hooks/useViewportMode", () => ({
MOBILE_MEDIA_QUERY: "(max-width: 768px), (max-height: 480px)",
getViewportMode: () => mockUseViewportMode(),
isMobileViewport: () => mockUseViewportMode() === "mobile",
useViewportMode: (...args: unknown[]) => mockUseViewportMode(...args),
}));

3
packages/dashboard/app/components/__tests__/navigation-history.test.tsx
View File

@@ -301,8 +301,9 @@ vi.mock("../../hooks/useNodes", () => ({
const mockUseViewportMode = vi.fn(() => "desktop");
vi.mock("../../hooks/useViewportMode", () => ({
MOBILE_MEDIA_QUERY: "(max-width: 768px), (max-height: 480px)",
getViewportMode: () => mockUseViewportMode(),
isMobileViewport: () => mockUseViewportMode() === "mobile",
useViewportMode: (..._args: unknown[]) => mockUseViewportMode(..._args),
getViewportMode: () => "desktop",
}));
const mockUseMobileKeyboard = vi.fn(() => ({