adobe / spectrum-web-components

Spectrum Web Components
https://opensource.adobe.com/spectrum-web-components/
Apache License 2.0
1.28k stars 204 forks source link

[Bug]: Picker in iOS Safari occasionally selects item 1-2 slots above clicked item #4697

Open theanAdobe opened 2 months ago

theanAdobe commented 2 months ago

Code of conduct

Impacted component(s)

picker

Expected behavior

When clicking/touching a menu item in the picker, it should always select the item that was clicked/touched.

Actual behavior

When clicking/touching a menu item in the picker, it occasionally selects the item 1 to 2 items above the clicked item.

Screenshots

https://github.com/user-attachments/assets/fcb8f50a-88cd-433e-ad98-f7b431678be9

What browsers are you seeing the problem in?

Safari

How can we reproduce this issue?

  1. Go to https://studio.webcomponents.dev/edit/H4Yrm8QvcXAdQTKd1yTy/src/index.ts?p=stories in an iOS Safari environment. This does not repro for me on MacOS Safari, nor on Chrome's mobile-emulation.
  2. In the storybook frame, click on the "Selection type" Picker to open the Picker Menu. The Menu should be a "Tray" coming up from the bottom, since it is in a mobile environment.
  3. Click one of the menu options. I've had better consistency choosing an item different from the currently selected item (i.e. going from Option 4 to Option 5 and back repeatedly)
  4. See that the Picker is showing Option 2 or 3 instead of the item selected.

Sample code or abstract reproduction which illustrates the problem

The below sandbox has a plain picker with many items, which I have reproed this bug on. The more items seems to make it easier for me to to trigger the issue. When the number of items is 5 or less, I have never been able to trigger the issue.

https://studio.webcomponents.dev/edit/H4Yrm8QvcXAdQTKd1yTy/src/index.ts?p=stories

Severity

SEV 3

Logs taken while reproducing problem

No response

theanAdobe commented 2 months ago

I just recalled that I was not able to repro this with for some prior version of SWC that Adobe Express was using. Might have been SWC 0.44 or earlier? Maybe that might help investigation.