github / github/auto-complete-element

Add client-side options support

Open
#52 0 comments 1 reaction 0 assignees View on GitHub
Dominant language
JavaScript
Stars
407
Forks
57
Avg merge
1d 7h
Merged PRs (30d)
5

Description

# Problem
If there are static options passed into the element, the options are deleted on request for filtered options.

# Request
Client-side options should be supported and have filtering available. TBD: Do we allow both client-side (such as default options) *and* server-side options?

# Implementation concerns
## Accessibility
Ensure that any default / client-side options are announced when the input is focused. `screen-reader-announcements.ts` can assist with this.

When the options list isn't visible, an `aria-describedby` should be added to the input pointing to the feedback element. This should only be if the element has client-side options. Remove this `aria-describedby` when the user interacts with any key, and add it back in when the auto-complete-element is blurred. cc @github/accessibility and @jscholes for reference. "aria-live won't cut it" for this scenario

## Developer Notes
There is some initial setup done in `autocomplete.ts` to detect client-side options, but all of this can be removed / reworked, as long as accessibility considerations are met.

Contributor guide

Open the contributing guide

Research direction

Start in autocomplete.ts to review the existing client-side option detection, then read screen-reader-announcements.ts for the accessibility behavior. Trace how options are removed during filtered requests and define the supported interaction between client-side and server-side options. Done means client-side options remain available, filtering works, and the described focus, keyboard, blur, and aria-describedby behavior is covered.

Written by the indexing model from the issue text.

Assessment

Tech stack
typescript
Domain
accessibility, frontend, web-dev
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.