Experiments DB Dev
32 lines
1.2 KiB
React
32 lines
1.2 KiB
React
import React from 'react';
|
|
import { render, screen, fireEvent } from '@testing-library/react';
|
|
import Modal from '../src/components/ui/Modal';
|
|
|
|
describe('Modal component', () => {
|
|
it('does not render when isOpen is false', () => {
|
|
render(<Modal isOpen={false} onClose={() => {}} title="Test"><p>content</p></Modal>);
|
|
expect(screen.queryByRole('dialog')).not.toBeInTheDocument();
|
|
});
|
|
|
|
it('renders title and children when open', () => {
|
|
render(<Modal isOpen={true} onClose={() => {}} title="My Modal"><p>Hello</p></Modal>);
|
|
expect(screen.getByRole('dialog')).toBeInTheDocument();
|
|
expect(screen.getByText('My Modal')).toBeInTheDocument();
|
|
expect(screen.getByText('Hello')).toBeInTheDocument();
|
|
});
|
|
|
|
it('calls onClose when close button is clicked', () => {
|
|
const onClose = jest.fn();
|
|
render(<Modal isOpen={true} onClose={onClose} title="T"><p>x</p></Modal>);
|
|
fireEvent.click(screen.getByLabelText(/close modal/i));
|
|
expect(onClose).toHaveBeenCalled();
|
|
});
|
|
|
|
it('calls onClose when Escape key is pressed', () => {
|
|
const onClose = jest.fn();
|
|
render(<Modal isOpen={true} onClose={onClose} title="T"><p>x</p></Modal>);
|
|
fireEvent.keyDown(document, { key: 'Escape' });
|
|
expect(onClose).toHaveBeenCalled();
|
|
});
|
|
});
|