a11y(persons): add aria-label to PersonTypeSelector radiogroup
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -32,6 +32,7 @@ function select(type: PersonType) {
|
||||
|
||||
<div
|
||||
role="radiogroup"
|
||||
aria-label={m.form_label_person_type()}
|
||||
class="grid grid-cols-2 gap-2 sm:grid-cols-4"
|
||||
use:radioGroupNav={(v) => { if (TYPES.includes(v as PersonType)) select(v as PersonType); }}
|
||||
>
|
||||
|
||||
@@ -7,6 +7,13 @@ import PersonTypeSelector from './PersonTypeSelector.svelte';
|
||||
afterEach(() => cleanup());
|
||||
|
||||
describe('PersonTypeSelector', () => {
|
||||
it('radiogroup has an accessible name via aria-label', () => {
|
||||
const { container } = render(PersonTypeSelector, { value: 'PERSON' });
|
||||
const radiogroup = container.querySelector('[role="radiogroup"]');
|
||||
expect(radiogroup).not.toBeNull();
|
||||
expect(radiogroup!.getAttribute('aria-label')).toBeTruthy();
|
||||
});
|
||||
|
||||
it('hidden input value updates when user navigates with ArrowRight', async () => {
|
||||
const { container } = render(PersonTypeSelector, { value: 'PERSON' });
|
||||
const hiddenInput = container.querySelector('input[type="hidden"]') as HTMLInputElement;
|
||||
|
||||
Reference in New Issue
Block a user