Page MenuHomePhabricator

ButtonGroup: Consider arrow key behavior for button groups
Open, LowestPublic

Description

During code review, @egardner raised the question of whether the left/right arrow keys should move focus to the previous/next button. Radio buttons already do this (both on left/right arrow and up/down arrow), but that seems to be native behavior in the browser, not anything we did.

While arrow navigation within a button group doesn't inherently violate any specific WCAG success criteria. The lack of such navigation could potentially impact accessibility and usability of your interface for users who rely on keyboard navigation. Therefore, providing arrow navigation within a button group can contribute to enhancing the overall accessibility of the ButtonGroup for keyboard users.

  • Should pressing the left/right arrow key when a button in a ButtonGroup is selected move the focus to the previous/next button?
    • AFB: Yes, pressing the left/right arrow keys when a button in a ButtonGroup is selected should move the focus to the previous/next button respectively. This behavior aligns with standard keyboard navigation conventions and improves the overall accessibility and usability of the ButtonGroup component.
  • Should the up/down arrow keys do the same?
    • AFB: Yes, similar to the left/right arrow keys, pressing the up/down arrow keys should also move the focus to the previous/next button within the ButtonGroup. Consistent navigation behavior across different arrow keys enhances predictability and usability for keyboard users.
  • Should pressing the arrow keys in a single-select ToggleButtonGroup move just the focus to the prev/next button, or also select that button? What if the ToggleButtonGroup is a multi-select group?
    • AFB: In a single-select ToggleButtonGroup, pressing the arrow keys should move the focus to the previous/next button without changing the selection. This behavior ensures that users can navigate through the options without inadvertently changing their selection. This behavior should be the same for multi-select groups.

Event Timeline

ldelench_wmf renamed this task from Consider arrow key behavior for button groups to [ButtonGroup] Consider arrow key behavior for button groups.Dec 21 2022, 8:06 PM
Volker_E renamed this task from [ButtonGroup] Consider arrow key behavior for button groups to ButtonGroup: Consider arrow key behavior for button groups.May 23 2023, 5:34 PM