Use screen terminology instead of page as documented by vite-browser-react

This commit is contained in:
Alejandro Celaya
2026-08-16 21:08:53 +02:00
parent c5c994a603
commit 31531c1f87
18 changed files with 213 additions and 210 deletions

View File

@@ -19,38 +19,38 @@ describe('<DeleteServerModal />', () => {
it('passes a11y checks', () => checkAccessibility(setUp()));
it('renders a modal window', async () => {
const page = await setUp();
const screen = await setUp();
await expect.element(page.getByRole('dialog')).toBeInTheDocument();
await expect.element(page.getByRole('heading')).toHaveTextContent('Remove server');
await expect.element(screen.getByRole('dialog')).toBeInTheDocument();
await expect.element(screen.getByRole('heading')).toHaveTextContent('Remove server');
});
it('displays the name of the server as part of the content', async () => {
const page = await setUp();
const screen = await setUp();
await expect.element(page.getByText(/^Are you sure you want to remove/)).toBeInTheDocument();
await expect.element(page.getByText(serverName)).toBeInTheDocument();
await expect.element(screen.getByText(/^Are you sure you want to remove/)).toBeInTheDocument();
await expect.element(screen.getByText(serverName)).toBeInTheDocument();
});
it.each([
[(page: RenderResult) => page.getByRole('button', { name: 'Cancel' })],
[(page: RenderResult) => page.getByLabelText('Close dialog')],
[(screen: RenderResult) => screen.getByRole('button', { name: 'Cancel' })],
[(screen: RenderResult) => screen.getByLabelText('Close dialog')],
])('closes dialog when clicking cancel button', async (getButton) => {
const { user, store, ...page } = await setUp();
const { user, store, ...screen } = await setUp();
await expect.element(page.getByRole('dialog')).toBeInTheDocument();
await user.click(getButton(page));
await expect.element(page.getByRole('dialog')).not.toBeInTheDocument();
await expect.element(screen.getByRole('dialog')).toBeInTheDocument();
await user.click(getButton(screen));
await expect.element(screen.getByRole('dialog')).not.toBeInTheDocument();
// No server has been deleted
expect(Object.keys(store.getState().servers)).toHaveLength(1);
});
it('deletes server when clicking accept button', async () => {
const { user, store, ...page } = await setUp();
const { user, store, ...screen } = await setUp();
expect(Object.keys(store.getState().servers)).toHaveLength(1);
await user.click(page.getByRole('button', { name: 'Delete' }));
await user.click(screen.getByRole('button', { name: 'Delete' }));
expect(Object.keys(store.getState().servers)).toHaveLength(0);
});
});