mirror of
https://github.com/shlinkio/shlink-web-client.git
synced 2026-10-19 12:14:11 +00:00
Replace @testing-library/jest-dom with built-in vitest browser assertions
This commit is contained in:
@@ -1,7 +1,7 @@
|
||||
import { screen } from '@testing-library/react';
|
||||
import { fromPartial } from '@total-typescript/shoehorn';
|
||||
import type { PropsWithChildren, ReactNode } from 'react';
|
||||
import { ErrorHandler as BaseErrorHandler } from '../../src/common/ErrorHandler';
|
||||
import type { ReactNode } from 'react';
|
||||
import { page } from 'vitest/browser';
|
||||
import { ErrorHandler } from '../../src/common/ErrorHandler';
|
||||
import { checkAccessibility } from '../__helpers__/accessibility';
|
||||
import { renderWithEvents } from '../__helpers__/setUpTest';
|
||||
|
||||
@@ -13,8 +13,12 @@ describe('<ErrorHandler />', () => {
|
||||
const reload = vi.fn();
|
||||
const location = fromPartial<Window['location']>({ reload });
|
||||
const cons = fromPartial<Console>({ error: vi.fn() });
|
||||
const ErrorHandler = (props: PropsWithChildren) => <BaseErrorHandler console={cons} location={location} {...props} />;
|
||||
const setUp = (children: ReactNode = 'Error') => renderWithEvents(<ErrorHandler>{children}</ErrorHandler>);
|
||||
const setUp = (children: ReactNode = 'Error') =>
|
||||
renderWithEvents(
|
||||
<ErrorHandler console={cons} location={location}>
|
||||
{children}
|
||||
</ErrorHandler>,
|
||||
);
|
||||
|
||||
beforeEach(() => {
|
||||
vi.spyOn(console, 'error').mockImplementation(() => {}); // Silence react errors
|
||||
@@ -22,26 +26,26 @@ describe('<ErrorHandler />', () => {
|
||||
|
||||
it('passes a11y checks', () => checkAccessibility(setUp()));
|
||||
|
||||
it('renders children when no error has occurred', () => {
|
||||
it('renders children when no error has occurred', async () => {
|
||||
setUp(<span>Foo</span>);
|
||||
|
||||
expect(screen.getByText('Foo')).toBeInTheDocument();
|
||||
expect(screen.queryByText('Oops! This is awkward :S')).not.toBeInTheDocument();
|
||||
expect(screen.queryByRole('button')).not.toBeInTheDocument();
|
||||
await expect.element(page.getByText('Foo')).toBeInTheDocument();
|
||||
await expect.element(page.getByText('Oops! This is awkward :S')).not.toBeInTheDocument();
|
||||
await expect.element(page.getByRole('button')).not.toBeInTheDocument();
|
||||
});
|
||||
|
||||
it('renders error page when error has occurred', () => {
|
||||
it('renders error page when error has occurred', async () => {
|
||||
setUp(<ComponentWithError />);
|
||||
|
||||
expect(screen.getByText('Oops! This is awkward :S')).toBeInTheDocument();
|
||||
expect(screen.getByRole('button')).toBeInTheDocument();
|
||||
await expect.element(page.getByText('Oops! This is awkward :S')).toBeInTheDocument();
|
||||
await expect.element(page.getByRole('button')).toBeInTheDocument();
|
||||
});
|
||||
|
||||
it('reloads page on button click', async () => {
|
||||
const { user } = setUp(<ComponentWithError />);
|
||||
|
||||
expect(reload).not.toHaveBeenCalled();
|
||||
await user.click(screen.getByRole('button'));
|
||||
await user.click(page.getByRole('button'));
|
||||
expect(reload).toHaveBeenCalled();
|
||||
});
|
||||
});
|
||||
|
||||
Reference in New Issue
Block a user