Skip to content

Select searchable: search input text is focussed twice when using keyboard  #6901

@Simondin

Description

@Simondin

Using the Select component with multiple and onSearch props defined the search input text box is focussed twice using the keyboard.

Expected Behavior

When I open the Select component (with multiple and onSearch props defined) and use the KeyDown to reach the first option I expect the first option stay focussed.

Actual Behavior

When I open the Select component and try to reach the first option using the keyboard the focus moves from input text field to first option and the get back to the input text without doing nothing. If I use again the keyboard the issue doesn't occur again.

URL, screen shot, or Codepen exhibiting the issue

Select story book:
https://storybook.grommet.io/?path=/story/input-select-search--search
(Input->Select->Search)

Steps to Reproduce

  1. Open the documentation link
  2. Click on the second Select (select multiple options)
  3. Use the KeyDown to reach the first option
  4. The focus will pass from search text input to the first option and it will get back to the text input.

Your Environment

  • Grommet version: 2.33.1
  • Browser Name and version: Chrome 114
  • Operating System and version (desktop or mobile): Windows 11

Metadata

Metadata

Assignees

No one assigned

    Labels

    accessibilityWCAG supportbugissue that does not match design or documentation and requires code changes to address

    Type

    No type

    Projects

    Status

    Done

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions