Open Radar

 
LIKELY DUPLICATE OF
http://www.openradar.me/28359335


Area:
WebKit

Summary:
In WebKit on iOS10, calling preventDefault() on the touchmove event does not prevent the default scrolling behaviour. This was not the case with previous versions.

This means that javascript drag implementations such as dragula (https://bevacqua.github.io/dragula/) no longer work correctly, because the page continues to scroll as the draggable item is being moved.

I created a minimal test page here:
http://eoghanmcilwaine.github.io/ios-preventdefault-touchmove.html
In this test, the green rectangle can be dragged around the page using older versions of webkit, but not on iOS10 using the following browsers:

Safari:
Mozilla/5.0 (iPad; CPU OS 10_0_1 like Mac OS X) AppleWebKit/602.1.50 (KHTML, like Gecko) Version/10.0 Mobile/14A403 Safari/602.1

Firefox:
Mozilla/5.0 (iPad; CPU OS 10_0_1 like Mac OS X) AppleWebKit/602.1.50 (KHTML, like Gecko) FxiOS/5.2 Mobile/14A403 Safari/602.1.50

Chrome:
Mozilla/5.0 (iPad; CPU OS 10_0_1 like Mac OS X) AppleWebKit/601.1 (KHTML, like Gecko) CriOS/53.0.2785.109 Mobile/14A403 Safari/601.1.46

Steps to Reproduce:
1. Go to the test page http://eoghanmcilwaine.github.io/ios-preventdefault-touchmove.html on an iOS10 device
2. Try to drag the green rectangle
3. Observe the page scrolling, which interferes with the drag operation

Expected Results:
The page should not scroll, because preventDefault is being called on the touchmove event.

Actual Results:
The page tries to scroll at the same time as the rectangle is being dragged.

Version:
iOS 10.0.1 [14A403]

Notes:


Configuration:
iPad Air 16GB [MD788NF/A]