We're seeing an issue with the Angular Scheduler drag create and drag move on a touch device (such as a real iPad and Chrome in iPad simulation mode): it scrolls at the same time as the drag is occurring. Errors in the console when using Chrome: "[Intervention] Unable to preventDefault inside passive event listener due to target being treated as passive."
This issue is reproduceable with the Angular Basic demo with scheduler version 4.3.1. (The regular Basic demo works correctly on touch devices).
Thank you for investigating. In your iPad video, since your timeline is already at the beginning, dragging from left-to-right is not expected to scroll. Try advancing the timeline to the future and then drag to create a new event by swiping left-to-right again. Or, with the timeline at the beginning, dragging right-to-left to create a new event will also cause the issue (assuming your timeline is not completely visible). I've attached a video of Safari on a real iPad (iOS 14.8.1) demonstrating the issue; it is in portrait mode so that not all dates in the timeline are visible on the screen at once. The same issue occurs with the latest version of the Chrome app for iPad.
I was able to address the issue by modifying the Bryntum code (which obviously I would never use other than for debugging) in EventHelper.js and adding passive: false to the touchmove event handler:
Unfortunately, this doesn't fix the issue for me. It appears that the touch-action:none style doesn't take effect immediately on the iPad, so the touch scroll is still allowed if you begin dragging too soon. Testing seems to reveal it takes roughly 500-1000ms for the new style to apply.
I've also discovered a similar issue with row reordering on the iPad: if I touch and hold and then begin dragging within roughly 275-475ms then both the row reorder and the vertical scroll occur at the same time (bad). If I touch and drag in under 250ms then it just scrolls (good), and if I touch and don't begin dragging until after about 500ms then the reorder works great and no scroll occurs (good).
Probably you need to force a synchronous style recalculation as soon as the class is added.
Use DomHelper.getStyleValue to retrieve the touch-action style of the TimeAxisSubGridElement. That way it will be forced to recalculate the style based on the new state and the touch action should be "none".
Probably you need to force a synchronous style recalculation as soon as the class is added.
Use DomHelper.getStyleValue to retrieve the touch-action style of the TimeAxisSubGridElement. That way it will be forced to recalculate the style based on the new state and the touch action should be "none".
Since the b-dragcreating and b-row-reordering classes are added programmatically by the Bryntum module, what is the best way for me to add the code you suggested?