From 2cddada6de8c4375c3be578ba20196ce49355679 Mon Sep 17 00:00:00 2001
From: Robert Smith <robertadamsonsmith@gmail.com>
Date: Thu, 6 Jul 2023 01:49:14 +0100
Subject: [PATCH] Fix bind:this switching transitioning elements

---
 .../render_dom/wrappers/shared/bind_this.js      | 10 +++++++++-
 .../_config.js                                   | 13 +++++++++++++
 .../main.svelte                                  | 16 ++++++++++++++++
 .../_config.js                                   |  4 ++--
 .../transition-js-if-else-block-outro/_config.js |  4 ++--
 .../_config.js                                   |  4 ++--
 6 files changed, 44 insertions(+), 7 deletions(-)
 create mode 100644 packages/svelte/test/runtime/samples/bind-this-transition-js-if-else-block/_config.js
 create mode 100644 packages/svelte/test/runtime/samples/bind-this-transition-js-if-else-block/main.svelte

diff --git a/packages/svelte/src/compiler/compile/render_dom/wrappers/shared/bind_this.js b/packages/svelte/src/compiler/compile/render_dom/wrappers/shared/bind_this.js
index 8438ee24eb..e3e0b004bc 100644
--- a/packages/svelte/src/compiler/compile/render_dom/wrappers/shared/bind_this.js
+++ b/packages/svelte/src/compiler/compile/render_dom/wrappers/shared/bind_this.js
@@ -84,6 +84,14 @@ export default function bind_this(component, block, binding, variable) {
 			});
 		}
 	`);
-	block.chunks.destroy.push(b`${callee}(null);`);
+	if (block.has_outro_method)	{
+		block.chunks.outro.push(b`${callee}(null);`  );
+		block.chunks.destroy.push(b`if(#current) {
+			${callee}(null);
+		}`);
+	}
+	else {
+		block.chunks.destroy.push(b`${callee}(null);`);
+	}
 	return b`${callee}(${variable});`;
 }
diff --git a/packages/svelte/test/runtime/samples/bind-this-transition-js-if-else-block/_config.js b/packages/svelte/test/runtime/samples/bind-this-transition-js-if-else-block/_config.js
new file mode 100644
index 0000000000..8110afb476
--- /dev/null
+++ b/packages/svelte/test/runtime/samples/bind-this-transition-js-if-else-block/_config.js
@@ -0,0 +1,13 @@
+export default {
+	get props() {
+		return { show: 'a' };
+	},
+
+	test({ assert, component, target, raf }) {
+		assert.equal(component.el, target.querySelector('div.first'));
+		component.show = 'b';
+
+		raf.tick(200);
+		assert.equal(component.el, target.querySelector('div.second'));
+	}
+};
diff --git a/packages/svelte/test/runtime/samples/bind-this-transition-js-if-else-block/main.svelte b/packages/svelte/test/runtime/samples/bind-this-transition-js-if-else-block/main.svelte
new file mode 100644
index 0000000000..b6bd63ff55
--- /dev/null
+++ b/packages/svelte/test/runtime/samples/bind-this-transition-js-if-else-block/main.svelte
@@ -0,0 +1,16 @@
+<script>
+	export let el;
+	export let show;
+
+	function foo(node) {
+		return {
+			duration: 100
+		};
+	}
+</script>
+
+{#if show=="a"}
+	<div class="first" bind:this={el} transition:foo>first</div>
+{:else if show=="b"}
+	<div class="second" bind:this={el} transition:foo>second</div>
+{/if}
diff --git a/packages/svelte/test/runtime/samples/transition-js-if-else-block-dynamic-outro/_config.js b/packages/svelte/test/runtime/samples/transition-js-if-else-block-dynamic-outro/_config.js
index f01dda09fc..2d92f19e97 100644
--- a/packages/svelte/test/runtime/samples/transition-js-if-else-block-dynamic-outro/_config.js
+++ b/packages/svelte/test/runtime/samples/transition-js-if-else-block-dynamic-outro/_config.js
@@ -10,11 +10,11 @@ export default {
 
 		raf.tick(25);
 		assert.equal(component.yes.foo, undefined);
-		assert.equal(component.no.foo, 0.75);
+		assert.equal(component.no, null);
 
 		raf.tick(75);
 		assert.equal(component.yes.foo, undefined);
-		assert.equal(component.no.foo, 0.25);
+		assert.equal(component.no, null);
 
 		raf.tick(100);
 	}
diff --git a/packages/svelte/test/runtime/samples/transition-js-if-else-block-outro/_config.js b/packages/svelte/test/runtime/samples/transition-js-if-else-block-outro/_config.js
index 0d56cba09b..07f87775e0 100644
--- a/packages/svelte/test/runtime/samples/transition-js-if-else-block-outro/_config.js
+++ b/packages/svelte/test/runtime/samples/transition-js-if-else-block-outro/_config.js
@@ -6,11 +6,11 @@ export default {
 
 		raf.tick(25);
 		assert.equal(component.yes.foo, undefined);
-		assert.equal(component.no.foo, 0.75);
+		assert.equal(component.no, null);
 
 		raf.tick(75);
 		assert.equal(component.yes.foo, undefined);
-		assert.equal(component.no.foo, 0.25);
+		assert.equal(component.no, null);
 
 		raf.tick(100);
 	}
diff --git a/packages/svelte/test/runtime/samples/transition-js-if-elseif-block-outro/_config.js b/packages/svelte/test/runtime/samples/transition-js-if-elseif-block-outro/_config.js
index fe7998b662..76961ddd87 100644
--- a/packages/svelte/test/runtime/samples/transition-js-if-elseif-block-outro/_config.js
+++ b/packages/svelte/test/runtime/samples/transition-js-if-elseif-block-outro/_config.js
@@ -11,11 +11,11 @@ export default {
 
 		raf.tick(25);
 		assert.equal(component.yes.foo, undefined);
-		assert.equal(component.no.foo, 0.75);
+		assert.equal(component.no, null);
 
 		raf.tick(75);
 		assert.equal(component.yes.foo, undefined);
-		assert.equal(component.no.foo, 0.25);
+		assert.equal(component.no, null);
 
 		raf.tick(100);
 	}