Skip to content

Commit 1ea55b6

Browse files
committed
fix(cdk/drag-drop): account for scale when setting free drag position (#29739)
Fixes that the scale was only being synced when the user drags, but we need it also when setting the free drag position. Fixes #29737. (cherry picked from commit 4cd2152)
1 parent aae74b0 commit 1ea55b6

File tree

2 files changed

+18
-0
lines changed

2 files changed

+18
-0
lines changed

src/cdk/drag-drop/directives/drag.ts

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -322,6 +322,7 @@ export class CdkDrag<T = any> implements AfterViewInit, OnChanges, OnDestroy {
322322
() => {
323323
this._updateRootElement();
324324
this._setupHandlesListener();
325+
this._dragRef.scale = this.scale;
325326

326327
if (this.freeDragPosition) {
327328
this._dragRef.setFreeDragPosition(this.freeDragPosition);
@@ -341,6 +342,9 @@ export class CdkDrag<T = any> implements AfterViewInit, OnChanges, OnDestroy {
341342
this._updateRootElement();
342343
}
343344

345+
// Scale affects the free drag position so we need to sync it up here.
346+
this._dragRef.scale = this.scale;
347+
344348
// Skip the first change since it's being handled in the `afterNextRender` queued up in the
345349
// constructor.
346350
if (positionChange && !positionChange.firstChange && this.freeDragPosition) {

src/cdk/drag-drop/directives/standalone-drag.spec.ts

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1371,6 +1371,20 @@ describe('Standalone CdkDrag', () => {
13711371
expect(dragElement.style.transform).toBe('translate3d(150px, 300px, 0px)');
13721372
}));
13731373

1374+
it('should account for the scale when setting the free drag position', fakeAsync(() => {
1375+
const fixture = createComponent(StandaloneDraggable);
1376+
fixture.componentInstance.scale = 0.5;
1377+
fixture.componentInstance.freeDragPosition = {x: 50, y: 100};
1378+
fixture.changeDetectorRef.markForCheck();
1379+
fixture.detectChanges();
1380+
1381+
const dragElement = fixture.componentInstance.dragElement.nativeElement;
1382+
const dragInstance = fixture.componentInstance.dragInstance;
1383+
1384+
expect(dragElement.style.transform).toBe('translate3d(100px, 200px, 0px)');
1385+
expect(dragInstance.getFreeDragPosition()).toEqual({x: 50, y: 100});
1386+
}));
1387+
13741388
it('should include the dragged distance as the user is dragging', fakeAsync(() => {
13751389
const fixture = createComponent(StandaloneDraggable);
13761390
fixture.detectChanges();

0 commit comments

Comments
 (0)