components: bug(cdkDrag): using cdkDragConstrainPosition causes erratic behavior

This is still blocking us from updating as well. We are running angular 15 with cdk 13 for now.

@mj3052 Now working perfectly fine (tested in 16.2.12). Thanks so much for fixing this! 🥇

I’ve tried to implement an initial fix in PR #27730. All tests seem to be passing.

@crisbeto Let me know what needs to be done in order to get this further. I am not sure about how you guys normally use the dev-app, but I added two more cases in it (one using just the boundary and one combining the boundary with a constraint), to make sure it works in all cases.

I can easily remove this if need be.

You’d have to offset it based on the position at which the user picked up the element, which I now realize isn’t possible to read. I’ve opened up #25341 to expose it within the constrainPosition callback.

@mj3052 I haven’t had time to look into this, because of different team priorities. I’d be open to reviewing and landing a fix though.

@crisbeto

Is there anything I/someone can do to get this moving forward somehow? Or at least get some clarification about what is going to happen with the strange behavior still seen in some cases. We are currently stuck building our own patched version using the old behavior before #25061 for our project, as we’re using cdkDragBoundary with cdkDragConstrainPosition in quite a few places.

I am open to contribute in solving this if required. It seems the example of @HuntosShuntos is showing the problem we’re having, which was introduced by #25061.

If cdkDragBoundary is not going to work together with cdkDragConstrainPosition I think it should at least be documented that this is the case.

This bug also seems to impact other parts of cdkDrag. Specifically when cdkDragConstrainPosition when used with cdkDragBoundary also seems to have erratic behavior.

Reproduction See below https://angular-ivy-9unppr.stackblitz.io https://stackblitz.com/edit/angular-ivy-9unppr?file=src/app/app.component.html

Environment

Angular: 15.0.3
CDK/Material: 15.0.3
Browser(s): Chrome / Firefox
Operating System (e.g. Windows, macOS, Ubuntu): Windows

Expected Behavior Should stay within the drag boundary and be able to go to the edges of the boundary

Actual Behavior Seems that the drag boundary arbitrarily moves