bug(cdkDrag): nested inside a scrollable container breaks the visual flow

[sthompson-celerity]

Is this a regression?

• Yes, this behavior used to work in the previous version

The previous version in which this bug was not present was

No response

Description

If you make a container that is scrollable and put the list inside of that container the position of the scroll item will become lost and gets stuck on its current position and stays with the scrolled section.

Reproduction

StackBlitz link:
https://stackblitz.com/edit/ijrsrkge?file=src%2Fexample%2Fcdk-drag-drop-sorting-example.html
Steps to reproduce:

1. Make a list
2. put the list inside of a container with overflow: auto and height 200px;
3. start dragging
4. move the mouse up and down and notice how the item is inserting

Expected Behavior

Actual Behavior

Environment

• Angular: 19-20
• CDK/Material: 19-20
• Browser(s): chrome
• Operating System (e.g. Windows, macOS, Ubuntu): mac and windows

[crisbeto]

You have to apply the cdkScrollable directive on the container so the CDK knows to listen for scroll events on it.