import React from 'react';
import { render, screen, fireEvent } from '@testing-library/react';
import { FileDropZone } from './FileDropZone';
var mockOnFileDrop = jest.fn();
var setUp = function () {
    return render(React.createElement(FileDropZone, { onFileDrop: mockOnFileDrop },
        React.createElement("span", null, "Drop content here")));
};
describe('FileDropZone', function () {
    afterEach(function () {
        jest.clearAllMocks();
    });
    it('should render children', function () {
        setUp();
        expect(screen.getByText('Drop content here')).toBeInTheDocument();
    });
    it('should have correct accessibility attributes', function () {
        setUp();
        var dropZone = screen.getByRole('button', { name: 'Drop files here' });
        expect(dropZone).toBeInTheDocument();
        expect(dropZone).toHaveAttribute('tabindex', '0');
    });
    it('should activate drag state on drag over with acceptable file type', function () {
        setUp();
        var dropZone = screen.getByRole('button', { name: 'Drop files here' });
        fireEvent.dragOver(dropZone, {
            dataTransfer: { types: ['Files'], dropEffect: 'copy' }
        });
        expect(dropZone).toHaveClass('active');
    });
    it('should not activate drag state with unacceptable file type', function () {
        setUp();
        var dropZone = screen.getByRole('button', { name: 'Drop files here' });
        fireEvent.dragOver(dropZone, {
            dataTransfer: { types: ['Text'], dropEffect: 'none' }
        });
        expect(dropZone).not.toHaveClass('active');
    });
    it('should activate drag state on drag enter with acceptable file type', function () {
        setUp();
        var dropZone = screen.getByRole('button', { name: 'Drop files here' });
        fireEvent.dragEnter(dropZone, {
            dataTransfer: { types: ['Files'] }
        });
        expect(dropZone).toHaveClass('active');
    });
    it('should deactivate drag state on drag leave', function () {
        setUp();
        var dropZone = screen.getByRole('button', { name: 'Drop files here' });
        fireEvent.dragOver(dropZone, { dataTransfer: { types: ['Files'] } });
        expect(dropZone).toHaveClass('active');
        fireEvent.dragLeave(dropZone);
        expect(dropZone).not.toHaveClass('active');
    });
    it('should call onFileDrop with the dropped file', function () {
        var file = new File(['test content'], 'test.csv', { type: 'text/csv' });
        setUp();
        var dropZone = screen.getByRole('button', { name: 'Drop files here' });
        fireEvent.drop(dropZone, {
            dataTransfer: {
                files: [file],
                types: ['Files']
            }
        });
        expect(mockOnFileDrop).toHaveBeenCalledWith(file);
    });
    it('should not call onFileDrop if dropped item is not of file type', function () {
        setUp();
        var dropZone = screen.getByRole('button', { name: 'Drop files here' });
        fireEvent.drop(dropZone, {
            dataTransfer: { types: ['Text'] }
        });
        expect(mockOnFileDrop).not.toHaveBeenCalled();
    });
    it('should deactivate drag state after drop', function () {
        var file = new File(['test content'], 'test.csv', { type: 'text/csv' });
        setUp();
        var dropZone = screen.getByRole('button', { name: 'Drop files here' });
        fireEvent.dragOver(dropZone, { dataTransfer: { types: ['Files'] } });
        expect(dropZone).toHaveClass('active');
        fireEvent.drop(dropZone, {
            dataTransfer: {
                files: [file],
                types: ['Files']
            }
        });
        expect(dropZone).not.toHaveClass('active');
    });
});
