palantir/blueprint

Tabable or otherwise keyboard controllable Menu / MenuItem

Open

#3,079 opened on Oct 26, 2018

View on GitHub
 (8 comments) (4 reactions) (0 assignees)TypeScript (20,263 stars) (2,167 forks)batch import
Domain: accessibilityP1Package: coreType: enhancementhelp wanted

Description

Environment

  • Package version(s): 2.3.1 (also in your v3 demo)
  • Browser and OS versions: Safari 12.0, Chrome 69.0

Feature request

Popover-menues should be tabable or keyboard-controllable in any other way other than only by hotkeys for exactly one menu-item.

Current buggy behaviour: Going to the menu demo and trying to tab will open the second last menu item in the second menu. tabbing again will open the submenu of the last menu-item. tabbing another time will focus the last menu-item of the submenu.

Setting tabIndexes on each Popover and Menu Item will enable to either tab through popovers or menu items as soon as a menu is opened.

Examples

You can see the before mentioned example here: http://blueprintjs.com/docs/#core/components/menu

Contributor guide

Tech stack
typescriptreact
Domain
frontendaccessibility
Issue type
feature
DifficultyEstimated implementation difficulty for a new contributor, from 1 for very small changes to 5 for expert-level work.
3
Estimated timeA rough time range for an experienced contributor to investigate, implement, test, and prepare a pull request.
half day
Activity statusHow available the issue appears right now: fresh, active, stale, blocked, or waiting on maintainer input.
stale
ClarityHow clearly the issue explains the expected change, acceptance criteria, and next step.
clear
Prerequisites
React basicsAccessibility fundamentalsKeyboard navigation patterns
Newbie friendlinessA 1-100 score estimating how approachable this issue is for first-time contributors.
65
Research direction
Examine the current implementation of Menu, MenuItem, and Popover components in the Blueprint repository. Review the issue comments for any suggested approaches or existing work. Implement keyboard navigation using ARIA menu patterns (e.g., roving tabindex) and ensure compatibility with browser tab behavior. Test across different browsers to verify fix.