vuetifyjs / vuetifyjs/vuetify

[Feature Request] Vuetify Autocompletes not Working Properly with IOS Voice Over

Open
#11,894 0 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

a11y C: VAutocomplete
Dominant language
TypeScript
Stars
41k
Forks
7.1k
Avg merge
1d 21h
Merged PRs (30d)
11

Description

Problem to solve

The autocompletes in vuetify do not work as intended with W3 aria standards (https://www.w3.org/TR/wai-aria-practices-1.2/examples/combobox/combobox-autocomplete-list.html) on iOS Voice Over. The screen reader recognizes the autocomplete, but when you swipe right to enter the dropdown options it skips to the next element instead. Upon further inspection the dropdowns are rendered at the bottom of the DOM and you have to navigate all the way to the bottom before it jumps you back up. Most visually impaired people are iOS users so this would help make the vuetify library more accessible.

Proposed solution

Render the component so that after triggering the autocomplete dropdown, the next swipe takes you inside the options as expected.

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start by reproducing the autocomplete behavior with iOS VoiceOver and compare it with the referenced WAI-ARIA combobox example. Inspect how the dropdown options are rendered in the DOM; done means the next swipe after opening enters the options instead of moving to the next element, while preserving expected autocomplete behavior.

Written by the indexing model from the issue text.

Assessment

Tech stack
typescript
Domain
accessibility, frontend
Issue type
Feature
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.