Merge pull request #826 from func25/selection-scrub-freeze

fix(studio): keep preview animations active after selection scrub

packages/studio/src/utils/studioPreviewHelpers.test.ts

@@ -0,0 +1,56 @@
+import { describe, expect, it, vi } from "vitest";
+import { pauseStudioPreviewPlayback } from "./studioPreviewHelpers";
+
+describe("pauseStudioPreviewPlayback", () => {
+  it("pauses through __player without pausing sibling timelines directly", () => {
+    const playerPause = vi.fn();
+    const timelinePause = vi.fn();
+    const siblingPause = vi.fn();
+
+    const iframe = {
+      contentWindow: {
+        __player: {
+          getTime: () => 4.25,
+          pause: playerPause,
+        },
+        __timeline: {
+          time: () => 4.25,
+          pause: timelinePause,
+        },
+        __timelines: {
+          root: {
+            pause: siblingPause,
+          },
+        },
+      },
+    } as unknown as HTMLIFrameElement;
+
+    expect(pauseStudioPreviewPlayback(iframe)).toBe(4.25);
+    expect(playerPause).toHaveBeenCalledTimes(1);
+    expect(timelinePause).not.toHaveBeenCalled();
+    expect(siblingPause).not.toHaveBeenCalled();
+  });
+
+  it("falls back to pausing timelines directly when __player is unavailable", () => {
+    const timelinePause = vi.fn();
+    const siblingPause = vi.fn();
+
+    const iframe = {
+      contentWindow: {
+        __timeline: {
+          time: () => 2.5,
+          pause: timelinePause,
+        },
+        __timelines: {
+          root: {
+            pause: siblingPause,
+          },
+        },
+      },
+    } as unknown as HTMLIFrameElement;
+
+    expect(pauseStudioPreviewPlayback(iframe)).toBe(2.5);
+    expect(timelinePause).toHaveBeenCalledTimes(1);
+    expect(siblingPause).toHaveBeenCalledTimes(1);
+  });
+});

packages/studio/src/utils/studioPreviewHelpers.ts

@@ -160,11 +160,15 @@ export function pauseStudioPreviewPlayback(iframe: HTMLIFrameElement | null): nu
   if (!win) return null;
 
   try {
-    let pausedTime: number | null = null;
     const player = objectLike(Reflect.get(win, "__player"));
-    pausedTime = readPlaybackTime(player, "getTime") ?? pausedTime;
-    callPlaybackMethod(player, "pause");
+    const playerPausedTime = readPlaybackTime(player, "getTime");
+    const playerPause = player ? Reflect.get(player, "pause") : null;
+    if (typeof playerPause === "function") {
+      callPlaybackMethod(player, "pause");
+      return playerPausedTime;
+    }
 
+    let pausedTime: number | null = null;
     const timeline = objectLike(Reflect.get(win, "__timeline"));
     pausedTime = pausedTime ?? readPlaybackTime(timeline, "time");
     callPlaybackMethod(timeline, "pause");