on mobile phone, using options.delay,sortable is no work.

[coloz]

Problem:

on mobile phone, after using options.delay, sortable is no work.
I have tested 1.9.0 and the latest git version.

[owen-m1]

@coloz What device are you using to test?

[coloz]

Samsung S9(android 9.0) and Huawei X7(android 8.0)

Tested results show that pointermove has an impact.

_on(ownerDocument, 'mouseup', _this._disableDelayedDrag);
_on(ownerDocument, 'touchend', _this._disableDelayedDrag);
_on(ownerDocument, 'touchcancel', _this._disableDelayedDrag);
_on(ownerDocument, 'mousemove', _this._delayedDragTouchMoveHandler);
_on(ownerDocument, 'touchmove', _this._delayedDragTouchMoveHandler);
//options.supportPointer && _on(ownerDocument, 'pointermove', _this._delayedDragTouchMoveHandler);

After I set options.supportPointer as flase, Sortable is all right.

but,the option is not shown in readme

[clemishow]

I got a similar issue.
This problem (#1469) is not completely solved. It works better but I still have problems sometimes.
I using the 1.9.0 version on Android
"Mozilla/5.0 (Linux; Android 9; SM-G960F Build/PPR1.180610.011; wv) AppleWebKit/537.36 (KHTML, like Gecko) Version/4.0 Chrome/74.0.3729.157 Mobile Safari/537.36"

My config :

forceFallback: true,
fallbackOnBody: true,
animation: 150,
delay: 400,
filter: '.static',
preventOnFilter: false,
ghostClass: 'ghost',
fallbackClass: 'chosen',
chosenClass: 'chosen',
scrollSpeed: 20,

[clemishow]

I really need to have this bug fixed! Anyone have any leads? :)

[NavidZ]

@clemishow can you post the html code (ideally minimal reproduction) that makes this issue happen? I don't think this library is using pointerevents correctly.

[clemishow]

If I use: supportPointer: false, it works perfectly!

[owen-m1]

@NavidZ I know it is caused by Sortable.js#L633, when it is commented out it works fine. I tested on Chrome for Android and it is firing a pointermove event when the touch is started. If I comment it out and listen only for touchmove, there is no touchmove event fired.

[NavidZ]

That is expected. I mean getting the pointermove with no touchmove event might happen. There is a region for touch events called slop region. Pointerevents don't have such a thing. So if you listen to all these events "touchstart", "touchmove", "pointerdown", and "pointermove" you would get the following events if user just touches a point and right away starts moving the finger slowly say by 100 px:

pointerdown
touchstart
pointermove [A few of these]
pointermove <- This is when the pointer coordinate has passed the slop region.
touchmove

Note that the slop region size is not defined anywhere in the specification and is browser specific. In Chromium on Android it is circle with radius of ~15px or so. When the pointer moves beyond the slop region it might trigger some browser behavior such as scrolling if the proper touch-action is not set (or some other conditions) and in that case you would get a pointercancel and would not get any more pointerevents for that stream.

[owen-m1]

@NavidZ Thanks for clarifying that. Sortable has it's own "slop" detection using the touchStartThreshold, so I found out that it is actually caused by the fact that Chrome Android now has native Drag & Drop, and this caused Sortable to modify the touchStartThreshold. I fixed it in the commit above.

@clemishow @coloz Please let me know if the issue is fixed on your end if you build the latest master branch.

[clemishow]

@owen-m1 I'm using Angular 5 so I had to use the old plugin angular-sortablejs. I can't update to the latest version... @coloz can you help ?

[coloz]

@owen-m1 The issue still exists.

[owen-m1]

@coloz You ran npm run build?

[coloz]

@owen-m1 The latest version has fixed the issue

[owen-m1]

Great. It's also worth mentioning here that IOS has native drag and drop as well in Safari, so that should be fixed in e5b2396.