Thanks to visit codestin.com
Credit goes to github.com

Skip to content

USWDS-Site - Bug: ComboBox #5161

@fpigeonjr

Description

@fpigeonjr

Describe the bug

Finding an Option from the Combobox List

  • Keyboard users (especially those using AT) expect to be able to type the same character to navigate through all options starting with the same letter (example: type “S” multiple times to move through “South Carolina” followed by “South Dakota”, etc.)
Finding_option_error.mp4

Selecting a Combobox Option

  • Combobox allows users to confirm a selection using either the ENTER key (which is good) or the TAB key (which is unexpected behavior).
  • Additionally, the SPACE key (often used to confirm selections) only scrolls down the Combobox list.
Space_input_error.mp4
Tab_Selection_Error2.mp4

Steps to reproduce the bug

Finding an Option from the Combobox List

  1. Turn on screen reader
  2. Keyboard navigation to the Combobox input
  3. Type a alphabetical letter to get to an item i.e. S for South Carolina
  4. Repeat typing the same letter
  5. FAIL

Selecting a Combobox Option via spacebar

  1. Turn on screen reader
  2. Keyboard navigation to the Combobox input
  3. Use arrow keys to navigate to an item
  4. Type spacebar to select the item
  5. FAIL

Selecting a Combobox Option via tab

  1. Turn on screen reader
  2. Keyboard navigation to the Combobox input
  3. Use arrow keys to navigate to an item
  4. Type tab to move focus from the field
  5. FAIL

Expected Behavior

Finding an Option from the Combobox List

Users working with AT expected to be able to type the same character to navigate through all options starting with the same letter (example: type “S” multiple times to move through “South Carolina” followed by “South Dakota”, etc.)

Selecting a Combobox Option or tab

  • Combobox allows users to confirm a selection using either the ENTER key (which is good) or the TAB key (which is unexpected behavior).
  • Additionally, the SPACE key (often used to confirm selections) only scrolls down the Combobox list.

Screenshots

No response

System setup

OS: MacOS: 12.6 Monterey
Browser: Safari 16.1 (17614.2.9.1.13, 17614)
Voiceover and keyboard

Additional context

On videos above, the green text indicates the keyboard inputs.
cc: @jonadecker @steveja11y

Code of Conduct

Metadata

Metadata

Assignees

Type

No type

Projects

Status

Done

Milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions