React-beautiful-dnd: ios 11.3 not supported

Created on 31 Mar 2018  Â·  7Comments  Â·  Source: atlassian/react-beautiful-dnd

Bug or feature request?

Bug

Expected behavior

Drag and drop works beautifully as usual.

Actual behavior

With the upgrade to ios 11.3, drag and drop is not beautiful. When attempting to select and drag, the page now scrolls making it almost impossible to move an item.

Steps to reproduce

Upgrade to ios 11.3 and attempt to drag and drop.

Browser version

Tried Chrome 65.0.3325.152 and whatever Safari version ios 11.3 ships with (Safari 11).

Demo

Tested on our app and alsoreact-beautiful-dnd mobile examples provided (show in video below):

react_beautiful_dnd_ios_11 3

Thanks for your work on this excellent library!

Most helpful comment

I am really angry about safari doing this. I have wasted a lot of time this holiday weekend thinking about the problem. I am continuing my investigations tomorrow

All 7 comments

Great. Looks like WebKit has changed some behaviour. I will look into this
on Tuesday 🙃
On Sat, 31 Mar 2018 at 5:09 pm, Chris Watland notifications@github.com
wrote:

Bug or feature request?

Bug
Expected behavior

Drag and drop works beautifully as usual.
Actual behavior

With the upgrade to ios 11.3, drag and drop is not beautiful. When
attempting to select and drag, the page now scrolls making it almost
impossible to move an item.
Steps to reproduce

Upgrade to ios 11.3 and attempt to drag and drop.
Browser version

Tried Chrome 65.0.3325.152 and whatever ios 11.3 ships with (Safari 11).
Demo

Tested on our app and alsoreact-beautiful-dnd mobile examples provided
(show in video below):

[image: react_beautiful_dnd_ios_11 3]
https://user-images.githubusercontent.com/6117504/38159816-5cd1c7d4-3476-11e8-8c20-2f6a1449a9d7.gif

Thanks for your work on this excellent library!

—
You are receiving this because you are subscribed to this thread.
Reply to this email directly, view it on GitHub
https://github.com/atlassian/react-beautiful-dnd/issues/413, or mute
the thread
https://github.com/notifications/unsubscribe-auth/ACFN7f9eKpU3H51yv3r9vzHFrY8qJRW1ks5tjxONgaJpZM4TCVvE
.

I took a good crack at this tonight. It looks like safari has jumped to passive events by default - but not in the same way that chrome did a while back. This has been super painful to go through. I have a few ideas on how to work around it but it will take some time

I will continue my search on tuesday

I am really angry about safari doing this. I have wasted a lot of time this holiday weekend thinking about the problem. I am continuing my investigations tomorrow

Observation so far:

Sometimes event handlers add their own event handlers in response to an event. For example, we add a touchmove handler to the window after a touchstart. These dynamically added event handlers are unable to call event.preventDefault() even if they are non-passive event handlers in Safari 11.3. They still get the event, but the events are non-cancelable. A stand alone solution is providing difficult. I think there might be a micro-task timing issue going on

Eagerly watching this issue in order to fix my own implementation.

I have created a bug report with webkit (Please assist if you can)

I am also working on a fix (a huge hack) to get things working again on iOS 11.3 in the short term

Was this page helpful?
0 / 5 - 0 ratings

Related issues

alexreardon picture alexreardon  Â·  3Comments

jasonlewicki picture jasonlewicki  Â·  3Comments

alexreardon picture alexreardon  Â·  3Comments

heymartinadams picture heymartinadams  Â·  3Comments

screenmeet picture screenmeet  Â·  3Comments