fix: prevent div/0 when generating transition keyframes (#13058)

closes #13047

.changeset/few-walls-check.md

@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: prevent div/0 when generating transition keyframes

packages/svelte/src/internal/client/dom/elements/transitions.js

@@ -358,13 +358,34 @@ function animate(element, options, counterpart, t2, on_finish) {
 		var duration = /** @type {number} */ (options.duration) * Math.abs(delta);
 		var keyframes = [];
 
-		if (css) {
+		if (duration > 0) {
-			var n = Math.ceil(duration / (1000 / 60)); // `n` must be an integer, or we risk missing the `t2` value
+			if (css) {
+				var n = Math.ceil(duration / (1000 / 60)); // `n` must be an integer, or we risk missing the `t2` value
+
+				for (var i = 0; i <= n; i += 1) {
+					var t = t1 + delta * easing(i / n);
+					var styles = css(t, 1 - t);
+					keyframes.push(css_to_keyframe(styles));
+				}
+			}
+
+			get_t = () => {
+				var time = /** @type {number} */ (
+					/** @type {globalThis.Animation} */ (animation).currentTime
+				);
+
+				return t1 + delta * easing(time / duration);
+			};
 
-			for (var i = 0; i <= n; i += 1) {
+			if (tick) {
-				var t = t1 + delta * easing(i / n);
+				loop(() => {
-				var styles = css(t, 1 - t);
+					if (animation.playState !== 'running') return false;
-				keyframes.push(css_to_keyframe(styles));
+
+					var t = get_t();
+					tick(t, 1 - t);
+
+					return true;
+				});
 			}
 		}
 
@@ -375,25 +396,6 @@ function animate(element, options, counterpart, t2, on_finish) {
 			tick?.(t2, 1 - t2);
 			on_finish();
 		};
-
-		get_t = () => {
-			var time = /** @type {number} */ (
-				/** @type {globalThis.Animation} */ (animation).currentTime
-			);
-
-			return t1 + delta * easing(time / duration);
-		};
-
-		if (tick) {
-			loop(() => {
-				if (animation.playState !== 'running') return false;
-
-				var t = get_t();
-				tick(t, 1 - t);
-
-				return true;
-			});
-		}
 	};
 
 	return {