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
fix(components): fix iOS select click event listening #16393
base: dev
Are you sure you want to change the base?
fix(components): fix iOS select click event listening #16393
Conversation
iOS Safari does not handle click events when a mouseenter event is registered and a DOM-change happens in a child. We use a Vue custom event binding to only register the event on non-iOS devices. The inputHovering state gets updated now on iOS-devices on click. This is needed as the mouseenter event normally does this. closed element-plus#5210
👋 @raphaelbernhart, seems like this is your first time contribution to element-plus.
|
Hello @raphaelbernhart, thank you for contributing to element-plus, please see our guideline to see how to make contribution |
🧪 Playground Preview: https://element-plus.run/?pr=16393 |
@kooriookami @tolking Do you have relevant device verification? |
No, I have no IOS device. |
Problem / fix
iOS Safari does not handle click events when a mouseenter event is registered and a DOM-change happens in a child.
We use a Vue custom event binding to only register the event on non-iOS devices.
The inputHovering state gets updated now on iOS-devices on click. This is needed as the mouseenter event normally does this.
Apple Developer Documentation: https://developer.apple.com/library/archive/documentation/AppleApplications/Reference/SafariWebContent/HandlingEvents/HandlingEvents.html
Vue Issue: vuejs/vue#9859
Here are some test-case recordings
Before changes
Screen.Recording.2024-04-04.at.11.07.08.mov
After changes
Screen.Recording.2024-04-04.at.11.09.15.mov
closed #5210