Swipe with the mouse doesn't work on Safari / MacOS

mattlovett commented 5 years ago

[x] 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

oliviertassinari commented 5 years ago

Wrong repo, it works with https://react-swipeable-views.com/demos/demos/, please move the issue to Material-UI.

mattlovett commented 5 years ago

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

mattlovett commented 5 years ago

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!

oliviertassinari commented 5 years ago

We might want to support it outside of the box. I reopen.

thany commented 1 year ago

4 years later, I think that ain't gonna happen 😀 Just ran into this as well, except I did with Firefox.

oliviertassinari / react-swipeable-views