cdkDropList broken on touch devices on touchend

[atscott]

What is the expected behavior?

cdkDropList does not error

What is the current behavior?

The _cleanupDragArtifacts method now calls _getPointerPositionOnPage which does not handle touchend events correctly:
const point = this._isTouchEvent(event) ? event.touches[0] : event;
==> When the event is "touchend" the event.touches array is empty. Instead changedTouches has the Touch object you need.
Documentation for the touches array (key portion "touch points that are currently in contact"):
A TouchList listing all the Touch objects for touch points that are currently in contact with the touch surface, regardless of whether or not they've changed or what their target element was at touchstart time.

What are the steps to reproduce?

I don't think this is available as an npm yet, so I can't get a stackblitz.

Which versions of Angular, Material, OS, TypeScript, browsers are affected?

I believe this was caused by #14140 and affects all touch-based browsers

Is there anything else we should know?

[crisbeto]

@atscott what is the case in which the event.touches would be empty?

[atscott]

For a cdkDropList, it happens at the very end when you drop the element. This is a touchend event, which does not have any active touch points so the event.touches array is empty. This can be reproduced in the chrome developer console.

[atscott]

I think this could be solved simply with:
const point = this._isTouchEvent(event) ? (event.touches[0] || changedTouches[0]) : event;

[crisbeto]

Yes, I can put in a fix for it, but first I want to understand how the issue happens. I wasn't able to reproduce it with the dev tools:

[atscott]

You're doing the right thing to reproduce this bug. I don't think this bug is in the 7.1.1 release (even though that was created 2 days ago and the PR was submitted 7 days ago), but will be in the next release. I don't see the bug fix for that PR in the release notes and if I inspect the source, I don't see the call to _getPointerPositionOnPage in _cleanupDragArtifacts.

[crisbeto]

Thanks, I see it when I run master.

[angular-automatic-lock-bot]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}