import { render, screen, waitFor } from "@testing-library/react"; import { describe, it, expect, vi, beforeEach, afterEach } from "vitest"; import { AgentStatusWidget } from "../AgentStatusWidget"; describe("AgentStatusWidget", () => { const mockFetch = vi.fn(); beforeEach(() => { global.fetch = mockFetch as unknown as typeof fetch; }); afterEach(() => { vi.clearAllMocks(); }); it("should render loading state initially", () => { mockFetch.mockImplementation( // eslint-disable-next-line @typescript-eslint/no-empty-function () => new Promise(() => {}) // Never resolves ); render(); expect(screen.getByText("Loading agents...")).toBeInTheDocument(); }); it("should fetch and display agents from API", async () => { const mockAgents = [ { agentId: "agent-1", taskId: "task-1", status: "running", agentType: "worker", spawnedAt: new Date().toISOString(), }, { agentId: "agent-2", taskId: "task-2", status: "completed", agentType: "reviewer", spawnedAt: new Date().toISOString(), completedAt: new Date().toISOString(), }, ]; mockFetch.mockResolvedValue({ ok: true, json: () => Promise.resolve(mockAgents), }); render(); await waitFor(() => { expect(screen.getByText("Worker Agent")).toBeInTheDocument(); expect(screen.getByText("Code Review Agent")).toBeInTheDocument(); }); expect(screen.getByText("Task: task-1")).toBeInTheDocument(); expect(screen.getByText("Task: task-2")).toBeInTheDocument(); }); it("should display error message when fetch fails", async () => { mockFetch.mockResolvedValue({ ok: false, statusText: "Internal Server Error", }); render(); await waitFor(() => { expect(screen.getByText(/Failed to fetch agents: Internal Server Error/)).toBeInTheDocument(); }); }); it("should display no agents message when list is empty", async () => { mockFetch.mockResolvedValue({ ok: true, json: () => Promise.resolve([]), }); render(); await waitFor(() => { expect(screen.getByText("No agents running")).toBeInTheDocument(); }); }); it("should display agent error messages", async () => { const mockAgents = [ { agentId: "agent-1", taskId: "task-1", status: "failed", agentType: "tester", spawnedAt: new Date().toISOString(), error: "Test execution failed", }, ]; mockFetch.mockResolvedValue({ ok: true, json: () => Promise.resolve(mockAgents), }); render(); await waitFor(() => { expect(screen.getByText("Test execution failed")).toBeInTheDocument(); }); }); it("should display correct stats summary", async () => { const mockAgents = [ { agentId: "agent-1", taskId: "task-1", status: "running", agentType: "worker", spawnedAt: new Date().toISOString(), }, { agentId: "agent-2", taskId: "task-2", status: "running", agentType: "reviewer", spawnedAt: new Date().toISOString(), }, { agentId: "agent-3", taskId: "task-3", status: "failed", agentType: "tester", spawnedAt: new Date().toISOString(), }, ]; mockFetch.mockResolvedValue({ ok: true, json: () => Promise.resolve(mockAgents), }); render(); await waitFor(() => { // Check stats: 3 total, 2 working, 0 idle, 1 error const stats = screen.getAllByText(/^[0-9]+$/); expect(stats[0]).toHaveTextContent("3"); // Total expect(stats[1]).toHaveTextContent("2"); // Working expect(stats[2]).toHaveTextContent("0"); // Idle expect(stats[3]).toHaveTextContent("1"); // Error }); }); });