fix(platform-browser): clear renderer cache during HMR when using async animations (#59644)

crisbeto · AndrewKushnir · commit b2b3816cb1c5 · 2025-01-21T09:50:28.000-08:00
Fixes that the async animations renderer didn't have the logic to clean up its style cache during HMR. This is identical to #59393. Fixes #59640. PR Close #59644
diff --git a/packages/platform-browser/animations/async/src/async_animation_renderer.ts b/packages/platform-browser/animations/async/src/async_animation_renderer.ts
@@ -167,6 +167,16 @@ export class AsyncAnimationRendererFactory implements OnDestroy, RendererFactory
   whenRenderingDone?(): Promise<any> {
     return this.delegate.whenRenderingDone?.() ?? Promise.resolve();
   }
+
+  /**
+   * Used during HMR to clear any cached data about a component.
+   * @param componentId ID of the component that is being replaced.
+   */
+  protected componentReplaced(componentId: string) {
+    // Flush the engine since the renderer destruction waits for animations to be done.
+    this._engine?.flush();
+    (this.delegate as {componentReplaced?: (id: string) => void}).componentReplaced?.(componentId);
+  }
 }
 
 /**
