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

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

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

    // Test data
    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: 'done', priority: 'high', assignee: 'u1', reporter: 'u1', dueDate: '2023-12-31', tags: [], subtasks: [], comments: [], activity: [], dependencies: [] },
    ];

    const mockOnTaskClick = vi.fn();
    const mockOnToggleDone = vi.fn();

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

    it('renders tasks in list', () => {
        render(<ListView tasks={mockTasks} currentUser={mockUser} onTaskClick={mockOnTaskClick} onToggleDone={mockOnToggleDone} filterUser={null} searchQuery="" users={mockUsers} />);

        expect(screen.getByText('Task 1')).toBeInTheDocument();
        expect(screen.getByText('Task 2')).toBeInTheDocument();
        // Check for headers (using getAllByText because buttons also have these labels)
        expect(screen.getAllByText('Title').length).toBeGreaterThan(0);
        expect(screen.getAllByText('Assignee').length).toBeGreaterThan(0);
        expect(screen.getAllByText('Status').length).toBeGreaterThan(0);
    });

    it('filters tasks by search', () => {
        render(<ListView tasks={mockTasks} currentUser={mockUser} onTaskClick={mockOnTaskClick} onToggleDone={mockOnToggleDone} filterUser={null} searchQuery="Task 1" users={mockUsers} />);

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

    it('handles task click', () => {
        render(<ListView tasks={mockTasks} currentUser={mockUser} onTaskClick={mockOnTaskClick} onToggleDone={mockOnToggleDone} filterUser={null} searchQuery="" users={mockUsers} />);

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

    it('handles toggle done', () => {
        render(<ListView tasks={mockTasks} currentUser={mockUser} onTaskClick={mockOnTaskClick} onToggleDone={mockOnToggleDone} filterUser={null} searchQuery="" users={mockUsers} />);

        const checkboxes = screen.getAllByRole('checkbox');
        fireEvent.click(checkboxes[0]);

        expect(mockOnToggleDone).toHaveBeenCalledWith('t1');
    });
});