Skip to content

fix(a11y): label evaluator select and notes textarea in invitation dialog - #443

Open
anishkb-dev wants to merge 1 commit into
CivicDataLab:devfrom
anishkb-dev:fix/select-elements-a11y-363
Open

fix(a11y): label evaluator select and notes textarea in invitation dialog#443
anishkb-dev wants to merge 1 commit into
CivicDataLab:devfrom
anishkb-dev:fix/select-elements-a11y-363

Conversation

@anishkb-dev

@anishkb-dev anishkb-dev commented Jul 31, 2026

Copy link
Copy Markdown

The evaluator dropdown and the notes textarea in the auditor invitation dialog are plain <select> and <textarea> elements. Each has a <label> rendered above it, but nothing connects the two, so screen readers announce both controls without a name.

Adds htmlFor to each label and a matching id to each control.

A note on scope: this started out much larger and covered the <Select> components in the New Evaluation wizard too. Those turned out not to need it — opub-ui's Select already calls useId() and passes the same id to both the <label htmlFor> it renders and the native <select>, so those controls are labelled correctly already and passing an explicit id only replaces the generated one. I dropped them rather than add lines that change nothing.

While checking that, I did find two things that look wrong but are separate from this: htmlFor="auditType" and htmlFor="auditScope" in EvaluationConfiguration.tsx point at ids that don't exist anywhere, and the <Label htmlFor="evaluator-technical"> in ModelSelectionModal.tsx is a heading for a radio group but targets the first radio, which gives that one button two labels. Happy to open an issue for those if useful.

@anishkb-dev anishkb-dev changed the title fix(a11y): add accessible labels and id/htmlFor to form select and input elements fix(a11y): label evaluator select and notes textarea in invitation dialog Aug 8, 2026
@anishkb-dev
anishkb-dev force-pushed the fix/select-elements-a11y-363 branch from 60cf94a to db9cc7e Compare August 8, 2026 07:46
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant