import { render, fireEvent } from '@testing-library/svelte';
import { describe, it, expect, vi } from 'vitest';
import FileUploaderItem from './FileUploaderItem.svelte';
const sampleFile = { name: 'test-file.txt', size: 1234 };
describe('FileUploaderItem component', () => {
    it('renders file name by default', () => {
        const { getByText } = render(FileUploaderItem, {
            props: { file: sampleFile, ondelete: () => { } },
        });
        expect(getByText('test-file.txt')).toBeTruthy();
    });
    it('shows error message when invalid and errormessage provided', () => {
        const { getByText } = render(FileUploaderItem, {
            props: { file: sampleFile, valid: false, errormessage: 'Upload failed', ondelete: () => { } },
        });
        expect(getByText('Upload failed')).toBeTruthy();
    });
    it('does not show error message when valid is true', () => {
        const { queryByText } = render(FileUploaderItem, {
            props: { file: sampleFile, valid: true, errormessage: 'Upload failed', ondelete: () => { } },
        });
        expect(queryByText('Upload failed')).toBeNull();
    });
    it('calls ondelete when delete button is clicked (inline format)', async () => {
        const ondelete = vi.fn();
        const { getByLabelText } = render(FileUploaderItem, {
            props: { file: sampleFile, ondelete, deletebuttonlabel: 'Remove' },
        });
        const btn = getByLabelText('Delete file');
        await fireEvent.click(btn);
        expect(ondelete).toHaveBeenCalledTimes(1);
    });
    it('applies correct state modifier classes for valid and invalid states', async () => {
        const { container, rerender } = render(FileUploaderItem, {
            props: { file: sampleFile, valid: false, ondelete: () => { } },
        });
        expect(container.querySelector('.mc-file-uploader-item--error')).toBeTruthy();
        await rerender({ file: sampleFile, valid: true, ondelete: () => { } });
        expect(container.querySelector('.mc-file-uploader-item--default')).toBeFalsy();
    });
});
