markusenglund / react-switch

A draggable toggle-switch component for React. Check out the demo at:
https://react-switch.netlify.com/
MIT License
1.33k stars 101 forks source link

Broken on latest Chrome 96.0 on macOS #101

Closed derwaldgeist closed 2 years ago

derwaldgeist commented 2 years ago

I'm unsure if this is the same problem as #75, so I am reporting this separately.

With the recent Chrome version 96.0 on macOS, the switch functionality is more or less broken. I can enable a switch, and sometimes, I can also disable it again. But at least after a couple of user interactions (clicks), the switch starts to follow the mouse cursor instead of reacting on clicks. And even worse: if you have multiple switches on a page and click on another one, this starts following the mouse as well. So basically, you can make all switches move with the mouse pointer, which is a pretty strange UX.

It does not happen on iOS or Firefox. On Android, it kinda works, but sometimes the animations are missing.

(I did not change my code for quite some time, and also did upgrade to a newer React version. So I guess it's an incompatibility introduced by Chrome.)

My environment: Chrome 96.0 under macOS Monterey. Using react-switch@^6.0.0

derwaldgeist commented 2 years ago

I created a quick YouTube video video to illustrate the problem.

In this video, each switch is clicked once. Afterwards, it follows the mouse pointer, along with the previous switches.

markusenglund commented 2 years ago

Hi, thanks for the report. Do you get the same problem on the demo page? If not, could you please fork this sandbox?

Unfortunately I don't have easy access to a MacOS device. I briefly tested the demo page on chrome 96 on macos via browserstack and couldn't reproduce the issue.

derwaldgeist commented 2 years ago

Closing this. It seems to have been a temporary hick-up of Chrome which vanished after restarting my Mac.