From 4cd2152d9813078f81fc2be671f123ffa8c09974 Mon Sep 17 00:00:00 2001
From: Kristiyan Kostadinov <crisbeto@users.noreply.github.com>
Date: Tue, 17 Sep 2024 17:06:41 +0200
Subject: [PATCH] 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.
---
 src/cdk/drag-drop/directives/drag.ts               |  4 ++++
 .../drag-drop/directives/standalone-drag.spec.ts   | 14 ++++++++++++++
 2 files changed, 18 insertions(+)

diff --git a/src/cdk/drag-drop/directives/drag.ts b/src/cdk/drag-drop/directives/drag.ts
index 1aa0ea035ba1..c463d0c8ce2c 100644
--- a/src/cdk/drag-drop/directives/drag.ts
+++ b/src/cdk/drag-drop/directives/drag.ts
@@ -314,6 +314,7 @@ export class CdkDrag<T = any> implements AfterViewInit, OnChanges, OnDestroy {
       () => {
         this._updateRootElement();
         this._setupHandlesListener();
+        this._dragRef.scale = this.scale;
 
         if (this.freeDragPosition) {
           this._dragRef.setFreeDragPosition(this.freeDragPosition);
@@ -333,6 +334,9 @@ export class CdkDrag<T = any> implements AfterViewInit, OnChanges, OnDestroy {
       this._updateRootElement();
     }
 
+    // Scale affects the free drag position so we need to sync it up here.
+    this._dragRef.scale = this.scale;
+
     // Skip the first change since it's being handled in the `afterNextRender` queued up in the
     // constructor.
     if (positionChange && !positionChange.firstChange && this.freeDragPosition) {
diff --git a/src/cdk/drag-drop/directives/standalone-drag.spec.ts b/src/cdk/drag-drop/directives/standalone-drag.spec.ts
index 33f0588260cf..775f9e69ef91 100644
--- a/src/cdk/drag-drop/directives/standalone-drag.spec.ts
+++ b/src/cdk/drag-drop/directives/standalone-drag.spec.ts
@@ -1371,6 +1371,20 @@ describe('Standalone CdkDrag', () => {
     expect(dragElement.style.transform).toBe('translate3d(150px, 300px, 0px)');
   }));
 
+  it('should account for the scale when setting the free drag position', fakeAsync(() => {
+    const fixture = createComponent(StandaloneDraggable);
+    fixture.componentInstance.scale = 0.5;
+    fixture.componentInstance.freeDragPosition = {x: 50, y: 100};
+    fixture.changeDetectorRef.markForCheck();
+    fixture.detectChanges();
+
+    const dragElement = fixture.componentInstance.dragElement.nativeElement;
+    const dragInstance = fixture.componentInstance.dragInstance;
+
+    expect(dragElement.style.transform).toBe('translate3d(100px, 200px, 0px)');
+    expect(dragInstance.getFreeDragPosition()).toEqual({x: 50, y: 100});
+  }));
+
   it('should include the dragged distance as the user is dragging', fakeAsync(() => {
     const fixture = createComponent(StandaloneDraggable);
     fixture.detectChanges();