JedWatson / JedWatson/react-select

menu is wrongly placed at bottom

Open
#4,493 10 comments 6 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

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

Description

Are you reporting a bug or runtime error?

I think it's a bug. menuPosition is default (auto). When there is no enough space for menu, it still appears in the bottom. The reason is: In Menu.js, this getMenuPlacement will calculate a wrong menuHeight. In my situation, the menu will load data asynchrously, so it will display 'Loading' (loading message) in the menu first, then the data after it's loaded. But getMenuPlacement only calculates the height of 'Loading' and decides to put the menu at the bottom.

Expected

should calcuate the menuHeight when the data is loaded and decides the placement again.

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.

Research direction

Start in Menu.js at getMenuPlacement and trace how the menu height is measured while asynchronous options are loading. Reproduce the case where the loading message is replaced by loaded data, then verify that auto placement is recalculated using the loaded menu height and no longer incorrectly moves the menu to the bottom.

Written by the indexing model from the issue text.

Assessment

Tech stack
react, typescript
Domain
frontend
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
45/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.