File size: 2,684 Bytes
9705b6c |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 |
import 'test/matchMedia.mock';
import React from 'react';
import { render, fireEvent } from '@testing-library/react';
import '@testing-library/jest-dom/extend-expect';
import DialogTemplate from './DialogTemplate';
import { Dialog } from '@radix-ui/react-dialog';
import { RecoilRoot } from 'recoil';
describe('DialogTemplate', () => {
let mockSelectHandler;
beforeEach(() => {
mockSelectHandler = jest.fn();
});
it('renders correctly with all props', () => {
const { getByText } = render(
<RecoilRoot>
<Dialog
open
data-testid="test-dialog"
onOpenChange={() => {
return;
}}
>
<DialogTemplate
title="Test Dialog"
description="Test Description"
main={<div>Main Content</div>}
buttons={<button>Button</button>}
leftButtons={<button>Left Button</button>}
selection={{ selectHandler: mockSelectHandler, selectText: 'Select' }}
/>
</Dialog>
</RecoilRoot>,
);
expect(getByText('Test Dialog')).toBeInTheDocument();
expect(getByText('Test Description')).toBeInTheDocument();
expect(getByText('Main Content')).toBeInTheDocument();
expect(getByText('Button')).toBeInTheDocument();
expect(getByText('Left Button')).toBeInTheDocument();
expect(getByText('Cancel')).toBeInTheDocument();
expect(getByText('Select')).toBeInTheDocument();
});
it('renders correctly without optional props', () => {
const { queryByText } = render(
<RecoilRoot>
<Dialog
open
onOpenChange={() => {
return;
}}
></Dialog>
</RecoilRoot>,
);
expect(queryByText('Test Dialog')).toBeNull();
expect(queryByText('Test Description')).not.toBeInTheDocument();
expect(queryByText('Main Content')).not.toBeInTheDocument();
expect(queryByText('Button')).not.toBeInTheDocument();
expect(queryByText('Left Button')).not.toBeInTheDocument();
expect(queryByText('Cancel')).not.toBeInTheDocument();
expect(queryByText('Select')).not.toBeInTheDocument();
});
it('calls selectHandler when the select button is clicked', () => {
const { getByText } = render(
<RecoilRoot>
<Dialog
open
onOpenChange={() => {
return;
}}
>
<DialogTemplate
title="Test Dialog"
selection={{ selectHandler: mockSelectHandler, selectText: 'Select' }}
/>
</Dialog>
</RecoilRoot>,
);
fireEvent.click(getByText('Select'));
expect(mockSelectHandler).toHaveBeenCalled();
});
});
|