mirror of
https://github.com/shlinkio/shlink-web-client.git
synced 2026-03-01 05:06:39 +00:00
Replaced firEvent with userEvent as much as possible
This commit is contained in:
@@ -1,4 +1,5 @@
|
||||
import { fireEvent, render, screen } from '@testing-library/react';
|
||||
import { render, screen } from '@testing-library/react';
|
||||
import userEvent from '@testing-library/user-event';
|
||||
import { Mock } from 'ts-mockery';
|
||||
import { ErrorHandler as createErrorHandler } from '../../src/common/ErrorHandler';
|
||||
|
||||
@@ -34,11 +35,12 @@ describe('<ErrorHandler />', () => {
|
||||
expect(screen.getByRole('button')).toBeInTheDocument();
|
||||
});
|
||||
|
||||
it('reloads page on button click', () => {
|
||||
it('reloads page on button click', async () => {
|
||||
const user = userEvent.setup();
|
||||
render(<ErrorHandler children={<ComponentWithError />} />);
|
||||
|
||||
expect(reload).not.toHaveBeenCalled();
|
||||
fireEvent.click(screen.getByRole('button'));
|
||||
await user.click(screen.getByRole('button'));
|
||||
expect(reload).toHaveBeenCalled();
|
||||
});
|
||||
});
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
import { fireEvent, render, screen, waitFor } from '@testing-library/react';
|
||||
import { render, screen, waitFor } from '@testing-library/react';
|
||||
import userEvent from '@testing-library/user-event';
|
||||
import { Router } from 'react-router-dom';
|
||||
import { createMemoryHistory } from 'history';
|
||||
import { MainHeader as createMainHeader } from '../../src/common/MainHeader';
|
||||
@@ -9,11 +10,14 @@ describe('<MainHeader />', () => {
|
||||
const history = createMemoryHistory();
|
||||
history.push(pathname);
|
||||
|
||||
return render(
|
||||
const user = userEvent.setup();
|
||||
const renderResult = render(
|
||||
<Router location={history.location} navigator={history}>
|
||||
<MainHeader />
|
||||
</Router>,
|
||||
);
|
||||
|
||||
return { user, ...renderResult };
|
||||
};
|
||||
|
||||
it('renders ServersDropdown', () => {
|
||||
@@ -37,29 +41,29 @@ describe('<MainHeader />', () => {
|
||||
}
|
||||
});
|
||||
|
||||
it('renders expected class based on the nav bar state', () => {
|
||||
setUp();
|
||||
it('renders expected class based on the nav bar state', async () => {
|
||||
const { user } = setUp();
|
||||
|
||||
const toggle = screen.getByLabelText('Toggle navigation');
|
||||
const icon = toggle.firstChild;
|
||||
|
||||
expect(icon).toHaveAttribute('class', expect.stringMatching(/main-header__toggle-icon$/));
|
||||
fireEvent.click(toggle);
|
||||
await user.click(toggle);
|
||||
expect(icon).toHaveAttribute(
|
||||
'class',
|
||||
expect.stringMatching(/main-header__toggle-icon main-header__toggle-icon--opened$/),
|
||||
);
|
||||
fireEvent.click(toggle);
|
||||
await user.click(toggle);
|
||||
expect(icon).toHaveAttribute('class', expect.stringMatching(/main-header__toggle-icon$/));
|
||||
});
|
||||
|
||||
it('opens Collapse when clicking toggle', async () => {
|
||||
const { container } = setUp();
|
||||
const { container, user } = setUp();
|
||||
const collapse = container.querySelector('.collapse');
|
||||
const toggle = screen.getByLabelText('Toggle navigation');
|
||||
|
||||
expect(collapse).not.toHaveAttribute('class', expect.stringContaining('show'));
|
||||
fireEvent.click(toggle);
|
||||
await user.click(toggle);
|
||||
await waitFor(() => expect(collapse).toHaveAttribute('class', expect.stringContaining('show')));
|
||||
});
|
||||
});
|
||||
|
||||
Reference in New Issue
Block a user