mirror of
https://github.com/shlinkio/shlink-web-client.git
synced 2024-12-23 09:30:31 +03:00
Migrated VisitsSettings test to react testing library
This commit is contained in:
parent
98ea491469
commit
e538f2a3bb
1 changed files with 24 additions and 28 deletions
|
@ -1,41 +1,35 @@
|
|||
import { shallow, ShallowWrapper } from 'enzyme';
|
||||
import { render, screen } from '@testing-library/react';
|
||||
import userEvent from '@testing-library/user-event';
|
||||
import { Mock } from 'ts-mockery';
|
||||
import { Settings } from '../../src/settings/reducers/settings';
|
||||
import { VisitsSettings } from '../../src/settings/VisitsSettings';
|
||||
import { SimpleCard } from '../../src/utils/SimpleCard';
|
||||
import { DateIntervalSelector } from '../../src/utils/dates/DateIntervalSelector';
|
||||
import { LabeledFormGroup } from '../../src/utils/forms/LabeledFormGroup';
|
||||
|
||||
describe('<VisitsSettings />', () => {
|
||||
let wrapper: ShallowWrapper;
|
||||
const setVisitsSettings = jest.fn();
|
||||
const createWrapper = (settings: Partial<Settings> = {}) => {
|
||||
wrapper = shallow(<VisitsSettings settings={Mock.of<Settings>(settings)} setVisitsSettings={setVisitsSettings} />);
|
||||
|
||||
return wrapper;
|
||||
};
|
||||
const setUp = (settings: Partial<Settings> = {}) => ({
|
||||
user: userEvent.setup(),
|
||||
...render(<VisitsSettings settings={Mock.of<Settings>(settings)} setVisitsSettings={setVisitsSettings} />),
|
||||
});
|
||||
|
||||
afterEach(jest.clearAllMocks);
|
||||
afterEach(() => wrapper?.unmount());
|
||||
|
||||
it('renders expected components', () => {
|
||||
const wrapper = createWrapper();
|
||||
setUp();
|
||||
|
||||
expect(wrapper.find(SimpleCard).prop('title')).toEqual('Visits');
|
||||
expect(wrapper.find(LabeledFormGroup).prop('label')).toEqual('Default interval to load on visits sections:');
|
||||
expect(wrapper.find(DateIntervalSelector)).toHaveLength(1);
|
||||
expect(screen.getByRole('heading')).toHaveTextContent('Visits');
|
||||
expect(screen.getByText('Default interval to load on visits sections:')).toBeInTheDocument();
|
||||
});
|
||||
|
||||
it.each([
|
||||
[Mock.all<Settings>(), 'last30Days'],
|
||||
[Mock.of<Settings>({ visits: {} }), 'last30Days'],
|
||||
[Mock.all<Settings>(), 'Last 30 days'],
|
||||
[Mock.of<Settings>({ visits: {} }), 'Last 30 days'],
|
||||
[
|
||||
Mock.of<Settings>({
|
||||
visits: {
|
||||
defaultInterval: 'last7Days',
|
||||
},
|
||||
}),
|
||||
'last7Days',
|
||||
'Last 7 days',
|
||||
],
|
||||
[
|
||||
Mock.of<Settings>({
|
||||
|
@ -43,21 +37,23 @@ describe('<VisitsSettings />', () => {
|
|||
defaultInterval: 'today',
|
||||
},
|
||||
}),
|
||||
'today',
|
||||
'Today',
|
||||
],
|
||||
])('sets expected interval as active', (settings, expectedInterval) => {
|
||||
const wrapper = createWrapper(settings);
|
||||
|
||||
expect(wrapper.find(DateIntervalSelector).prop('active')).toEqual(expectedInterval);
|
||||
setUp(settings);
|
||||
expect(screen.getByRole('button')).toHaveTextContent(expectedInterval);
|
||||
});
|
||||
|
||||
it('invokes setVisitsSettings when interval changes', () => {
|
||||
const wrapper = createWrapper();
|
||||
const selector = wrapper.find(DateIntervalSelector);
|
||||
it('invokes setVisitsSettings when interval changes', async () => {
|
||||
const { user } = setUp();
|
||||
const selectOption = async (name: string) => {
|
||||
await user.click(screen.getByRole('button'));
|
||||
await user.click(screen.getByRole('menuitem', { name }));
|
||||
};
|
||||
|
||||
selector.simulate('change', 'last7Days');
|
||||
selector.simulate('change', 'last180Days');
|
||||
selector.simulate('change', 'yesterday');
|
||||
await selectOption('Last 7 days');
|
||||
await selectOption('Last 180 days');
|
||||
await selectOption('Yesterday');
|
||||
|
||||
expect(setVisitsSettings).toHaveBeenCalledTimes(3);
|
||||
expect(setVisitsSettings).toHaveBeenNthCalledWith(1, { defaultInterval: 'last7Days' });
|
||||
|
|
Loading…
Reference in a new issue