Skip to content

fix(modal) :: give modal component an accessible name - #1367

Draft
81reap wants to merge 2 commits into
sqlpage:mainfrom
81reap:stack/2-modal-name
Draft

fix(modal) :: give modal component an accessible name#1367
81reap wants to merge 2 commits into
sqlpage:mainfrom
81reap:stack/2-modal-name

Conversation

@81reap

@81reap 81reap commented Aug 8, 2026

Copy link
Copy Markdown

Motivation

  • The modal sets aria-labelledby to its title text rather than to the id of an element, so screen readers announce a dialog with no name.
  • The browser test that should have caught this passes label to getByRole, which Playwright does not accept, so it matched any dialog on the page.

Description

  • Give the modal title an id of {{id}}-title, and point aria-labelledby at it.
  • Use name instead of label in the two getByRole calls of the modal test.
  • Add a changelog entry.

Testing

  • The browser suite passes 21 tests, the modal one now looking the dialog up by its accessible name.
  • no console errors on card page fails for the reason described in fix(biome.js) :: fix remaining lint issues #1366, on this branch and on the unmodified base alike.
  • npm test checks 36 files and reports nothing.

GitHub cannot base a pull request on a branch that lives in a fork, so all eight target main and each one carries the commits of those above it. Review and merge them in order:

  1. fix(biome.js) :: fix remaining lint issues #1366 :: fix(biome.js) :: fix remaining lint issues
  2. fix(modal) :: give modal component an accessible name #1367 :: fix(modal) :: give modal component an accessible name ← this PR
  3. fix(map) :: ignore map coordinates that are not a pair of numbers #1368 :: fix(map) :: ignore map coordinates that are not a pair of numbers
  4. feat(chart) :: render column charts as bar charts #1369 :: feat(chart) :: render column charts as bar charts
  5. fix(chart) :: align stacked series on their X values #1370 :: fix(chart) :: align stacked series on their X values
  6. fix(chart) :: line series up on a category axis for every chart type #1371 :: fix(chart) :: line series up on a category axis for every chart type
  7. fix(npm) :: install dependencies only once at root level #1372 :: fix(npm) :: install dependencies only once at root level
  8. feat(typescript) :: typecheck browser JavaScript in CI #1373 :: feat(typescript) :: typecheck browser JavaScript in CI

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