From acf9c1291cb3c64f87a8ee0be808e8d2426f2779 Mon Sep 17 00:00:00 2001
From: Pat Cavit <github@patcavit.com>
Date: Thu, 30 Apr 2020 14:51:49 -0700
Subject: [PATCH 1/3] WIP: resize listener destruct ordering

- Destroy the resize listener <iframe> before the parent element.
- Unsubscribe from the event listener before detaching the <iframe>
---
 src/compiler/compile/render_dom/wrappers/Element/index.ts | 2 +-
 src/runtime/internal/dom.ts                               | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/compiler/compile/render_dom/wrappers/Element/index.ts b/src/compiler/compile/render_dom/wrappers/Element/index.ts
index 64d02191fb8e..e33c291ea301 100644
--- a/src/compiler/compile/render_dom/wrappers/Element/index.ts
+++ b/src/compiler/compile/render_dom/wrappers/Element/index.ts
@@ -585,7 +585,7 @@ export default class ElementWrapper extends Wrapper {
 						b`${resize_listener} = @add_resize_listener(${this.var}, ${callee}.bind(${this.var}));`
 					);
 
-					block.chunks.destroy.push(
+					block.chunks.destroy.unshift(
 						b`${resize_listener}();`
 					);
 				} else {
diff --git a/src/runtime/internal/dom.ts b/src/runtime/internal/dom.ts
index bf8fc1f5a036..ab45de3ffb25 100644
--- a/src/runtime/internal/dom.ts
+++ b/src/runtime/internal/dom.ts
@@ -287,8 +287,8 @@ export function add_resize_listener(node: HTMLElement, fn: () => void) {
 	append(node, iframe);
 
 	return () => {
-		detach(iframe);
 		if (unsubscribe) unsubscribe();
+		detach(iframe);
 	};
 }
 

From 190e3390049c684cb2a63fa478d2bcadb4751955 Mon Sep 17 00:00:00 2001
From: Pat Cavit <github@patcavit.com>
Date: Thu, 30 Apr 2020 15:15:23 -0700
Subject: [PATCH 2/3] WIP: update expected .js files

---
 test/js/samples/bind-width-height/expected.js | 2 +-
 test/js/samples/video-bindings/expected.js    | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/test/js/samples/bind-width-height/expected.js b/test/js/samples/bind-width-height/expected.js
index 4848704c4b0d..7983c14da057 100644
--- a/test/js/samples/bind-width-height/expected.js
+++ b/test/js/samples/bind-width-height/expected.js
@@ -29,8 +29,8 @@ function create_fragment(ctx) {
 		i: noop,
 		o: noop,
 		d(detaching) {
-			if (detaching) detach(div);
 			div_resize_listener();
+			if (detaching) detach(div);
 		}
 	};
 }
diff --git a/test/js/samples/video-bindings/expected.js b/test/js/samples/video-bindings/expected.js
index 9c5467e1a05d..298eec7da5e3 100644
--- a/test/js/samples/video-bindings/expected.js
+++ b/test/js/samples/video-bindings/expected.js
@@ -58,8 +58,8 @@ function create_fragment(ctx) {
 		i: noop,
 		o: noop,
 		d(detaching) {
-			if (detaching) detach(video);
 			video_resize_listener();
+			if (detaching) detach(video);
 			run_all(dispose);
 		}
 	};

From 3394b62cd720176725f7f2a93ffb4695dcafcfbb Mon Sep 17 00:00:00 2001
From: Pat Cavit <github@patcavit.com>
Date: Fri, 1 May 2020 00:22:43 -0700
Subject: [PATCH 3/3] WIP: destroy components before their immediate parents

This feels hacky beyond belief, maybe there's a better way to know where in the `block.chunks.destroy` to put thate statement?

Should `block.chunks` get a new array, `componentDestroys` or something?
---
 .../compile/render_dom/wrappers/InlineComponent/index.ts      | 4 ++--
 test/js/samples/component-static-var/expected.js              | 2 +-
 test/js/samples/non-imported-component/expected.js            | 2 +-
 3 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/compiler/compile/render_dom/wrappers/InlineComponent/index.ts b/src/compiler/compile/render_dom/wrappers/InlineComponent/index.ts
index 4b1e787cbe92..55286c3d56e8 100644
--- a/src/compiler/compile/render_dom/wrappers/InlineComponent/index.ts
+++ b/src/compiler/compile/render_dom/wrappers/InlineComponent/index.ts
@@ -484,7 +484,7 @@ export default class InlineComponentWrapper extends Wrapper {
 				b`if (${name}) @transition_out(${name}.$$.fragment, #local);`
 			);
 
-			block.chunks.destroy.push(b`if (${name}) @destroy_component(${name}, ${parent_node ? null : 'detaching'});`);
+			block.chunks.destroy.splice(-1, 0, b`if (${name}) @destroy_component(${name}, ${parent_node ? null : 'detaching'});`);
 		} else {
 			const expression = this.node.name === 'svelte:self'
 				? component.name
@@ -523,7 +523,7 @@ export default class InlineComponentWrapper extends Wrapper {
 				`);
 			}
 
-			block.chunks.destroy.push(b`
+			block.chunks.destroy.splice(-1, 0, b`
 				@destroy_component(${name}, ${parent_node ? null : 'detaching'});
 			`);
 
diff --git a/test/js/samples/component-static-var/expected.js b/test/js/samples/component-static-var/expected.js
index c032a0636d42..b4031a70ad45 100644
--- a/test/js/samples/component-static-var/expected.js
+++ b/test/js/samples/component-static-var/expected.js
@@ -69,8 +69,8 @@ function create_fragment(ctx) {
 		},
 		d(detaching) {
 			destroy_component(foo, detaching);
-			if (detaching) detach(t0);
 			destroy_component(bar, detaching);
+			if (detaching) detach(t0);
 			if (detaching) detach(t1);
 			if (detaching) detach(input);
 			dispose();
diff --git a/test/js/samples/non-imported-component/expected.js b/test/js/samples/non-imported-component/expected.js
index 2784fd17acb3..621a40c5c5dc 100644
--- a/test/js/samples/non-imported-component/expected.js
+++ b/test/js/samples/non-imported-component/expected.js
@@ -48,8 +48,8 @@ function create_fragment(ctx) {
 		},
 		d(detaching) {
 			destroy_component(imported, detaching);
-			if (detaching) detach(t);
 			destroy_component(nonimported, detaching);
+			if (detaching) detach(t);
 		}
 	};
 }