/** * @file WorkspaceTree.test.tsx * @description Tests for the sidebar's workspace list: one flat row per * workspace in the stored order, a row expanding to its sessions (remembered), * a live session opening its pane and an ended one its transcript, selection * by URL, Alt+arrow reordering kept in localStorage, double-click rename, the * search, the row menu's items by kind and tool, and the status dot. * @author Nguyễn Ngọc Trí Vĩ */ import { describe, it, expect, vi, beforeEach } from "vitest"; import { render, screen, waitFor, within, fireEvent } from "@testing-library/react"; import userEvent from "@testing-library/user-event"; import { MemoryRouter, Route, Routes, useLocation } from "react-router-dom"; import type { Lane, Session } from "../../lib/types"; function lane(id: number, cwd: string, extra: Partial = {}): Lane { return { id, title: "", cwd, branch: null, kind: "adopted", tool: "claude", router_profile: null, source_repo: null, pipeline: "default", session_id: null, run_id: null, stage: "idle", stage_since: null, status: "idle", needs_action: null, liveness: "idle", pipeline_nodes: [], ...extra, } as unknown as Lane; } const session = (id: string, name: string) => ({ id, name, cwd: "/r", status: "completed", started_at: "2026-09-30T10:00:00Z" }) as Session; let lanes: Lane[] = []; vi.mock("../../lib/api", async (importOriginal) => { const actual = await importOriginal>(); return { ...actual, api: { lanes: { list: vi.fn(async () => ({ lanes, counts: {} })), update: vi.fn(async () => ({ lane: lanes[0] })), action: vi.fn(async () => ({ ok: true })), routerList: vi.fn(async () => ({ routers: [] })), }, sessions: { list: vi.fn(async () => ({ sessions: [session("s-live", "Live one"), session("s-old", "Old one")], })), }, run: { list: vi.fn(async () => ({ items: [{ id: "agenthub-lane-1-2", laneId: 1, status: "running", sessionId: "s-live" }], })), cwds: vi.fn(async () => ({ items: [] })), }, aiTools: { list: vi.fn(async () => ({ tools: [], default: "claude" })), iconUrl: () => "", }, aiRouters: { list: vi.fn(async () => ({ routers: [] })) }, }, }; }); import { api } from "../../lib/api"; import { WorkspaceTree } from "../WorkspaceTree"; import { workspaceDot } from "../lanes/WorkspaceRow"; function Where() { const loc = useLocation(); return {loc.pathname + loc.search}; } function renderTree(at = "/") { return render( } /> ); } const rowIds = () => screen.getAllByTestId(/^workspace-row-\d+$/).map((el) => el.dataset.testid); beforeEach(() => { localStorage.clear(); vi.clearAllMocks(); lanes = [ lane(1, "/r", { title: "Repo" }), lane(2, "/r/sub", { title: "Sub" }), lane(3, "/tmp/plain", { kind: "managed", tool: "codex" }), ]; }); describe("WorkspaceTree", () => { it("lists every workspace on one flat level, collapsed", async () => { renderTree(); await screen.findByTestId("workspace-row-3"); expect(rowIds()).toEqual(["workspace-row-1", "workspace-row-2", "workspace-row-3"]); expect(screen.getByTestId("workspace-row-3")).toHaveTextContent("plain"); expect(screen.queryByTestId("workspace-sessions-1")).toBeNull(); expect(api.sessions.list).not.toHaveBeenCalled(); }); it("expands a workspace to its sessions and remembers it", async () => { const user = userEvent.setup(); renderTree(); await user.click(await screen.findByTestId("workspace-toggle-1")); const list = await screen.findByTestId("workspace-sessions-1"); expect(within(list).getByText("Live one")).toBeInTheDocument(); expect(api.sessions.list).toHaveBeenCalledWith({ cwd: "/r", tool: "claude", limit: 20 }); expect(JSON.parse(localStorage.getItem("agenthub.sidebar.projects")!).expanded).toEqual({ "1": true, }); }); it("opens a live session's pane and an ended session's transcript, resuming nothing", async () => { const user = userEvent.setup(); renderTree(); await user.click(await screen.findByTestId("workspace-toggle-1")); const live = await screen.findByTestId("workspace-session-s-live"); await waitFor(() => expect(live).toHaveAttribute("data-live", "true")); await user.click(live); expect(screen.getByTestId("where").textContent).toBe("/workspace?lane=1&run=agenthub-lane-1-2"); await user.click(screen.getByTestId("workspace-session-s-old")); expect(screen.getByTestId("where").textContent).toBe("/sessions/s-old"); expect(api.lanes.action).not.toHaveBeenCalled(); }); it("selects by URL, and a click selects and expands", async () => { const user = userEvent.setup(); renderTree("/workspace?lane=2"); expect(await screen.findByTestId("workspace-open-2")).toHaveAttribute("aria-current", "true"); await user.click(screen.getByTestId("workspace-open-1")); expect(screen.getByTestId("where").textContent).toBe("/workspace?lane=1"); expect(await screen.findByTestId("workspace-sessions-1")).toBeInTheDocument(); }); it("reorders with Alt+ArrowUp and keeps the order in localStorage", async () => { renderTree(); fireEvent.keyDown(await screen.findByTestId("workspace-open-2"), { key: "ArrowUp", altKey: true, }); expect(JSON.parse(localStorage.getItem("agenthub.workspace.laneOrder")!)).toEqual([2, 1, 3]); expect(rowIds()).toEqual(["workspace-row-2", "workspace-row-1", "workspace-row-3"]); }); it("renames on double-click + Enter, and Escape cancels without a call", async () => { const user = userEvent.setup(); renderTree(); await user.dblClick(await screen.findByTestId("workspace-open-2")); const input = screen.getByTestId("workspace-rename-2"); await user.clear(input); await user.type(input, " Renamed {Enter}"); expect(api.lanes.update).toHaveBeenCalledWith(2, { title: "Renamed" }); vi.mocked(api.lanes.update).mockClear(); await user.dblClick(screen.getByTestId("workspace-open-2")); await user.type(screen.getByTestId("workspace-rename-2"), "x{Escape}"); expect(api.lanes.update).not.toHaveBeenCalled(); }); it("filters workspaces by search", async () => { const user = userEvent.setup(); renderTree(); await screen.findByTestId("workspace-row-1"); await user.click(screen.getByRole("button", { name: "Search workspaces and sessions" })); await user.type(screen.getByRole("searchbox"), "plain"); expect(rowIds()).toEqual(["workspace-row-3"]); }); it("offers Reset only on a managed workspace and the readme run only on claude", async () => { const user = userEvent.setup(); renderTree(); await user.click(await screen.findByTestId("workspace-menu-1")); let menu = screen.getByTestId("workspace-row-menu-1"); expect(within(menu).queryByText("Reset worktree…")).toBeNull(); expect(within(menu).getByText("Create/update readme file")).toBeInTheDocument(); expect(within(menu).getByText("Delete workspace…")).toBeInTheDocument(); await user.keyboard("{Escape}"); await user.click(screen.getByTestId("workspace-menu-3")); menu = screen.getByTestId("workspace-row-menu-3"); expect(within(menu).getByText("Reset worktree…")).toBeInTheDocument(); expect(within(menu).queryByText("Create/update readme file")).toBeNull(); }); }); describe("workspaceDot", () => { it("maps needs-you, dead/error, running, active and idle", () => { expect(workspaceDot(lane(1, "/a", { needs_action: "x", status: "running" }))).toBe( "bg-status-warning" ); expect(workspaceDot(lane(1, "/a", { liveness: "dead" }))).toBe("bg-status-danger"); expect(workspaceDot(lane(1, "/a", { status: "error" }))).toBe("bg-status-danger"); expect(workspaceDot(lane(1, "/a", { status: "running" }))).toContain("animate-pulse-slow"); expect(workspaceDot(lane(1, "/a", { liveness: "active" }))).toBe("bg-status-success"); expect(workspaceDot(lane(1, "/a"))).toBe("bg-surface-4"); }); });