import { describe, it, expect } from "vitest";
import { render, screen } from "@testing-library/react";
import { TaskList } from "./TaskList";
import { TaskStatus, TaskPriority, type Task } from "@mosaic/shared";
describe("TaskList", (): void => {
const mockTasks: Task[] = [
{
id: "task-1",
title: "Review pull request",
description: "Review and provide feedback on frontend PR",
status: TaskStatus.IN_PROGRESS,
priority: TaskPriority.HIGH,
dueDate: new Date("2026-01-29"),
creatorId: "user-1",
assigneeId: "user-1",
workspaceId: "workspace-1",
projectId: null,
parentId: null,
sortOrder: 0,
metadata: {},
completedAt: null,
createdAt: new Date("2026-01-28"),
updatedAt: new Date("2026-01-28"),
},
{
id: "task-2",
title: "Update documentation",
description: "Add setup instructions",
status: TaskStatus.NOT_STARTED,
priority: TaskPriority.MEDIUM,
dueDate: new Date("2026-02-05"),
creatorId: "user-1",
assigneeId: "user-1",
workspaceId: "workspace-1",
projectId: null,
parentId: null,
sortOrder: 1,
metadata: {},
completedAt: null,
createdAt: new Date("2026-01-28"),
updatedAt: new Date("2026-01-28"),
},
];
it("should render empty state when no tasks", (): void => {
render();
expect(screen.getByText(/no tasks scheduled/i)).toBeInTheDocument();
});
it("should render loading state", (): void => {
render();
expect(screen.getByText(/loading/i)).toBeInTheDocument();
});
it("should render tasks list", (): void => {
render();
expect(screen.getByText("Review pull request")).toBeInTheDocument();
expect(screen.getByText("Update documentation")).toBeInTheDocument();
});
it("should group tasks by date", (): void => {
render();
// Should have date group sections (Today, This Week, etc.)
// The exact sections depend on the current date, so just verify grouping works
const sections = screen.getAllByRole("heading", { level: 2 });
expect(sections.length).toBeGreaterThan(0);
});
it("should use PDA-friendly language", (): void => {
render();
// Should NOT contain demanding language
const text = screen.getByRole("main").textContent;
expect(text).not.toMatch(/overdue/i);
expect(text).not.toMatch(/urgent/i);
expect(text).not.toMatch(/must do/i);
});
it("should display status indicators", (): void => {
render();
// Check for emoji status indicators (rendered as text)
const listItems = screen.getAllByRole("listitem");
expect(listItems.length).toBe(mockTasks.length);
});
describe("error states", (): void => {
it("should handle undefined tasks gracefully", (): void => {
render();
expect(screen.getByText(/no tasks scheduled/i)).toBeInTheDocument();
});
it("should handle null tasks gracefully", (): void => {
render();
expect(screen.getByText(/no tasks scheduled/i)).toBeInTheDocument();
});
it("should handle tasks with missing required fields", (): void => {
const firstTask = mockTasks[0];
if (!firstTask) {
throw new Error("Mock task not found");
}
const malformedTasks: Task[] = [
{
...firstTask,
title: "", // Empty title
},
];
render();
// Component should render without crashing
expect(screen.getByRole("main")).toBeInTheDocument();
});
it("should handle tasks with invalid dates", (): void => {
const firstTask = mockTasks[0];
if (!firstTask) {
throw new Error("Mock task not found");
}
const tasksWithBadDates: Task[] = [
{
...firstTask,
dueDate: new Date("invalid-date"),
},
];
render();
expect(screen.getByRole("main")).toBeInTheDocument();
});
it("should handle extremely large task lists", (): void => {
const firstTask = mockTasks[0];
if (!firstTask) {
throw new Error("Mock task not found");
}
const largeTasks: Task[] = Array.from({ length: 1000 }, (_, i) => ({
...firstTask,
id: `task-${String(i)}`,
title: `Task ${String(i)}`,
}));
render();
expect(screen.getByRole("main")).toBeInTheDocument();
});
it("should handle tasks with very long titles", (): void => {
const firstTask = mockTasks[0];
if (!firstTask) {
throw new Error("Mock task not found");
}
const longTitleTask: Task = {
...firstTask,
title: "A".repeat(500),
};
render();
expect(screen.getByText(/A{500}/)).toBeInTheDocument();
});
it("should handle tasks with special characters in title", (): void => {
const firstTask = mockTasks[0];
if (!firstTask) {
throw new Error("Mock task not found");
}
const specialCharTask: Task = {
...firstTask,
title: '',
};
render();
// Should render escaped, not execute
expect(screen.getByRole("main").innerHTML).not.toContain("