From 91f6b6d1a42b4e58665eb81107c2b3d627f13f66 Mon Sep 17 00:00:00 2001 From: Bryan Jensen Date: Wed, 3 Sep 2025 17:28:26 -0700 Subject: [PATCH 1/3] Treat canceled animations as finished, just the same as successful ones --- .../modules/preview-web/render/animation-utils.ts | 13 ++++++++++++- 1 file changed, 12 insertions(+), 1 deletion(-) diff --git a/code/core/src/preview-api/modules/preview-web/render/animation-utils.ts b/code/core/src/preview-api/modules/preview-web/render/animation-utils.ts index 385e39b5ffef..8fee5a7097f6 100644 --- a/code/core/src/preview-api/modules/preview-web/render/animation-utils.ts +++ b/code/core/src/preview-api/modules/preview-web/render/animation-utils.ts @@ -78,7 +78,18 @@ export async function waitForAnimations(signal?: AbortSignal) { .flatMap((el) => el?.getAnimations?.() || []) .filter((a) => a.playState === 'running' && !isInfiniteAnimation(a)); if (runningAnimations.length > 0) { - await Promise.all(runningAnimations.map((a) => a.finished)); + await Promise.all( + runningAnimations.map(async (a) => { + try { + await a.finished; + } catch (err) { + // Ignore AbortError from canceled animations, treat as "finished" + if (!(err instanceof Error && err.name === 'AbortError')) { + throw err; + } + } + }) + ); await checkAnimationsFinished(); } }; From 383f4526335282bad72766ed3a0b2f7473457c0c Mon Sep 17 00:00:00 2001 From: Steve Dodier-Lazaro Date: Mon, 22 Dec 2025 18:07:48 +0100 Subject: [PATCH 2/3] Apply suggestion from @Sidnioulz --- .../preview-api/modules/preview-web/render/animation-utils.ts | 1 + 1 file changed, 1 insertion(+) diff --git a/code/core/src/preview-api/modules/preview-web/render/animation-utils.ts b/code/core/src/preview-api/modules/preview-web/render/animation-utils.ts index 8fee5a7097f6..d45212d86a66 100644 --- a/code/core/src/preview-api/modules/preview-web/render/animation-utils.ts +++ b/code/core/src/preview-api/modules/preview-web/render/animation-utils.ts @@ -84,6 +84,7 @@ export async function waitForAnimations(signal?: AbortSignal) { await a.finished; } catch (err) { // Ignore AbortError from canceled animations, treat as "finished" + // Those errors occur exclusively on CRA with React.StrictMode enabled. if (!(err instanceof Error && err.name === 'AbortError')) { throw err; } From b3531d72f71589041a87bc425a2c751a58b45541 Mon Sep 17 00:00:00 2001 From: Bryan Jensen Date: Wed, 24 Dec 2025 10:27:20 -0800 Subject: [PATCH 3/3] Remove try/catch in favor of allSettled() --- .../modules/preview-web/render/animation-utils.ts | 15 ++------------- 1 file changed, 2 insertions(+), 13 deletions(-) diff --git a/code/core/src/preview-api/modules/preview-web/render/animation-utils.ts b/code/core/src/preview-api/modules/preview-web/render/animation-utils.ts index d45212d86a66..994ae82438ed 100644 --- a/code/core/src/preview-api/modules/preview-web/render/animation-utils.ts +++ b/code/core/src/preview-api/modules/preview-web/render/animation-utils.ts @@ -78,19 +78,8 @@ export async function waitForAnimations(signal?: AbortSignal) { .flatMap((el) => el?.getAnimations?.() || []) .filter((a) => a.playState === 'running' && !isInfiniteAnimation(a)); if (runningAnimations.length > 0) { - await Promise.all( - runningAnimations.map(async (a) => { - try { - await a.finished; - } catch (err) { - // Ignore AbortError from canceled animations, treat as "finished" - // Those errors occur exclusively on CRA with React.StrictMode enabled. - if (!(err instanceof Error && err.name === 'AbortError')) { - throw err; - } - } - }) - ); + // Treat any errors (e.g. AbortError) from `finished` as also finished, even though not successfully so + await Promise.allSettled(runningAnimations.map(async (a) => a.finished)); await checkAnimationsFinished(); } };