Files
lvmh/web/src/TaskPanel.test.tsx
T

103 lines
3.1 KiB
TypeScript

import { render, screen } from "@testing-library/react";
import { describe, expect, it } from "vitest";
import type { TaskDerivation } from "./derive";
import TaskPanel from "./TaskPanel";
const base: TaskDerivation = { todos: [], subagents: [], workingTools: [] };
describe("TaskPanel", () => {
it("empty state", () => {
render(<TaskPanel tasks={base} />);
expect(screen.getByText("No tasks yet.")).toBeInTheDocument();
});
it("todo rows render icons per status and deleted styling", () => {
const tasks: TaskDerivation = {
...base,
todos: [
{ content: "write tests", status: "pending", deleted: false },
{ content: "run them", status: "in-progress", deleted: false },
{ content: "ship it", status: "completed", deleted: false },
{ content: "old task", status: "pending", deleted: true },
],
};
const { container } = render(<TaskPanel tasks={tasks} />);
expect(container.querySelector(".todo-icon.pending")?.textContent).toBe(
"○",
);
expect(container.querySelector(".todo-icon.in-progress")?.textContent).toBe(
"◺",
);
expect(container.querySelector(".todo-icon.completed")?.textContent).toBe(
"●",
);
const deleted = container.querySelector(
".todo-item.deleted .todo-text",
) as HTMLElement;
expect(deleted).not.toBeNull();
expect(deleted.style.textDecoration).toContain("line-through");
});
it("subagent rows: running spinner, done check, failed cross", () => {
const tasks: TaskDerivation = {
...base,
subagents: [
{ key: "a", name: "scout", running: true, isError: false },
{ key: "b", name: "worker", running: false, isError: false },
{ key: "c", name: "reviewer", running: false, isError: true },
],
};
render(<TaskPanel tasks={tasks} />);
expect(screen.getByLabelText("running")).toBeInTheDocument();
expect(screen.getByText("scout")).toBeInTheDocument();
expect(screen.getByText("running")).toBeInTheDocument();
expect(screen.getByText("✓")).toBeInTheDocument();
expect(screen.getByText("✕")).toBeInTheDocument();
expect(screen.getByText("done")).toBeInTheDocument();
expect(screen.getByText("failed")).toBeInTheDocument();
});
it("working tools section", () => {
const tasks: TaskDerivation = {
...base,
workingTools: [
{
id: "c1",
name: "bash",
args: "ls",
running: true,
isError: false,
preview: "",
},
],
};
render(<TaskPanel tasks={tasks} />);
expect(screen.getByText("Working")).toBeInTheDocument();
expect(screen.getByText("bash…")).toBeInTheDocument();
});
it("sections appear only when populated", () => {
const { rerender, queryByText } = render(
<TaskPanel
tasks={{
...base,
todos: [{ content: "t", status: "pending", deleted: false }],
}}
/>,
);
expect(queryByText("Tasks")).not.toBeNull();
expect(queryByText("Subagents")).toBeNull();
expect(queryByText("Working")).toBeNull();
rerender(
<TaskPanel
tasks={{
...base,
subagents: [{ key: "a", name: "s", running: false, isError: false }],
}}
/>,
);
expect(queryByText("Tasks")).toBeNull();
expect(queryByText("Subagents")).not.toBeNull();
});
});