fix(stammbaum): state-aware aria-label on family-member toggle — WCAG accessible name

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Marcel
2026-04-28 18:21:55 +02:00
committed by marcel
parent 000333d540
commit 10b1bab57b
5 changed files with 23 additions and 0 deletions

View File

@@ -76,6 +76,9 @@ function yearRange(rel: RelationshipDTO): string {
type="submit"
role="switch"
aria-checked={familyMember}
aria-label={familyMember
? m.relation_toggle_remove_from_tree()
: m.relation_toggle_add_to_tree()}
class="inline-flex items-center gap-2 font-sans text-xs font-medium text-ink-2 transition-colors hover:text-ink"
>
<span

View File

@@ -37,4 +37,18 @@ describe('StammbaumCard', () => {
render(StammbaumCard, { ...baseProps, relationshipError: 'Test Fehler' });
await expect.element(page.getByText('Test Fehler')).toBeInTheDocument();
});
it('toggle aria-label says "Zum Stammbaum hinzufügen" when not yet a family member', async () => {
render(StammbaumCard, { ...baseProps, canWrite: true, familyMember: false });
await expect
.element(page.getByRole('switch', { name: 'Zum Stammbaum hinzufügen' }))
.toBeInTheDocument();
});
it('toggle aria-label says "Aus Stammbaum entfernen" when already a family member', async () => {
render(StammbaumCard, { ...baseProps, canWrite: true, familyMember: true });
await expect
.element(page.getByRole('switch', { name: 'Aus Stammbaum entfernen' }))
.toBeInTheDocument();
});
});