Skip to content

useLayoutEffect of <MenuPlacer /> component should listen for react-select's isLoading prop #5733

@AbeykoonOshan

Description

@AbeykoonOshan

Issue type: Bug

Issue recreation steps as follows,

  1. Click on the dropdown field input. (Then we will get the "Loading" message. This is working as expected)
    image

  2. After the options are loaded into the dropdown, the menu doesn't get displayed above the field as it should. The menu does get rendered below the control.
    The menuPlacement prop "auto" is expected to kick-in in this state.
    image

This is only happens once.

The issue is reproduceable in following code sandbox. (Be sure to click on the dropdown field of the page before the setTimeout timer)
https://codesandbox.io/s/strange-firefly-npzlhd?file=/src/App.js

Suggestion

I'm not sure whether this is feasible or not, but i think that we should perform the menu placement calculation after isLoading state has been set to true since that is an indicator that the options for the dropdown is completely loaded.

Affected react-select version: 5.7

Metadata

Metadata

Assignees

No one assigned

    Labels

    issue/bug-unconfirmedIssues that describe a bug that hasn't been confirmed by a maintainer yet

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions