react icon indicating copy to clipboard operation
react copied to clipboard

`useMnemonics` hook should ignore keydown events from `textarea` elements

Open willglas opened this issue 3 years ago • 0 comments

Description

When a textarea element is rendered inside of an ActionMenu.Overlay with some named buttons, random buttons will get focused as the user is typing. This is because the useMnemonics hook ignores keydown events from input elements but not textarea elements here:

https://github.com/primer/react/blob/main/src/hooks/useMnemonics.ts#L40

Steps to reproduce

  1. Render a textarea element inside of a ActionMenu.Overlay
  2. Add some buttons with text
  3. Pick a character that one of your button starts with and type it into the textarea
  4. The button will get focused

Version

35.7.0

Browser

Chrome, Safari, Firefox, Edge, iOS Safari

willglas avatar Sep 07 '22 16:09 willglas