Inconsistent behavior with closeMenuOnSelect property when using Async

Are you asking a question?

No, I have make a question on Stack Overflow, but now i think it is an issue. https://stackoverflow.com/questions/52243760/retain-input-value-on-option-selected-in-react-select

Are you reporting a bug or runtime error?

Yes, I have created a demo for demonstrating this issue: https://codesandbox.io/s/345rp0m041

Reproduce steps:

1. type “a” and select one value Expected behavior: since the input value isn’t changed, the user should be able to select another option. Real behavior: the menu list show no option.

2. Enable this line to see it work as expected: //import Select from "react-select";

So, I think we might have a inconsistent behavior between select and async component.

[rheydt]

Seeing the same thing. Unclear whether closeMenuOnSelect is intended to work with Async, but it does seem useful. Perhaps even more useful for Async when isMulti is used.

Use case: A user types into the input, sees 2 options they want to select, selects one of them… and then the input clears, and they have to type the same search term again to be able to select the second option.

Regardless of whether the dropdown stays open after select, it’s not useful unless you have the ability to persist options after selection (perhaps have an option not to clear the input value until the component is blurred?)

[kieranbenton]

Whilst I’m probably going to use the workaround you’ve described @ebonow, I’m not sure I’d consider this ‘closed’ as closeMenuOnSelect is effectively ignored for AsyncSelect.

To me at least, closeMenuOnSelect should either be removed from the async version or this should be fixed internally (preferably) to give the same DX as the non-async version.