Skip to content

Conversation

@tracygardner
Copy link
Contributor

Motivation

  • Improve keyboard accessibility by allowing users to press ArrowDown/ArrowUp while focused in the toolbox search input to move focus into the toolbox item list.
  • Ensure that DOM focus and the toolbox selection highlight remain synchronized when navigation moves away from the search input.

Description

  • Add a keydown listener to the search input in createDom_() of node_modules/@blockly/toolbox-search/src/toolbox_search.ts that handles ArrowDown and ArrowUp keys.
  • When an arrow key is pressed the handler calls event.preventDefault(), blurs the search input via getFocusableElement().blur(), computes the adjacent toolbox item using this.parentToolbox_.getToolboxItems() and the current index, and then moves selection and focus to that item by calling this.parentToolbox_.setSelectedItem(nextItem) (if selectable) and Blockly.getFocusManager().focusNode(nextItem).
  • The existing Escape behavior and existing keyup search/match logic are preserved.
  • All changes are contained in toolbox_search.ts and use the focus APIs already exposed by Blockly (getFocusableElement() and getFocusManager().focusNode).

Testing

  • No automated tests were run for this change.

Codex Task

@tracygardner tracygardner deleted the codex/add-keydown-listener-for-navigation branch January 19, 2026 20:03
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants