Angular DropList with cdkDropListConnectedTo not working in ShadowDom

[trungphan]

Dragging items from one list to another list where both list are in the same shadow roots does not work.

Reproduction

Steps to re-create:

• Use the example from https://material.angular.io/cdk/drag-drop/overview#transferring-items-between-lists
• Go to https://stackblitz.com/angular/mgodlvpbbjd?file=app%2Fcdk-drag-drop-connected-sorting-example.ts
• Change the CdkDragDropConnectedSortingExample to use ViewEncapsulation.ShadowDom
• See the issue: item from one list cannot be dragged to another list.

This is because of the condition check "elementFromPoint === nativeElement || nativeElement.contains(elementFromPoint)" in the method _canReceive : https://github.com/angular/components/blob/master/src/cdk/drag-drop/drop-list-ref.ts#L834

[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.}