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

test(FN-4121): complete Step 6 — add org chart layout toggle interaction coverage

Browse Source 
Fusion-Task-Id: FN-4121
Fusion-Task-Lineage: aa8b8ab7-c250-4ce5-b42e-7b7a2ba920b1
This commit is contained in:
Fusion
2026-05-13 01:26:30 -07:00
committed by gsxdsm
parent 40674e24bb
commit 934a0ed6ad
1 changed files with 39 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -5,6 +5,7 @@ import { AgentsView } from "../AgentsView";
import * as apiModule from "../../api";
import type { Agent, AgentState, AgentCapability, OrgTreeNode } from "../../api";
import { scopedKey } from "../../utils/projectStorage";
import { ORG_CHART_LAYOUT_STORAGE_KEY } from "../agentsOrgChartLayout";
// Mock the API module
vi.mock("../../api", async (importOriginal) => {
@@ -1456,6 +1457,44 @@ describe("AgentsView", () => {
clientWidthSpy.mockRestore();
});
it("supports toggling org chart layout preference and persists it", async () => {
const clientWidthSpy = vi.spyOn(window.HTMLElement.prototype, "clientWidth", "get").mockReturnValue(1920);
localStorage.setItem(scopedKey("fn-agent-view", projectId), "org");
localStorage.setItem(scopedKey(ORG_CHART_LAYOUT_STORAGE_KEY, projectId), "vertical");
mockFetchOrgTree.mockResolvedValue(orgTree);
render(<AgentsView addToast={mockAddToast} projectId={projectId} />);
const chart = await screen.findByTestId("agent-org-chart");
const toggle = screen.getByTestId("agent-org-chart-layout-toggle");
const horizontalButton = within(toggle).getByRole("button", { name: "Horizontal layout" });
const verticalButton = within(toggle).getByRole("button", { name: "Vertical layout" });
const autoButton = within(toggle).getByRole("button", { name: "Automatic layout" });
expect(verticalButton.getAttribute("aria-pressed")).toBe("true");
expect(horizontalButton.getAttribute("aria-pressed")).toBe("false");
expect(autoButton.getAttribute("aria-pressed")).toBe("false");
expect(chart.getAttribute("data-layout-mode")).toBe("vertical");
fireEvent.click(horizontalButton);
await waitFor(() => {
expect(chart.getAttribute("data-layout-mode")).toBe("horizontal");
expect(localStorage.getItem(scopedKey(ORG_CHART_LAYOUT_STORAGE_KEY, projectId))).toBe("horizontal");
});
fireEvent.click(autoButton);
await waitFor(() => {
expect(chart.getAttribute("data-layout-mode")).toBe("horizontal");
expect(localStorage.getItem(scopedKey(ORG_CHART_LAYOUT_STORAGE_KEY, projectId))).toBe("auto");
});
fireEvent.click(verticalButton);
await waitFor(() => {
expect(chart.getAttribute("data-layout-mode")).toBe("vertical");
});
clientWidthSpy.mockRestore();
});
it("shows mobile zoom controls for org chart and keeps node selection working", async () => {
mockViewportMode.mockReturnValue("mobile");
mockFetchOrgTree.mockResolvedValue(orgTree);