Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Bug]: (iOS) sp-card (supplied with an actions slot) action menu opens tray and on menu item selection in tray, if other card is behind it registers click on it as well. #4461

Open
1 task done
jaya-Adobe opened this issue May 15, 2024 · 2 comments
Assignees

Comments

@jaya-Adobe
Copy link

Code of conduct

  • I agree to follow this project's code of conduct.

Impacted component(s)

Firefly

Expected behavior

on Selecting menu item in tray, it should not pass events to the component behind it.

Actual behavior

It passes the click event to sp-card behind it. It happens in iOS (iPhone 11 Pro) , all browser.

Screenshots

video3.mp4

What browsers are you seeing the problem in?

Chrome

How can we reproduce this issue?

  1. Go to https://studio.webcomponents.dev/edit/GnkodO5cuznEsnNm8DyF/src/index.ts?p=stories on iOS (iPhone 11)
  2. Open action menu, such that behind a menu item in tray, there must be another sp-card
  3. Check console logs. It prints card clicked , {index} (0-based) when that card click event is triggered.
  4. As can be seen in recording,

Card clicked 0 - which means action menu of index 0 card is clicked

Select a menu item in tray, such that card-3 is behind it . On click - it logs : Card clicked 3 , which means click was registered for card 3 as well.

Note : the issue reproduces on some Android as well, but the frequency is a bit low. But easily repro in iOS

video3.mp4

Sample code that illustrates the problem

Story book - https://studio.webcomponents.dev/edit/GnkodO5cuznEsnNm8DyF/src/index.ts?p=stories

Logs taken while reproducing problem

No response

@jaya-Adobe jaya-Adobe added bug Something isn't working triage An issue needing triage labels May 15, 2024
@Rajdeepc
Copy link
Contributor

This issue is being tracked here #4227

@godanny86
Copy link
Contributor

godanny86 commented May 21, 2024

hi @Rajdeepc in case this is helpful, our team has also created this sandbox that reliably reproduces the issue:

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

In iOS 17.4 Safari the bug seems to be less frequent, but will eventually happen:

https://github.com/adobe/spectrum-web-components/assets/8974514/62d05d8e-961f-41ac-840a-1294bb264589
You can also see that there is a double change event happening as reported in: #4459

In iOS 17.4 using the Chrome browser the bug seems much more frequent and happens on most clicks:

iosChromeClickthrough.mp4

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

5 participants