import { describe, it, afterEach, expect, $, sleep, closeAll } from './runner.js?v=3';
import { state } from '../../js/modules/state.js';

describe('Multi-Select', () => {
    afterEach(() => closeAll());

    it('select bar hidden by default', () => {
        expect($('#select-bar').classList.contains('hidden')).toBe(true);
    });

    it('has all action buttons', () => {
        for (const id of ['select-group', 'select-bucket', 'select-unbucket', 'select-color', 'select-tag', 'select-export', 'select-delete', 'select-clear']) {
            expect($(`#${id}`)).toExist();
        }
    });

    it('Ctrl+click selects card and shows bar', async () => {
        await sleep(150);
        const card = $('#board [data-id]');
        if (!card) return;
        card.dispatchEvent(new MouseEvent('click', { bubbles: true, ctrlKey: true }));
        await sleep(150);
        expect(state.selectedIds.has(card.dataset.id)).toBe(true);
        expect($('#select-bar').classList.contains('hidden')).toBe(false);
    });

    it('Ctrl+click toggle: select then deselect', async () => {
        await sleep(150);
        // Ensure clean state
        state.selectedIds.clear();
        await sleep(50);
        const card = $('#board [data-id]');
        if (!card) return;
        const id = card.dataset.id;
        card.dispatchEvent(new MouseEvent('click', { bubbles: true, ctrlKey: true }));
        await sleep(200);
        expect(state.selectedIds.has(id)).toBe(true);
        card.dispatchEvent(new MouseEvent('click', { bubbles: true, ctrlKey: true }));
        await sleep(200);
        expect(state.selectedIds.has(id)).toBe(false);
    });

    it('multiple cards selectable', async () => {
        await sleep(150);
        const cards = [...document.querySelectorAll('#board [data-id]')];
        if (cards.length < 2) return;
        cards[0].dispatchEvent(new MouseEvent('click', { bubbles: true, ctrlKey: true }));
        await sleep(100);
        cards[1].dispatchEvent(new MouseEvent('click', { bubbles: true, ctrlKey: true }));
        await sleep(150);
        expect(state.selectedIds.has(cards[0].dataset.id)).toBe(true);
        expect(state.selectedIds.has(cards[1].dataset.id)).toBe(true);
        expect(state.selectedIds.size).toBe(2);
    });

    it('click outside board clears selection', async () => {
        await sleep(150);
        const card = $('#board [data-id]');
        if (!card) return;
        card.dispatchEvent(new MouseEvent('click', { bubbles: true, ctrlKey: true }));
        await sleep(150);
        expect(state.selectedIds.size).toBeGreaterThan(0);
        document.querySelector('header').dispatchEvent(new MouseEvent('click', { bubbles: true }));
        await sleep(150);
        expect(state.selectedIds.size).toBe(0);
    });
});