test(document): cover all five DocumentStatusChip status branches
Adds DocumentStatusChip.svelte.test.ts asserting one branch per DocumentStatus value (PLACEHOLDER, UPLOADED, TRANSCRIBED, REVIEWED, ARCHIVED) plus the title/aria-label exposure. Each test queries the element via getByTitle so the component's accessibility surface is verified at the same time as its branch logic. Refs #496. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
50
frontend/src/lib/document/DocumentStatusChip.svelte.test.ts
Normal file
50
frontend/src/lib/document/DocumentStatusChip.svelte.test.ts
Normal file
@@ -0,0 +1,50 @@
|
||||
import { describe, it, expect, afterEach } from 'vitest';
|
||||
import { cleanup, render } from 'vitest-browser-svelte';
|
||||
import { page } from 'vitest/browser';
|
||||
import DocumentStatusChip from './DocumentStatusChip.svelte';
|
||||
|
||||
afterEach(cleanup);
|
||||
|
||||
describe('DocumentStatusChip', () => {
|
||||
it('renders the placeholder label and gray dot for PLACEHOLDER status', async () => {
|
||||
render(DocumentStatusChip, { props: { status: 'PLACEHOLDER' } });
|
||||
|
||||
const dot = await page.getByTitle('Platzhalter').element();
|
||||
expect(dot.classList.contains('bg-gray-400')).toBe(true);
|
||||
});
|
||||
|
||||
it('renders the uploaded label and emerald dot for UPLOADED status', async () => {
|
||||
render(DocumentStatusChip, { props: { status: 'UPLOADED' } });
|
||||
|
||||
const dot = await page.getByTitle('Hochgeladen').element();
|
||||
expect(dot.classList.contains('bg-emerald-500')).toBe(true);
|
||||
});
|
||||
|
||||
it('renders the transcribed label and blue dot for TRANSCRIBED status', async () => {
|
||||
render(DocumentStatusChip, { props: { status: 'TRANSCRIBED' } });
|
||||
|
||||
const dot = await page.getByTitle('Transkribiert').element();
|
||||
expect(dot.classList.contains('bg-blue-400')).toBe(true);
|
||||
});
|
||||
|
||||
it('renders the reviewed label and amber dot for REVIEWED status', async () => {
|
||||
render(DocumentStatusChip, { props: { status: 'REVIEWED' } });
|
||||
|
||||
const dot = await page.getByTitle('Geprüft').element();
|
||||
expect(dot.classList.contains('bg-amber-400')).toBe(true);
|
||||
});
|
||||
|
||||
it('renders the archived label and dark emerald dot for ARCHIVED status', async () => {
|
||||
render(DocumentStatusChip, { props: { status: 'ARCHIVED' } });
|
||||
|
||||
const dot = await page.getByTitle('Archiviert').element();
|
||||
expect(dot.classList.contains('bg-emerald-600')).toBe(true);
|
||||
});
|
||||
|
||||
it('exposes the status as both a title tooltip and an aria-label', async () => {
|
||||
render(DocumentStatusChip, { props: { status: 'UPLOADED' } });
|
||||
|
||||
const dot = await page.getByTitle('Hochgeladen').element();
|
||||
expect(dot.getAttribute('aria-label')).toBe('Hochgeladen');
|
||||
});
|
||||
});
|
||||
Reference in New Issue
Block a user