6302148822
Screen-reader heading, result count visibility tied to totalElements, new-document CTA gated on canWrite, bulk-edit-all CTA gated on canWrite × totalElements > 0. Mocks $app/state and $app/navigation. 7 tests covering the orchestration branches without populating items (DocumentList children require richer DTO shape covered separately). Refs #496. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
116 lines
3.0 KiB
TypeScript
116 lines
3.0 KiB
TypeScript
import { describe, it, expect, vi, afterEach } from 'vitest';
|
|
import { cleanup, render } from 'vitest-browser-svelte';
|
|
import { page } from 'vitest/browser';
|
|
|
|
const mockNavigating = { to: null };
|
|
|
|
vi.mock('$app/navigation', () => ({
|
|
beforeNavigate: () => {},
|
|
afterNavigate: () => {},
|
|
goto: vi.fn(),
|
|
invalidate: vi.fn(),
|
|
invalidateAll: vi.fn(),
|
|
preloadCode: vi.fn(),
|
|
preloadData: vi.fn(),
|
|
pushState: vi.fn(),
|
|
replaceState: vi.fn(),
|
|
disableScrollHandling: vi.fn(),
|
|
onNavigate: () => () => {}
|
|
}));
|
|
|
|
vi.mock('$app/state', () => ({
|
|
get navigating() {
|
|
return mockNavigating;
|
|
},
|
|
get page() {
|
|
return { url: new URL('http://localhost/documents'), data: {} };
|
|
}
|
|
}));
|
|
|
|
const { default: DocumentsListPage } = await import('./+page.svelte');
|
|
|
|
afterEach(cleanup);
|
|
|
|
const baseData = (overrides: Record<string, unknown> = {}) => ({
|
|
items: [] as { id: string; title: string }[],
|
|
totalElements: 0,
|
|
totalPages: 1,
|
|
pageNumber: 0,
|
|
canWrite: false,
|
|
error: null,
|
|
q: '',
|
|
from: '',
|
|
to: '',
|
|
senderId: '',
|
|
receiverId: '',
|
|
initialSenderName: '',
|
|
initialReceiverName: '',
|
|
tags: [] as string[],
|
|
sort: 'DATE',
|
|
dir: 'desc',
|
|
tagQ: '',
|
|
tagOp: 'AND',
|
|
density: [],
|
|
minDate: null,
|
|
maxDate: null,
|
|
zoomFrom: null,
|
|
zoomTo: null,
|
|
...overrides
|
|
});
|
|
|
|
describe('documents/+ page', () => {
|
|
it('renders the screen-reader-only heading', async () => {
|
|
render(DocumentsListPage, { props: { data: baseData() } });
|
|
|
|
await expect
|
|
.element(page.getByRole('heading', { name: /^dokumente$/i, level: 1 }))
|
|
.toBeVisible();
|
|
});
|
|
|
|
it('omits the result count when totalElements is 0', async () => {
|
|
render(DocumentsListPage, { props: { data: baseData() } });
|
|
|
|
await expect.element(page.getByText(/0 Dokumente/i)).not.toBeInTheDocument();
|
|
});
|
|
|
|
it('renders the result count when totalElements is greater than 0', async () => {
|
|
render(DocumentsListPage, {
|
|
props: { data: baseData({ totalElements: 5 }) }
|
|
});
|
|
|
|
await expect.element(page.getByText(/5 Dokumente/i)).toBeVisible();
|
|
});
|
|
|
|
it('shows the new-document CTA when canWrite is true', async () => {
|
|
render(DocumentsListPage, { props: { data: baseData({ canWrite: true }) } });
|
|
|
|
await expect
|
|
.element(page.getByRole('link', { name: /neues dokument/i }))
|
|
.toHaveAttribute('href', '/documents/new');
|
|
});
|
|
|
|
it('hides the new-document CTA when canWrite is false', async () => {
|
|
render(DocumentsListPage, { props: { data: baseData({ canWrite: false }) } });
|
|
|
|
await expect
|
|
.element(page.getByRole('link', { name: /neues dokument/i }))
|
|
.not.toBeInTheDocument();
|
|
});
|
|
|
|
it('shows the bulk-edit-all CTA when canWrite is true and totalElements > 0', async () => {
|
|
render(DocumentsListPage, {
|
|
props: { data: baseData({ canWrite: true, totalElements: 12 }) }
|
|
});
|
|
|
|
await expect.element(page.getByRole('button', { name: /alle 12 editieren/i })).toBeVisible();
|
|
});
|
|
|
|
it('hides the bulk-edit-all CTA when totalElements is 0', async () => {
|
|
render(DocumentsListPage, { props: { data: baseData({ canWrite: true }) } });
|
|
|
|
await expect
|
|
.element(page.getByRole('button', { name: /alle .* editieren/i }))
|
|
.not.toBeInTheDocument();
|
|
});
|
|
});
|