Automattic / Automattic/jetpack

Instant Search: aria-live accessibility improvements

Open
#13,817 3 comments 3 reactions 0 assignees View on GitHub
[Feature] Search [Focus] Accessibility [Pri] Low Enhancement
Dominant language
PHP
Stars
1.8k
Forks
898
Avg merge
1d 18h
Merged PRs (30d)
774

Description

This is an issue to track accessibility improvements we'd like to make to the Jetpack Instant Search prototype:

- [x] add `aria-live` to search results (https://github.com/Automattic/jetpack/issues/13644)
- [x] add a label to the search box (even if hidden from most users) (https://github.com/Automattic/jetpack/pull/13875)
- [x] add a button to the search (even if hidden from most users) (https://github.com/Automattic/jetpack/pull/13875)
- [x] add a `` tag with `role="search"`
- [ ] [`aria-live` + VoiceOver + Safari](https://github.com/Automattic/jetpack/pull/13884#issuecomment-549970221): results announcement is interrupted by the announcement of text field content
- [ ] [`aria-live` + NVDA + Firefox](https://github.com/Automattic/jetpack/pull/13884#issuecomment-549978656): No announcements made for search results
- [ ] [`aria-live` + NVDA + Chrome](https://github.com/Automattic/jetpack/pull/13884#issuecomment-549978656): announces from the start of some article at the end of the results and then goes to the previous article. Does not announce `n results for y`.

Contributor guide

Open the contributing guide

Research direction

Start with the unchecked VoiceOver/Safari and NVDA/Firefox/Chrome cases described in this issue and inspect the Instant Search prototype and the referenced pull request discussion. Reproduce each browser and screen-reader combination, then verify that search-result announcements are not interrupted, are emitted consistently, and include the result count and query.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript, react, wordpress
Domain
accessibility, frontend, web-dev
Issue type
Feature
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
30/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.