Controlled Comobox shows only one option after selecting

[rodrigo-arias]

What package within Headless UI are you using?

@headlessui/react

What version of that package are you using?

v1.7.4

Reproduction URL

https://codesandbox.io/s/headless-ui-comobox-issue-gulbsz?file=/src/index.js

Describe your issue

Since version 1.7.4 the Comobox component shows only the option already selected from the Combobox Button. You can see the difference by switching to version 1.7.3.

I'd expect that as in the previous version, all available options will be shown to the user.

[matijs]

It seems this was introduced in #1916

This breaks the Combobox completely for us. We're using a debounced fetch to populate the Combobox. Selecting an item results in an extra fetch with the result of the displayValue.

Not only is this extra fetch unwanted (and unnecessary) but the selected value is also lost and using the displayValue as a search term may not yield any results.

[AnnaYuS]

There are problems with headlessui/vue as well since around version 1.7.4. We're using a function for displayValue, but it is not triggered when selected option changes from undefined to an option from the list. Used to work with v.1.6.7, so we do not upgrade for now

[RobinMalfait]

Hey! Thank you for your bug report!
Much appreciated! 🙏

This should be fixed by #2042, and will be available in the next release.

You can already try it using:

• npm install @headlessui/react@insiders.
• npm install @headlessui/vue@insiders.

I've also updated your CodeSandbox URL with the latest insiders version: https://codesandbox.io/s/headless-ui-comobox-issue-forked-3iiimq?file=/package.json

[rodrigo-arias]

@RobinMalfait thank you 🙏

[matijs]

Thanks @RobinMalfait the insiders version works like before 👍 looking forward to the release :)