import { composeStories } from "@storybook/react";
import { render, screen } from "@testing-library/react";
import { describe, expect, it } from "vitest";
import * as kanbanBoardStories from "./KanbanBoard.stories";
const { Default, WithPriorities, SimpleTasks, EmptyBoard, FullBoard } =
composeStories(kanbanBoardStories);
describe("KanbanBoard stories", () => {
describe("Default story", () => {
it("should render column titles", () => {
render();
expect(screen.getByText("To Do")).toBeInTheDocument();
expect(screen.getByText("In Progress")).toBeInTheDocument();
expect(screen.getByText("Done")).toBeInTheDocument();
});
it("should render task cards", () => {
render();
expect(
screen.getByText("Implement user authentication"),
).toBeInTheDocument();
expect(screen.getByText("Design dashboard mockups")).toBeInTheDocument();
});
});
describe("WithPriorities story", () => {
it("should render tasks with different priorities", () => {
render();
expect(
screen.getByText("Critical bug in production"),
).toBeInTheDocument();
expect(screen.getByText("Update documentation")).toBeInTheDocument();
});
it("should render all kanban columns", () => {
render();
expect(screen.getByText("Backlog")).toBeInTheDocument();
expect(screen.getByText("To Do")).toBeInTheDocument();
expect(screen.getByText("In Progress")).toBeInTheDocument();
expect(screen.getByText("Review")).toBeInTheDocument();
expect(screen.getByText("Done")).toBeInTheDocument();
});
});
describe("SimpleTasks story", () => {
it("should render simple task list", () => {
render();
expect(screen.getByText("Task 1")).toBeInTheDocument();
expect(screen.getByText("Task 2")).toBeInTheDocument();
expect(screen.getByText("Task 3")).toBeInTheDocument();
});
});
describe("EmptyBoard story", () => {
it("should render empty columns", () => {
render();
expect(screen.getByText("To Do")).toBeInTheDocument();
expect(screen.getByText("In Progress")).toBeInTheDocument();
expect(screen.getByText("Done")).toBeInTheDocument();
});
});
describe("FullBoard story", () => {
it("should render comprehensive kanban board", () => {
render();
expect(screen.getByText("Backlog")).toBeInTheDocument();
expect(screen.getByText("To Do")).toBeInTheDocument();
expect(screen.getByText("In Progress")).toBeInTheDocument();
expect(screen.getByText("Review")).toBeInTheDocument();
expect(screen.getByText("Done")).toBeInTheDocument();
});
it("should render multiple tasks per column", () => {
render();
// Check that various tasks are rendered
const tasks = screen.getAllByRole("article");
expect(tasks.length).toBeGreaterThan(5);
});
});
});