marcel/familienarchiv
1
0
Fork 0
Code Issues 120 Pull Requests 1 Actions Packages Projects Releases Wiki Activity

test(typeselector): add keyboard navigation tests for ArrowRight/ArrowLeft

Browse Source 
Verifies radioGroupNav action moves selection forward and wraps backward
so keyboard users can navigate the STORY/JOURNEY cards without a mouse.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Marcel
2026-06-08 23:25:34 +02:00
parent 3572de487a
commit a0930b62b0
1 changed files with 23 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
frontend/src/routes/geschichten/new/TypeSelector.svelte.spec.ts
View File

@@ -96,4 +96,27 @@ describe('TypeSelector', () => {
await expect.element(page.getByText(/Bitte wähle einen Typ/i)).toBeVisible(); await expect.element(page.getByText(/Bitte wähle einen Typ/i)).toBeVisible();
}); });
it('ArrowRight moves focus and selection from STORY to JOURNEY', async () => {
render(TypeSelector, { props: { onweiter: vi.fn() } });
const storyCard = page.getByRole('radio', { name: /Geschichte/i });
await storyCard.focus();
await userEvent.keyboard('{ArrowRight}');
const journeyCard = page.getByRole('radio', { name: /Lesereise/i });
await expect.element(journeyCard).toHaveAttribute('aria-checked', 'true');
await expect.element(storyCard).toHaveAttribute('aria-checked', 'false');
});
it('ArrowLeft wraps from STORY back to JOURNEY', async () => {
render(TypeSelector, { props: { onweiter: vi.fn() } });
const storyCard = page.getByRole('radio', { name: /Geschichte/i });
await storyCard.focus();
await userEvent.keyboard('{ArrowLeft}');
const journeyCard = page.getByRole('radio', { name: /Lesereise/i });
await expect.element(journeyCard).toHaveAttribute('aria-checked', 'true');
});
}); });