JedWatson / JedWatson/react-select

Focus gets lost when new options are passed to React Select

Open
#4,432 3 comments 12 reactions 1 assignee View on GitHub

@Methuselah96 is already working on this.

Since Feb 5, 2021.

issue/bug-confirmed
Dominant language
TypeScript
Stars
28k
Forks
4.1k
PR merge metrics
No merged PRs in 30d

Description

First of all: thank you for maintaining a really useful React component!

We have an application using React, Redux and React-Select. The Redux state is transformed (grouped, sorted and mapped) and used as options for a React-Select component. The redux state is occasionally refreshed.

Since version 3.2.0 of React-Select I observe the following issue: The currently focused element gets reset to the first option whenever the data is refreshed in redux.

I have built a minimal example here: https://codesandbox.io/s/magical-yalow-y2mzb
-> open the dropdown and hover the second or third option.

I found two ways to remove the issue in the minimal working example:

  • Downgrade to React Select 3.1.1
  • Remove the .map() call (not feasible in the real world example).

My assumption is that the issue was introduced in #4084.

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.