From 6280d479702f42fd388443057e6d7685beee934f Mon Sep 17 00:00:00 2001
From: Etai Nadler <75544136+etainad008@users.noreply.github.com>
Date: Tue, 3 Sep 2024 00:01:53 +0300
Subject: [PATCH] fix: flip not accounting for scaled lengths

---
 packages/svelte/src/animate/index.js | 7 +++++--
 1 file changed, 5 insertions(+), 2 deletions(-)

diff --git a/packages/svelte/src/animate/index.js b/packages/svelte/src/animate/index.js
index f676ff6bf8..7fe9f3ceb3 100644
--- a/packages/svelte/src/animate/index.js
+++ b/packages/svelte/src/animate/index.js
@@ -13,10 +13,13 @@ import { cubicOut } from '../easing/index.js';
  */
 export function flip(node, { from, to }, params = {}) {
 	const style = getComputedStyle(node);
+	// need to account for scaled vs unscaled lengths (https://drafts.csswg.org/css-viewport/#scaled).
+	const dsx = from.width / parseFloat(style.width);
+	const dsy = from.height / parseFloat(style.height);
 	const transform = style.transform === 'none' ? '' : style.transform;
 	const [ox, oy] = style.transformOrigin.split(' ').map(parseFloat);
-	const dx = from.left + (from.width * ox) / to.width - (to.left + ox);
-	const dy = from.top + (from.height * oy) / to.height - (to.top + oy);
+	const dx = (from.left + (from.width * ox) / to.width - (to.left + ox)) / dsx;
+	const dy = (from.top + (from.height * oy) / to.height - (to.top + oy)) / dsy;
 	const { delay = 0, duration = (d) => Math.sqrt(d) * 120, easing = cubicOut } = params;
 	return {
 		delay,