scrum-manager/src/__tests__/Kanban.test.tsx

import { describe, it, expect, vi, beforeEach } from 'vitest';
import { render, screen, fireEvent } from '@testing-library/react';
import { KanbanBoard } from '../Kanban';
import type { Task, User } from '../data';

// Mock Shared components
vi.mock('../Shared', () => ({
    Avatar: ({ userId }: any) => <div data-testid="avatar">{userId}</div>,
    PriorityBadge: ({ level }: any) => <div>{level}</div>,
    StatusBadge: ({ status }: any) => <div>{status}</div>,
    ProgressBar: () => <div>Progress</div>
}));

describe('KanbanBoard Component', () => {
    const mockUser: User = { id: 'u1', name: 'Test User', email: 'test@example.com', role: 'emp', dept: 'dev', avatar: 'TU', color: '#000' };
    const mockUsers = [mockUser];

    const mockTasks: Task[] = [
        { id: 't1', title: 'Task 1', description: 'Desc', status: 'todo', priority: 'medium', assignee: 'u1', reporter: 'u1', dueDate: '2023-12-31', tags: [], subtasks: [], comments: [], activity: [], dependencies: [] },
        { id: 't2', title: 'Task 2', description: 'Desc', status: 'inprogress', priority: 'high', assignee: 'u1', reporter: 'u1', dueDate: '2023-12-31', tags: [], subtasks: [], comments: [], activity: [], dependencies: [] },
    ];

    const mockOnTaskClick = vi.fn();
    const mockOnAddTask = vi.fn();
    const mockOnMoveTask = vi.fn();

    beforeEach(() => {
        vi.clearAllMocks();
    });

    it('renders columns and tasks', () => {
        render(<KanbanBoard tasks={mockTasks} currentUser={mockUser} onTaskClick={mockOnTaskClick} onAddTask={mockOnAddTask} onMoveTask={mockOnMoveTask} filterUser={null} searchQuery="" users={mockUsers} />);

        expect(screen.getByText('To Do')).toBeInTheDocument();
        expect(screen.getByText('In Progress')).toBeInTheDocument();
        expect(screen.getByText('Review')).toBeInTheDocument();
        expect(screen.getByText('Done')).toBeInTheDocument();

        expect(screen.getByText('Task 1')).toBeInTheDocument();
        expect(screen.getByText('Task 2')).toBeInTheDocument();
    });

    it('filters tasks by search query', () => {
        render(<KanbanBoard tasks={mockTasks} currentUser={mockUser} onTaskClick={mockOnTaskClick} onAddTask={mockOnAddTask} onMoveTask={mockOnMoveTask} filterUser={null} searchQuery="Task 1" users={mockUsers} />);

        expect(screen.getByText('Task 1')).toBeInTheDocument();
        expect(screen.queryByText('Task 2')).not.toBeInTheDocument();
    });

    it('calls onAddTask when + button clicked', () => {
        render(<KanbanBoard tasks={mockTasks} currentUser={mockUser} onTaskClick={mockOnTaskClick} onAddTask={mockOnAddTask} onMoveTask={mockOnMoveTask} filterUser={null} searchQuery="" users={mockUsers} />);

        // There are multiple + buttons (one per column)
        const addButtons = screen.getAllByText('+');
        fireEvent.click(addButtons[0]); // Click first column (Todo) add button

        expect(mockOnAddTask).toHaveBeenCalledWith('todo');
    });

    it('calls onTaskClick when task clicked', () => {
        render(<KanbanBoard tasks={mockTasks} currentUser={mockUser} onTaskClick={mockOnTaskClick} onAddTask={mockOnAddTask} onMoveTask={mockOnMoveTask} filterUser={null} searchQuery="" users={mockUsers} />);

        fireEvent.click(screen.getByText('Task 1'));
        expect(mockOnTaskClick).toHaveBeenCalledWith(mockTasks[0]);
    });
});