Selected item is not updated in mobile devices

[RohitHF]

• downshift version: 7.6.0
• node version: v18.17.1
• npm (or yarn) version:3.5.1

Relevant code or config
https://www.downshift-js.com/use-select/#basic-multiple-selection

What you did:
Tested the example in iPhone ios v16+
What happened:
The selection is not updated on clicking outside to close the dropdown select. It works fine if we toggle without clicking outside

Reproduction repository:

Problem description:
The mobile devices do not get the correct selected items on clicking outside. Attached video

Suggested solution:
If we can disable the closing of select dropdown on clicking outside, we can use this in touch devices.

Dropdown.with.multiselect.bug.in.native.device.MP4

[silviuaavram]

You can also disable selection on button blur. It's unfortunate that it has to be done in order to avoid this behaviour on mobile.

[silviuaavram]

This will require a change and a fix on our side as well. Will update once they are done.

[RohitHF]

Thanks for the update @silviuaavram . Is there any ETA on this?

[silviuaavram]

@RohitHF Could you give me again a few more details related to repro steps, actual behaviour and expected behaviour?

After looking at the docs example, it seems to me that the mobile behaviour is the same as the desktop one.

[silviuaavram]

Actually, I think the behaviour is consistent. If you have a highlighted item and you blur, it will get selected on both mobile and web. The actual problem is the different behaviour between select and combobox. I have opened an issue on ARIA, we will update our hooks as they suggest.

w3c/aria-practices#2966