Replace @testing-library/jest-dom with built-in vitest browser assertions

This commit is contained in:
Alejandro Celaya
2026-08-16 19:32:41 +02:00
parent ba73644871
commit 585d7c6f63
30 changed files with 305 additions and 429 deletions

View File

@@ -1,4 +1,4 @@
import { act, screen, waitFor } from '@testing-library/react';
import { page } from 'vitest/browser';
import { AppUpdateBanner } from '../../src/common/AppUpdateBanner';
import { checkAccessibility } from '../__helpers__/accessibility';
import { renderWithEvents } from '../__helpers__/setUpTest';
@@ -6,40 +6,33 @@ import { renderWithEvents } from '../__helpers__/setUpTest';
describe('<AppUpdateBanner />', () => {
const onClose = vi.fn();
const forceUpdate = vi.fn();
const setUp = async () => {
const result = await act(() =>
renderWithEvents(<AppUpdateBanner isOpen onClose={onClose} forceUpdate={forceUpdate} />),
);
await waitFor(() => screen.getByRole('alert'));
return result;
};
const setUp = () => renderWithEvents(<AppUpdateBanner isOpen onClose={onClose} forceUpdate={forceUpdate} />);
it('passes a11y checks', () => checkAccessibility(setUp()));
it('renders initial state', async () => {
await setUp();
setUp();
expect(screen.getByRole('heading')).toHaveTextContent('This app has just been updated!');
expect(screen.queryByText('Restarting...')).not.toBeInTheDocument();
expect(screen.getByText('Restart now')).not.toHaveAttribute('disabled');
await expect.element(page.getByRole('heading')).toHaveTextContent('This app has just been updated!');
await expect.element(page.getByText('Restarting...')).not.toBeInTheDocument();
await expect.element(page.getByText('Restart now')).not.toHaveAttribute('disabled');
});
it('invokes toggle when alert is closed', async () => {
const { user } = await setUp();
const { user } = setUp();
expect(onClose).not.toHaveBeenCalled();
await user.click(screen.getByLabelText('Close'));
await user.click(page.getByLabelText('Close'));
expect(onClose).toHaveBeenCalled();
});
it('triggers the update when clicking the button', async () => {
const { user } = await setUp();
const { user } = setUp();
expect(forceUpdate).not.toHaveBeenCalled();
await user.click(screen.getByText(/^Restart now/));
await user.click(page.getByText(/^Restart now/));
expect(forceUpdate).toHaveBeenCalled();
expect(await screen.findByText('Restarting...')).toBeInTheDocument();
expect(screen.queryByText(/^Restart now/)).not.toBeInTheDocument();
await expect.element(page.getByText('Restarting...')).toBeInTheDocument();
await expect.element(page.getByText(/^Restart now/)).not.toBeInTheDocument();
});
});