feat(dashboard): add UploadSuccessBanner component
Transient post-upload banner for issue #296: singular/plural German copy, aria-live=polite for screen readers, manual X dismiss, 8s auto-dismiss. "Jetzt ergänzen →" CTA links directly to /enrich so seniors can continue straight into the enrichment flow after a batch upload. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -0,0 +1,57 @@
|
||||
import { describe, it, expect, afterEach, vi } from 'vitest';
|
||||
import { cleanup, render } from 'vitest-browser-svelte';
|
||||
import { page } from 'vitest/browser';
|
||||
|
||||
import UploadSuccessBanner from './UploadSuccessBanner.svelte';
|
||||
|
||||
afterEach(() => {
|
||||
cleanup();
|
||||
vi.useRealTimers();
|
||||
});
|
||||
|
||||
describe('UploadSuccessBanner', () => {
|
||||
it('renders singular copy for count of 1', async () => {
|
||||
render(UploadSuccessBanner, { count: 1, onClose: () => {} });
|
||||
const status = page.getByRole('status');
|
||||
await expect.element(status).toBeInTheDocument();
|
||||
await expect.element(status).toHaveTextContent(/1 Dokument/);
|
||||
});
|
||||
|
||||
it('renders plural copy for count greater than 1', async () => {
|
||||
render(UploadSuccessBanner, { count: 3, onClose: () => {} });
|
||||
await expect.element(page.getByRole('status')).toHaveTextContent(/3 Dokumente/);
|
||||
});
|
||||
|
||||
it('exposes role=status with aria-live polite', async () => {
|
||||
render(UploadSuccessBanner, { count: 1, onClose: () => {} });
|
||||
await expect.element(page.getByRole('status')).toHaveAttribute('aria-live', 'polite');
|
||||
});
|
||||
|
||||
it('renders a CTA link to /enrich', async () => {
|
||||
render(UploadSuccessBanner, { count: 2, onClose: () => {} });
|
||||
await expect
|
||||
.element(page.getByRole('link', { name: /ergänzen/i }))
|
||||
.toHaveAttribute('href', '/enrich');
|
||||
});
|
||||
|
||||
it('invokes onClose when the close button is clicked', async () => {
|
||||
const onClose = vi.fn();
|
||||
render(UploadSuccessBanner, { count: 1, onClose });
|
||||
const button = document.querySelector(
|
||||
'[data-testid="upload-banner-close"]'
|
||||
) as HTMLButtonElement | null;
|
||||
expect(button).not.toBeNull();
|
||||
button?.click();
|
||||
expect(onClose).toHaveBeenCalledTimes(1);
|
||||
});
|
||||
|
||||
it('auto-dismisses after 8000ms', async () => {
|
||||
vi.useFakeTimers();
|
||||
const onClose = vi.fn();
|
||||
render(UploadSuccessBanner, { count: 1, onClose });
|
||||
vi.advanceTimersByTime(7999);
|
||||
expect(onClose).not.toHaveBeenCalled();
|
||||
vi.advanceTimersByTime(2);
|
||||
expect(onClose).toHaveBeenCalledTimes(1);
|
||||
});
|
||||
});
|
||||
Reference in New Issue
Block a user