From fb5f281e9acea119f99526ba4fea161809eee6bd Mon Sep 17 00:00:00 2001
From: Bob Fanger <bfanger@gmail.com>
Date: Tue, 14 Mar 2023 15:33:52 +0100
Subject: [PATCH] fix: Prevent intro from cancelling outro (#7300)

The issue

1. When the block.i (intro) is called it registers a callback (via add_render_callback)
2. Then the block.o (outro) is called and start the outro and adds a callback to detach on outroend
3. The render callback from the intro is executed, starts the intro and cancels the outro animation

This causes components that should've been destroyed to stay on the page.

The fix in this PR: Inside the intro render callback it checks if it is still current and if it isn't (because an outro was triggered) it won't start the intro animation.

fixes #6152
fixes #6812
---
 src/compiler/compile/render_dom/wrappers/Element/index.ts | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/src/compiler/compile/render_dom/wrappers/Element/index.ts b/src/compiler/compile/render_dom/wrappers/Element/index.ts
index 0af012777a..06a7b93d0e 100644
--- a/src/compiler/compile/render_dom/wrappers/Element/index.ts
+++ b/src/compiler/compile/render_dom/wrappers/Element/index.ts
@@ -967,6 +967,7 @@ export default class ElementWrapper extends Wrapper {
 
 			const intro_block = b`
 				@add_render_callback(() => {
+					if (!#current) return;
 					if (!${name}) ${name} = @create_bidirectional_transition(${this.var}, ${fn}, ${snippet}, true);
 					${name}.run(1);
 				});
@@ -1012,6 +1013,7 @@ export default class ElementWrapper extends Wrapper {
 				if (outro) {
 					intro_block = b`
 						@add_render_callback(() => {
+							if (!#current) return;
 							if (${outro_name}) ${outro_name}.end(1);
 							${intro_name} = @create_in_transition(${this.var}, ${fn}, ${snippet});
 							${intro_name}.start();