Swipe with the mouse doesn't work on Safari / MacOS
Opened this issue · 5 comments
- I have searched the issues of this repository and believe that this is not a duplicate.
Expected Behavior
On Chrome, dragging the images with the mouse allows me to swipe from one view to another. On Safari this doesn't work...
Current Behavior
When you drag the image with Safari, it seems like the initial click and drag starts to drag-and-drop the image. Then, once I release the mouse button, the scrollable view starts to follow the mouse pointer - you can waggle the view back and forth. Finally when you move the pointer out of the swipeable view then it settles down.
Steps to Reproduce (for bugs)
The issue is visible on the material-ui demo page that uses react-swipeable-views:
https://material-ui.com/components/steppers/#mobile-stepper-text-with-carousel-effect
- Open the link in Safari
- Use a mouse to swipe the image
Context
Your Environment
| Tech | Version |
|---|---|
| react-swipeable-views | 0.130.3 |
| Safari | 12.1.1 |
| MacOS | 10.14.5 |
Wrong repo, it works with https://react-swipeable-views.com/demos/demos/, please move the issue to Material-UI.
Sorry Oliver, but I think it is an issue we can recreate with your demo page. The key part is putting an image into the view. I've edited your demo to include an image (thanks google) and I can see the issue:
https://codesandbox.io/s/material-demo-3s660
However... the img bit did lead me to a solution. setting draggable=false onto the img means Safari doesn't start the drag-and-drop, and then the swipe works. Sorry for the noise, but hopefully this will help someone else!
We might want to support it outside of the box. I reopen.
4 years later, I think that ain't gonna happen 😀 Just ran into this as well, except I did with Firefox.