From 38c3dab9baf1e2d9caaea6fe23d18d361ea14ad7 Mon Sep 17 00:00:00 2001
From: rster20002 <rster2002dev@gmail.com>
Date: Tue, 27 Jul 2021 17:42:59 +0200
Subject: [PATCH 01/21] Initial draft for error handling using `onError`

---
 src/compiler/compile/render_dom/Block.ts |  4 ++++
 src/compiler/compile/render_dom/index.ts | 13 +++++++++++--
 src/runtime/index.ts                     |  1 +
 src/runtime/internal/Component.ts        | 24 +++++++++++++++++++++++-
 src/runtime/internal/lifecycle.ts        |  4 ++++
 5 files changed, 43 insertions(+), 3 deletions(-)

diff --git a/src/compiler/compile/render_dom/Block.ts b/src/compiler/compile/render_dom/Block.ts
index cad7e221700d..021a7148b8aa 100644
--- a/src/compiler/compile/render_dom/Block.ts
+++ b/src/compiler/compile/render_dom/Block.ts
@@ -461,6 +461,10 @@ export default class Block {
 
 			this.add_variable(dispose);
 
+            this.event_listeners.forEach(event_listener => {
+                event_listener.arguments[2] = x`@attach_error_handler.call(${event_listener.arguments[0]}, #component, ${event_listener.arguments[2]})`;
+            });
+
 			if (this.event_listeners.length === 1) {
 				this.chunks.mount.push(
 					b`
diff --git a/src/compiler/compile/render_dom/index.ts b/src/compiler/compile/render_dom/index.ts
index f74f4cdf1ccb..c8e41c55f368 100644
--- a/src/compiler/compile/render_dom/index.ts
+++ b/src/compiler/compile/render_dom/index.ts
@@ -329,7 +329,7 @@ export default function dom(
 	const has_create_fragment = component.compile_options.dev || block.has_content();
 	if (has_create_fragment) {
 		body.push(b`
-			function create_fragment(#ctx) {
+			function create_fragment(#ctx, #component) {
 				${block.get_contents()}
 			}
 		`);
@@ -450,6 +450,15 @@ export default function dom(
 			}) as Expression)
 		};
 
+        const instance_try_block: any = b`
+            try {}
+            catch(e) {
+                @handle_error($$self, e);
+            }
+        `;
+
+        instance_try_block[0].block.body = instance_javascript.flat();
+
 		body.push(b`
 			function ${definition}(${args}) {
 				${injected.map(name => b`let ${name};`)}
@@ -466,7 +475,7 @@ export default function dom(
 				${component.compile_options.dev && b`@validate_slots('${component.tag}', #slots, [${[...component.slots.keys()].map(key => `'${key}'`).join(',')}]);`}
 				${compute_slots}
 
-				${instance_javascript}
+				${instance_try_block}
 
 				${unknown_props_check}
 
diff --git a/src/runtime/index.ts b/src/runtime/index.ts
index 8e12f9f0eebb..054abe208a94 100644
--- a/src/runtime/index.ts
+++ b/src/runtime/index.ts
@@ -3,6 +3,7 @@ import './ambient';
 export {
 	onMount,
 	onDestroy,
+    onError,
 	beforeUpdate,
 	afterUpdate,
 	setContext,
diff --git a/src/runtime/internal/Component.ts b/src/runtime/internal/Component.ts
index e706928af305..f68eec4111e5 100644
--- a/src/runtime/internal/Component.ts
+++ b/src/runtime/internal/Component.ts
@@ -36,6 +36,7 @@ interface T$$ {
 	context: Map<any, any>;
 	on_mount: any[];
 	on_destroy: any[];
+    on_error: any[];
 	skip_bound: boolean;
 	on_disconnect: any[];
 	root:Element|ShadowRoot
@@ -104,6 +105,26 @@ function make_dirty(component, i) {
 	component.$$.dirty[(i / 31) | 0] |= (1 << (i % 31));
 }
 
+export function attach_error_handler(component, fn) {
+    return () => {
+        try {
+            fn.call(this, ...arguments);
+        } catch (e) {
+            handle_error(component, e);
+        }
+    }
+}
+
+export function handle_error(component, e) {
+    if (component.$$.on_error.length === 0) {
+        throw e;
+    }
+
+    component.$$.on_error.forEach(handler => {
+        handler(e);
+    });
+}
+
 export function init(component, options, instance, create_fragment, not_equal, props, append_styles, dirty = [-1]) {
 	const parent_component = current_component;
 	set_current_component(component);
@@ -122,6 +143,7 @@ export function init(component, options, instance, create_fragment, not_equal, p
 		on_mount: [],
 		on_destroy: [],
 		on_disconnect: [],
+        on_error: [],
 		before_update: [],
 		after_update: [],
 		context: new Map(parent_component ? parent_component.$$.context : options.context || []),
@@ -153,7 +175,7 @@ export function init(component, options, instance, create_fragment, not_equal, p
 	run_all($$.before_update);
 
 	// `false` as a special case of no DOM component
-	$$.fragment = create_fragment ? create_fragment($$.ctx) : false;
+	$$.fragment = create_fragment ? create_fragment($$.ctx, component) : false;
 
 	if (options.target) {
 		if (options.hydrate) {
diff --git a/src/runtime/internal/lifecycle.ts b/src/runtime/internal/lifecycle.ts
index bb3df3d29526..e69249faa785 100644
--- a/src/runtime/internal/lifecycle.ts
+++ b/src/runtime/internal/lifecycle.ts
@@ -27,6 +27,10 @@ export function onDestroy(fn: () => any) {
 	get_current_component().$$.on_destroy.push(fn);
 }
 
+export function onError(fn: () => any) {
+    get_current_component().$$.on_error.push(fn);
+}
+
 export function createEventDispatcher<
 	EventMap extends {} = any
 >(): <EventKey extends Extract<keyof EventMap, string>>(type: EventKey, detail?: EventMap[EventKey]) => void {

From 4ffe983922995196f4df2fd206cab56be96edfc8 Mon Sep 17 00:00:00 2001
From: rster20002 <rster2002dev@gmail.com>
Date: Tue, 27 Jul 2021 17:52:20 +0200
Subject: [PATCH 02/21] Comply with lint errors

---
 src/runtime/internal/Component.ts | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/runtime/internal/Component.ts b/src/runtime/internal/Component.ts
index f68eec4111e5..98f61b729e9f 100644
--- a/src/runtime/internal/Component.ts
+++ b/src/runtime/internal/Component.ts
@@ -106,13 +106,13 @@ function make_dirty(component, i) {
 }
 
 export function attach_error_handler(component, fn) {
-    return () => {
+    return (...rest) => {
         try {
-            fn.call(this, ...arguments);
+            fn.call(this, ...rest);
         } catch (e) {
             handle_error(component, e);
         }
-    }
+    };
 }
 
 export function handle_error(component, e) {

From 0699f9093358e0f4c5751cdf5c839ec5025188df Mon Sep 17 00:00:00 2001
From: rster20002 <rster2002dev@gmail.com>
Date: Tue, 27 Jul 2021 22:08:07 +0200
Subject: [PATCH 03/21] Errors can now bubble to parent component

---
 src/runtime/internal/Component.ts | 22 ++++++++++++++++++----
 1 file changed, 18 insertions(+), 4 deletions(-)

diff --git a/src/runtime/internal/Component.ts b/src/runtime/internal/Component.ts
index 98f61b729e9f..506c4a48f6c3 100644
--- a/src/runtime/internal/Component.ts
+++ b/src/runtime/internal/Component.ts
@@ -39,7 +39,8 @@ interface T$$ {
     on_error: any[];
 	skip_bound: boolean;
 	on_disconnect: any[];
-	root:Element|ShadowRoot
+	root:Element|ShadowRoot;
+    parent_component: T$$;
 }
 
 export function bind(component, name, callback) {
@@ -117,14 +118,26 @@ export function attach_error_handler(component, fn) {
 
 export function handle_error(component, e) {
     if (component.$$.on_error.length === 0) {
-        throw e;
+        bubble_error(component, e);
     }
 
     component.$$.on_error.forEach(handler => {
-        handler(e);
+        try {
+            handler(e);
+        } catch (e) {
+            bubble_error(component, e);
+        }
     });
 }
 
+function bubble_error(component, e) {
+    if (component.$$.parent_component) {
+        handle_error(component.$$.parent_component, e);
+    } else {
+        throw e;
+    }
+}
+
 export function init(component, options, instance, create_fragment, not_equal, props, append_styles, dirty = [-1]) {
 	const parent_component = current_component;
 	set_current_component(component);
@@ -152,7 +165,8 @@ export function init(component, options, instance, create_fragment, not_equal, p
 		callbacks: blank_object(),
 		dirty,
 		skip_bound: false,
-		root: options.target || parent_component.$$.root
+		root: options.target || parent_component.$$.root,
+        parent_component
 	};
 
 	append_styles && append_styles($$.root);

From 40cce0dcdfa6bc75655eb8ff8f20b41f3759d63c Mon Sep 17 00:00:00 2001
From: rster20002 <rster2002dev@gmail.com>
Date: Wed, 28 Jul 2021 16:50:14 +0200
Subject: [PATCH 04/21] Fixed TS errors

---
 src/compiler/compile/render_dom/Block.ts | 4 ++--
 src/runtime/internal/Component.ts        | 4 ++--
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/compiler/compile/render_dom/Block.ts b/src/compiler/compile/render_dom/Block.ts
index 021a7148b8aa..409061570e83 100644
--- a/src/compiler/compile/render_dom/Block.ts
+++ b/src/compiler/compile/render_dom/Block.ts
@@ -461,8 +461,8 @@ export default class Block {
 
 			this.add_variable(dispose);
 
-            this.event_listeners.forEach(event_listener => {
-                event_listener.arguments[2] = x`@attach_error_handler.call(${event_listener.arguments[0]}, #component, ${event_listener.arguments[2]})`;
+            this.event_listeners.forEach((event_listener: any) => {
+                event_listener.arguments[2] = x`@attach_error_handler(${event_listener.arguments[0]}, #component, ${event_listener.arguments[2]})`;
             });
 
 			if (this.event_listeners.length === 1) {
diff --git a/src/runtime/internal/Component.ts b/src/runtime/internal/Component.ts
index 506c4a48f6c3..15d14b3a64d7 100644
--- a/src/runtime/internal/Component.ts
+++ b/src/runtime/internal/Component.ts
@@ -106,10 +106,10 @@ function make_dirty(component, i) {
 	component.$$.dirty[(i / 31) | 0] |= (1 << (i % 31));
 }
 
-export function attach_error_handler(component, fn) {
+export function attach_error_handler(that: any, component, fn) {
     return (...rest) => {
         try {
-            fn.call(this, ...rest);
+            fn.call(that, ...rest);
         } catch (e) {
             handle_error(component, e);
         }

From 6728df8a097e60218d10d462928388080c13d8e8 Mon Sep 17 00:00:00 2001
From: rster20002 <rster2002dev@gmail.com>
Date: Wed, 28 Jul 2021 15:30:33 +0200
Subject: [PATCH 05/21] Fixed variables scoping in component try catch block

---
 src/compiler/compile/render_dom/Block.ts | 17 +++++++++++++----
 src/compiler/compile/render_dom/index.ts | 21 +++++++++++++--------
 2 files changed, 26 insertions(+), 12 deletions(-)

diff --git a/src/compiler/compile/render_dom/Block.ts b/src/compiler/compile/render_dom/Block.ts
index 409061570e83..9aa4905dbf70 100644
--- a/src/compiler/compile/render_dom/Block.ts
+++ b/src/compiler/compile/render_dom/Block.ts
@@ -388,15 +388,24 @@ export default class Block {
 
 		const block = dev && this.get_unique_name('block');
 
+        console.log(this.variables.values());
+        // console.log(x`@handle_error(#component, e)`);
+
 		const body = b`
 			${this.chunks.declarations}
 
-			${Array.from(this.variables.values()).map(({ id, init }) => {
-				return init
-					? b`let ${id} = ${init}`
-					: b`let ${id}`;
+			${Array.from(this.variables.values()).map(({ id }) => {
+				return b`let ${id}`;
 			})}
 
+            try {
+                ${Array.from(this.variables.values()).filter(({ init }) => init !== undefined).map(({ id, init }) => {
+                    return b`${id} = ${init}`;
+                })}
+            } catch (e) {
+                @handle_error(#component, e);
+            }
+
 			${this.chunks.init}
 
 			${dev
diff --git a/src/compiler/compile/render_dom/index.ts b/src/compiler/compile/render_dom/index.ts
index c8e41c55f368..a7cc4e7c7493 100644
--- a/src/compiler/compile/render_dom/index.ts
+++ b/src/compiler/compile/render_dom/index.ts
@@ -442,13 +442,7 @@ export default function dom(
 			`;
 		}
 
-		const return_value = {
-			type: 'ArrayExpression',
-			elements: renderer.initial_context.map(member => ({
-				type: 'Identifier',
-				name: member.name
-			}) as Expression)
-		};
+        const return_value_reference = b`let return_values = []`;
 
         const instance_try_block: any = b`
             try {}
@@ -457,7 +451,16 @@ export default function dom(
             }
         `;
 
+		const return_value = {
+			type: 'ArrayExpression',
+			elements: renderer.initial_context.map(member => ({
+				type: 'Identifier',
+				name: member.name
+			}) as Expression)
+		};
+
         instance_try_block[0].block.body = instance_javascript.flat();
+        instance_try_block[0].block.body.push(x`return_values = ${return_value}`);
 
 		body.push(b`
 			function ${definition}(${args}) {
@@ -475,6 +478,8 @@ export default function dom(
 				${component.compile_options.dev && b`@validate_slots('${component.tag}', #slots, [${[...component.slots.keys()].map(key => `'${key}'`).join(',')}]);`}
 				${compute_slots}
 
+                ${return_value_reference}
+
 				${instance_try_block}
 
 				${unknown_props_check}
@@ -501,7 +506,7 @@ export default function dom(
 
 				${uses_props && b`$$props = @exclude_internal_props($$props);`}
 
-				return ${return_value};
+				return return_values;
 			}
 		`);
 	}

From 444359b1729a1c64ee34b8aeb26bf810add449da Mon Sep 17 00:00:00 2001
From: rster20002 <rster2002dev@gmail.com>
Date: Wed, 28 Jul 2021 17:49:54 +0200
Subject: [PATCH 06/21] Fixed props not being scoped correctly

Disabled some of the working changes
---
 src/compiler/compile/render_dom/Block.ts |  5 +-
 src/compiler/compile/render_dom/index.ts | 69 ++++++++++++------------
 2 files changed, 35 insertions(+), 39 deletions(-)

diff --git a/src/compiler/compile/render_dom/Block.ts b/src/compiler/compile/render_dom/Block.ts
index 9aa4905dbf70..4f7def88a417 100644
--- a/src/compiler/compile/render_dom/Block.ts
+++ b/src/compiler/compile/render_dom/Block.ts
@@ -388,9 +388,6 @@ export default class Block {
 
 		const block = dev && this.get_unique_name('block');
 
-        console.log(this.variables.values());
-        // console.log(x`@handle_error(#component, e)`);
-
 		const body = b`
 			${this.chunks.declarations}
 
@@ -403,7 +400,7 @@ export default class Block {
                     return b`${id} = ${init}`;
                 })}
             } catch (e) {
-                @handle_error(#component, e);
+                // @handle_error(#component, e);
             }
 
 			${this.chunks.init}
diff --git a/src/compiler/compile/render_dom/index.ts b/src/compiler/compile/render_dom/index.ts
index a7cc4e7c7493..28dc3b52fa85 100644
--- a/src/compiler/compile/render_dom/index.ts
+++ b/src/compiler/compile/render_dom/index.ts
@@ -444,13 +444,6 @@ export default function dom(
 
         const return_value_reference = b`let return_values = []`;
 
-        const instance_try_block: any = b`
-            try {}
-            catch(e) {
-                @handle_error($$self, e);
-            }
-        `;
-
 		const return_value = {
 			type: 'ArrayExpression',
 			elements: renderer.initial_context.map(member => ({
@@ -459,8 +452,40 @@ export default function dom(
 			}) as Expression)
 		};
 
-        instance_try_block[0].block.body = instance_javascript.flat();
-        instance_try_block[0].block.body.push(x`return_values = ${return_value}`);
+        const instance_try_block: any = b`
+            try {
+                ${instance_javascript}
+
+                ${unknown_props_check}
+
+                ${renderer.binding_groups.size > 0 && b`const $$binding_groups = [${[...renderer.binding_groups.keys()].map(_ => x`[]`)}];`}
+
+                ${component.partly_hoisted}
+
+                ${set && b`$$self.$$set = ${set};`}
+
+                ${capture_state && b`$$self.$capture_state = ${capture_state};`}
+
+                ${inject_state && b`$$self.$inject_state = ${inject_state};`}
+
+                ${/* before reactive declarations */ props_inject}
+
+                ${reactive_declarations.length > 0 && b`
+                $$self.$$.update = () => {
+                    ${reactive_declarations}
+                };
+                `}
+
+                ${fixed_reactive_declarations}
+
+                ${uses_props && b`$$props = @exclude_internal_props($$props);`}
+
+                return ${return_value}
+            }
+            catch(e) {
+                @handle_error($$self, e);
+            }
+        `;
 
 		body.push(b`
 			function ${definition}(${args}) {
@@ -481,32 +506,6 @@ export default function dom(
                 ${return_value_reference}
 
 				${instance_try_block}
-
-				${unknown_props_check}
-
-				${renderer.binding_groups.size > 0 && b`const $$binding_groups = [${[...renderer.binding_groups.keys()].map(_ => x`[]`)}];`}
-
-				${component.partly_hoisted}
-
-				${set && b`$$self.$$set = ${set};`}
-
-				${capture_state && b`$$self.$capture_state = ${capture_state};`}
-
-				${inject_state && b`$$self.$inject_state = ${inject_state};`}
-
-				${/* before reactive declarations */ props_inject}
-
-				${reactive_declarations.length > 0 && b`
-				$$self.$$.update = () => {
-					${reactive_declarations}
-				};
-				`}
-
-				${fixed_reactive_declarations}
-
-				${uses_props && b`$$props = @exclude_internal_props($$props);`}
-
-				return return_values;
 			}
 		`);
 	}

From 068405191eeaf95cf5587a9dbcc19bb9abf664dc Mon Sep 17 00:00:00 2001
From: rster20002 <rster2002dev@gmail.com>
Date: Thu, 29 Jul 2021 08:57:32 +0200
Subject: [PATCH 07/21] Fixed issue caused by if statements

Changed how component is accessed when attaching error handler to a listener
---
 src/compiler/compile/render_dom/Block.ts | 2 +-
 src/compiler/compile/render_dom/index.ts | 2 +-
 src/runtime/internal/Component.ts        | 2 +-
 3 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/compiler/compile/render_dom/Block.ts b/src/compiler/compile/render_dom/Block.ts
index 4f7def88a417..00440b71f3c1 100644
--- a/src/compiler/compile/render_dom/Block.ts
+++ b/src/compiler/compile/render_dom/Block.ts
@@ -468,7 +468,7 @@ export default class Block {
 			this.add_variable(dispose);
 
             this.event_listeners.forEach((event_listener: any) => {
-                event_listener.arguments[2] = x`@attach_error_handler(${event_listener.arguments[0]}, #component, ${event_listener.arguments[2]})`;
+                event_listener.arguments[2] = x`@attach_error_handler(${event_listener.arguments[0]}, @get_current_component(), ${event_listener.arguments[2]})`;
             });
 
 			if (this.event_listeners.length === 1) {
diff --git a/src/compiler/compile/render_dom/index.ts b/src/compiler/compile/render_dom/index.ts
index 28dc3b52fa85..68bff74f90fa 100644
--- a/src/compiler/compile/render_dom/index.ts
+++ b/src/compiler/compile/render_dom/index.ts
@@ -329,7 +329,7 @@ export default function dom(
 	const has_create_fragment = component.compile_options.dev || block.has_content();
 	if (has_create_fragment) {
 		body.push(b`
-			function create_fragment(#ctx, #component) {
+			function create_fragment(#ctx) {
 				${block.get_contents()}
 			}
 		`);
diff --git a/src/runtime/internal/Component.ts b/src/runtime/internal/Component.ts
index 15d14b3a64d7..f3c763228d13 100644
--- a/src/runtime/internal/Component.ts
+++ b/src/runtime/internal/Component.ts
@@ -189,7 +189,7 @@ export function init(component, options, instance, create_fragment, not_equal, p
 	run_all($$.before_update);
 
 	// `false` as a special case of no DOM component
-	$$.fragment = create_fragment ? create_fragment($$.ctx, component) : false;
+	$$.fragment = create_fragment ? create_fragment($$.ctx) : false;
 
 	if (options.target) {
 		if (options.hydrate) {

From e71ca48735694a703f9d72ad5dd92d25a94e83b4 Mon Sep 17 00:00:00 2001
From: rster20002 <rster2002dev@gmail.com>
Date: Thu, 29 Jul 2021 09:16:14 +0200
Subject: [PATCH 08/21] Template errors are now catched (within {})

Fixed posability for there to be an empty try block
---
 src/compiler/compile/render_dom/Block.ts | 18 ++++++++++++------
 1 file changed, 12 insertions(+), 6 deletions(-)

diff --git a/src/compiler/compile/render_dom/Block.ts b/src/compiler/compile/render_dom/Block.ts
index 00440b71f3c1..ab8f06cfbf8e 100644
--- a/src/compiler/compile/render_dom/Block.ts
+++ b/src/compiler/compile/render_dom/Block.ts
@@ -388,6 +388,10 @@ export default class Block {
 
 		const block = dev && this.get_unique_name('block');
 
+        let init_statements = Array.from(this.variables.values()).filter(({ init }) => init !== undefined).map(({ id, init }) => {
+            return b`${id} = ${init}`;
+        });
+
 		const body = b`
 			${this.chunks.declarations}
 
@@ -395,12 +399,14 @@ export default class Block {
 				return b`let ${id}`;
 			})}
 
-            try {
-                ${Array.from(this.variables.values()).filter(({ init }) => init !== undefined).map(({ id, init }) => {
-                    return b`${id} = ${init}`;
-                })}
-            } catch (e) {
-                // @handle_error(#component, e);
+            ${init_statements.length > 0
+                ? b`
+                    try {
+                        ${init_statements}
+                    } catch (e) {
+                        @handle_error(@get_current_component(), e);
+                    }`
+                : ''
             }
 
 			${this.chunks.init}

From 81e8ff5cfbd63e684a7fe1f79e7b57a4fd587690 Mon Sep 17 00:00:00 2001
From: rster20002 <rster2002dev@gmail.com>
Date: Thu, 29 Jul 2021 15:05:08 +0200
Subject: [PATCH 09/21] Errors from slots bubble to the provider component

---
 .../wrappers/InlineComponent/index.ts         |  4 ++++
 src/runtime/internal/Component.ts             | 23 +++++++++++--------
 2 files changed, 17 insertions(+), 10 deletions(-)

diff --git a/src/compiler/compile/render_dom/wrappers/InlineComponent/index.ts b/src/compiler/compile/render_dom/wrappers/InlineComponent/index.ts
index e6eab33fbdee..931735229020 100644
--- a/src/compiler/compile/render_dom/wrappers/InlineComponent/index.ts
+++ b/src/compiler/compile/render_dom/wrappers/InlineComponent/index.ts
@@ -192,6 +192,10 @@ export default class InlineComponentWrapper extends Wrapper {
 			component_opts.properties.push(p`$$inline: true`);
 		}
 
+        if (block.type === "slot") {
+            component_opts.properties.push(p`$$in_slot: true`);
+        }
+
 		const fragment_dependencies = new Set(this.slots.size ? ['$$scope'] : []);
 		this.slots.forEach(slot => {
 			slot.block.dependencies.forEach(name => {
diff --git a/src/runtime/internal/Component.ts b/src/runtime/internal/Component.ts
index f3c763228d13..29289470228d 100644
--- a/src/runtime/internal/Component.ts
+++ b/src/runtime/internal/Component.ts
@@ -116,23 +116,25 @@ export function attach_error_handler(that: any, component, fn) {
     };
 }
 
-export function handle_error(component, e) {
-    if (component.$$.on_error.length === 0) {
+export function handle_error(component, e, skip = false) {
+    if (component.$$.on_error.length === 0 || skip) {
         bubble_error(component, e);
     }
 
-    component.$$.on_error.forEach(handler => {
-        try {
-            handler(e);
-        } catch (e) {
-            bubble_error(component, e);
-        }
-    });
+    if (!skip) {
+        component.$$.on_error.forEach(handler => {
+            try {
+                handler(e);
+            } catch (e) {
+                bubble_error(component, e);
+            }
+        });
+    }
 }
 
 function bubble_error(component, e) {
     if (component.$$.parent_component) {
-        handle_error(component.$$.parent_component, e);
+        handle_error(component.$$.parent_component, e, component.$$.in_slot);
     } else {
         throw e;
     }
@@ -166,6 +168,7 @@ export function init(component, options, instance, create_fragment, not_equal, p
 		dirty,
 		skip_bound: false,
 		root: options.target || parent_component.$$.root,
+        in_slot: options.$$in_slot || false,
         parent_component
 	};
 

From faea31a19de7c93122dbbdac66708b7e71741ac6 Mon Sep 17 00:00:00 2001
From: rster20002 <rster2002dev@gmail.com>
Date: Thu, 29 Jul 2021 15:08:44 +0200
Subject: [PATCH 10/21] Fixed lint errors

---
 src/compiler/compile/render_dom/Block.ts                        | 2 +-
 .../compile/render_dom/wrappers/InlineComponent/index.ts        | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/compiler/compile/render_dom/Block.ts b/src/compiler/compile/render_dom/Block.ts
index ab8f06cfbf8e..3d149275e720 100644
--- a/src/compiler/compile/render_dom/Block.ts
+++ b/src/compiler/compile/render_dom/Block.ts
@@ -388,7 +388,7 @@ export default class Block {
 
 		const block = dev && this.get_unique_name('block');
 
-        let init_statements = Array.from(this.variables.values()).filter(({ init }) => init !== undefined).map(({ id, init }) => {
+        const init_statements = Array.from(this.variables.values()).filter(({ init }) => init !== undefined).map(({ id, init }) => {
             return b`${id} = ${init}`;
         });
 
diff --git a/src/compiler/compile/render_dom/wrappers/InlineComponent/index.ts b/src/compiler/compile/render_dom/wrappers/InlineComponent/index.ts
index 931735229020..4037e4f4b8b8 100644
--- a/src/compiler/compile/render_dom/wrappers/InlineComponent/index.ts
+++ b/src/compiler/compile/render_dom/wrappers/InlineComponent/index.ts
@@ -192,7 +192,7 @@ export default class InlineComponentWrapper extends Wrapper {
 			component_opts.properties.push(p`$$inline: true`);
 		}
 
-        if (block.type === "slot") {
+        if (block.type === 'slot') {
             component_opts.properties.push(p`$$in_slot: true`);
         }
 

From e14d3a6c7a1fde96b8431ccd05d52461e6257c5a Mon Sep 17 00:00:00 2001
From: rster20002 <rster2002dev@gmail.com>
Date: Fri, 30 Jul 2021 11:04:33 +0200
Subject: [PATCH 11/21] Add initial tests

---
 .../_config.js                                |  5 +++++
 .../child.svelte                              | 10 +++++++++
 .../main.svelte                               |  9 ++++++++
 .../_config.js                                |  5 +++++
 .../child.svelte                              |  4 ++++
 .../main.svelte                               |  9 ++++++++
 .../_config.js                                |  5 +++++
 .../main.svelte                               | 12 ++++++++++
 .../_config.js                                |  5 +++++
 .../main.svelte                               | 12 ++++++++++
 .../_config.js                                | 11 ++++++++++
 .../main.svelte                               | 18 +++++++++++++++
 .../samples/error-handling-event/_config.js   | 10 +++++++++
 .../samples/error-handling-event/main.svelte  | 16 ++++++++++++++
 .../_config.js                                | 10 +++++++++
 .../main.svelte                               | 22 +++++++++++++++++++
 .../error-handling-template/_config.js        |  5 +++++
 .../error-handling-template/main.svelte       | 12 ++++++++++
 18 files changed, 180 insertions(+)
 create mode 100644 test/runtime/samples/error-handling-bubble-to-parent-manually/_config.js
 create mode 100644 test/runtime/samples/error-handling-bubble-to-parent-manually/child.svelte
 create mode 100644 test/runtime/samples/error-handling-bubble-to-parent-manually/main.svelte
 create mode 100644 test/runtime/samples/error-handling-bubble-to-parent/_config.js
 create mode 100644 test/runtime/samples/error-handling-bubble-to-parent/child.svelte
 create mode 100644 test/runtime/samples/error-handling-bubble-to-parent/main.svelte
 create mode 100644 test/runtime/samples/error-handling-catch-after-error/_config.js
 create mode 100644 test/runtime/samples/error-handling-catch-after-error/main.svelte
 create mode 100644 test/runtime/samples/error-handling-catch-before-error/_config.js
 create mode 100644 test/runtime/samples/error-handling-catch-before-error/main.svelte
 create mode 100644 test/runtime/samples/error-handling-event-correct-this/_config.js
 create mode 100644 test/runtime/samples/error-handling-event-correct-this/main.svelte
 create mode 100644 test/runtime/samples/error-handling-event/_config.js
 create mode 100644 test/runtime/samples/error-handling-event/main.svelte
 create mode 100644 test/runtime/samples/error-handling-template-reactive/_config.js
 create mode 100644 test/runtime/samples/error-handling-template-reactive/main.svelte
 create mode 100644 test/runtime/samples/error-handling-template/_config.js
 create mode 100644 test/runtime/samples/error-handling-template/main.svelte

diff --git a/test/runtime/samples/error-handling-bubble-to-parent-manually/_config.js b/test/runtime/samples/error-handling-bubble-to-parent-manually/_config.js
new file mode 100644
index 000000000000..acd4e2a2f0f4
--- /dev/null
+++ b/test/runtime/samples/error-handling-bubble-to-parent-manually/_config.js
@@ -0,0 +1,5 @@
+export default {
+    test({ assert, component }) {
+        assert.equal(component.error, true);
+    }
+}
\ No newline at end of file
diff --git a/test/runtime/samples/error-handling-bubble-to-parent-manually/child.svelte b/test/runtime/samples/error-handling-bubble-to-parent-manually/child.svelte
new file mode 100644
index 000000000000..36cedc81a479
--- /dev/null
+++ b/test/runtime/samples/error-handling-bubble-to-parent-manually/child.svelte
@@ -0,0 +1,10 @@
+<script>
+    import { onError } from "svelte";
+
+    onError(e => {
+        throw e;
+    });
+
+    var a = {};
+    console.log(a.b.c);
+</script>
\ No newline at end of file
diff --git a/test/runtime/samples/error-handling-bubble-to-parent-manually/main.svelte b/test/runtime/samples/error-handling-bubble-to-parent-manually/main.svelte
new file mode 100644
index 000000000000..5c7caa7dc9c2
--- /dev/null
+++ b/test/runtime/samples/error-handling-bubble-to-parent-manually/main.svelte
@@ -0,0 +1,9 @@
+<script>
+    import { onError } from "svelte";
+
+    var error = false;
+
+    onError(e => {
+        error = true;
+    });
+</script>
\ No newline at end of file
diff --git a/test/runtime/samples/error-handling-bubble-to-parent/_config.js b/test/runtime/samples/error-handling-bubble-to-parent/_config.js
new file mode 100644
index 000000000000..acd4e2a2f0f4
--- /dev/null
+++ b/test/runtime/samples/error-handling-bubble-to-parent/_config.js
@@ -0,0 +1,5 @@
+export default {
+    test({ assert, component }) {
+        assert.equal(component.error, true);
+    }
+}
\ No newline at end of file
diff --git a/test/runtime/samples/error-handling-bubble-to-parent/child.svelte b/test/runtime/samples/error-handling-bubble-to-parent/child.svelte
new file mode 100644
index 000000000000..19c327680a37
--- /dev/null
+++ b/test/runtime/samples/error-handling-bubble-to-parent/child.svelte
@@ -0,0 +1,4 @@
+<script>
+    var a = {};
+    console.log(a.b.c);
+</script>
\ No newline at end of file
diff --git a/test/runtime/samples/error-handling-bubble-to-parent/main.svelte b/test/runtime/samples/error-handling-bubble-to-parent/main.svelte
new file mode 100644
index 000000000000..5c7caa7dc9c2
--- /dev/null
+++ b/test/runtime/samples/error-handling-bubble-to-parent/main.svelte
@@ -0,0 +1,9 @@
+<script>
+    import { onError } from "svelte";
+
+    var error = false;
+
+    onError(e => {
+        error = true;
+    });
+</script>
\ No newline at end of file
diff --git a/test/runtime/samples/error-handling-catch-after-error/_config.js b/test/runtime/samples/error-handling-catch-after-error/_config.js
new file mode 100644
index 000000000000..acd4e2a2f0f4
--- /dev/null
+++ b/test/runtime/samples/error-handling-catch-after-error/_config.js
@@ -0,0 +1,5 @@
+export default {
+    test({ assert, component }) {
+        assert.equal(component.error, true);
+    }
+}
\ No newline at end of file
diff --git a/test/runtime/samples/error-handling-catch-after-error/main.svelte b/test/runtime/samples/error-handling-catch-after-error/main.svelte
new file mode 100644
index 000000000000..a5fdb5dfd89d
--- /dev/null
+++ b/test/runtime/samples/error-handling-catch-after-error/main.svelte
@@ -0,0 +1,12 @@
+<script>
+    import { onError } from "svelte";
+
+    var a = {};
+    export var error = false;
+
+    a.b.c
+
+    onError(e => {
+        error = true;
+    });
+</script>
\ No newline at end of file
diff --git a/test/runtime/samples/error-handling-catch-before-error/_config.js b/test/runtime/samples/error-handling-catch-before-error/_config.js
new file mode 100644
index 000000000000..acd4e2a2f0f4
--- /dev/null
+++ b/test/runtime/samples/error-handling-catch-before-error/_config.js
@@ -0,0 +1,5 @@
+export default {
+    test({ assert, component }) {
+        assert.equal(component.error, true);
+    }
+}
\ No newline at end of file
diff --git a/test/runtime/samples/error-handling-catch-before-error/main.svelte b/test/runtime/samples/error-handling-catch-before-error/main.svelte
new file mode 100644
index 000000000000..f00560400380
--- /dev/null
+++ b/test/runtime/samples/error-handling-catch-before-error/main.svelte
@@ -0,0 +1,12 @@
+<script>
+    import { onError } from "svelte";
+
+    var a = {};
+    export var error = false;
+
+    onError(e => {
+        error = true;
+    });
+
+    a.b.c
+</script>
\ No newline at end of file
diff --git a/test/runtime/samples/error-handling-event-correct-this/_config.js b/test/runtime/samples/error-handling-event-correct-this/_config.js
new file mode 100644
index 000000000000..3f90d0b5cc52
--- /dev/null
+++ b/test/runtime/samples/error-handling-event-correct-this/_config.js
@@ -0,0 +1,11 @@
+export default {
+    async test({ assert, component, target, window }) {
+        const button = target.querySelector('button');
+        const event = new window.MouseEvent('click');
+
+        await button.dispatchEvent(event);
+
+        assert.equal(component.error, true);
+        assert.equal(component.that, button);
+    }
+}
\ No newline at end of file
diff --git a/test/runtime/samples/error-handling-event-correct-this/main.svelte b/test/runtime/samples/error-handling-event-correct-this/main.svelte
new file mode 100644
index 000000000000..89fe5e86a4ed
--- /dev/null
+++ b/test/runtime/samples/error-handling-event-correct-this/main.svelte
@@ -0,0 +1,18 @@
+<script>
+    import { onError } from "svelte";
+
+    var a = {};
+    var that;
+    export var error = false;
+
+    onError(e => {
+        error = true;
+    });
+
+    function clickEvent() {
+        that = this;
+        console.log(a.b.c);
+    }
+</script>
+
+<button on:click={clickEvent}></button>
\ No newline at end of file
diff --git a/test/runtime/samples/error-handling-event/_config.js b/test/runtime/samples/error-handling-event/_config.js
new file mode 100644
index 000000000000..edd0bd074bf3
--- /dev/null
+++ b/test/runtime/samples/error-handling-event/_config.js
@@ -0,0 +1,10 @@
+export default {
+    async test({ assert, component, target, window }) {
+        const button = target.querySelector('button');
+        const event = new window.MouseEvent('click');
+
+        await button.dispatchEvent(event);
+
+        assert.equal(component.error, true);
+    }
+}
\ No newline at end of file
diff --git a/test/runtime/samples/error-handling-event/main.svelte b/test/runtime/samples/error-handling-event/main.svelte
new file mode 100644
index 000000000000..18f89a2b2c68
--- /dev/null
+++ b/test/runtime/samples/error-handling-event/main.svelte
@@ -0,0 +1,16 @@
+<script>
+    import { onError } from "svelte";
+
+    var a = {};
+    export var error = false;
+
+    onError(e => {
+        error = true;
+    });
+
+    function clickEvent() {
+        console.log(a.b.c);
+    }
+</script>
+
+<button on:click={clickEvent}></button>
\ No newline at end of file
diff --git a/test/runtime/samples/error-handling-template-reactive/_config.js b/test/runtime/samples/error-handling-template-reactive/_config.js
new file mode 100644
index 000000000000..edd0bd074bf3
--- /dev/null
+++ b/test/runtime/samples/error-handling-template-reactive/_config.js
@@ -0,0 +1,10 @@
+export default {
+    async test({ assert, component, target, window }) {
+        const button = target.querySelector('button');
+        const event = new window.MouseEvent('click');
+
+        await button.dispatchEvent(event);
+
+        assert.equal(component.error, true);
+    }
+}
\ No newline at end of file
diff --git a/test/runtime/samples/error-handling-template-reactive/main.svelte b/test/runtime/samples/error-handling-template-reactive/main.svelte
new file mode 100644
index 000000000000..425d59046a3f
--- /dev/null
+++ b/test/runtime/samples/error-handling-template-reactive/main.svelte
@@ -0,0 +1,22 @@
+<script>
+    import { onError } from "svelte";
+
+    var a = {
+        b: {
+            c: 10
+        }
+    };
+    export var error = false;
+
+    onError(e => {
+        error = true;
+    });
+
+    function causeError() {
+        a = {};
+    }
+</script>
+
+{a.b.c}
+
+<button on:click={causeError}></button>
\ No newline at end of file
diff --git a/test/runtime/samples/error-handling-template/_config.js b/test/runtime/samples/error-handling-template/_config.js
new file mode 100644
index 000000000000..acd4e2a2f0f4
--- /dev/null
+++ b/test/runtime/samples/error-handling-template/_config.js
@@ -0,0 +1,5 @@
+export default {
+    test({ assert, component }) {
+        assert.equal(component.error, true);
+    }
+}
\ No newline at end of file
diff --git a/test/runtime/samples/error-handling-template/main.svelte b/test/runtime/samples/error-handling-template/main.svelte
new file mode 100644
index 000000000000..461211a87d26
--- /dev/null
+++ b/test/runtime/samples/error-handling-template/main.svelte
@@ -0,0 +1,12 @@
+<script>
+    import { onError } from "svelte";
+
+    var a = {};
+    export var error = false;
+
+    onError(e => {
+        error = true;
+    });
+</script>
+
+{a.b.c}
\ No newline at end of file

From 967e14e0ad45127e196a1f35d1f50aa3cfbe0cd5 Mon Sep 17 00:00:00 2001
From: rster20002 <rster2002dev@gmail.com>
Date: Sat, 31 Jul 2021 10:45:57 +0200
Subject: [PATCH 12/21] Fixed initial tests

---
 src/compiler/compile/render_dom/Block.ts      |  7 ++-
 src/compiler/compile/render_dom/index.ts      | 43 +++++++++++++++++--
 src/compiler/compile/render_ssr/index.ts      | 14 +++++-
 src/runtime/internal/ssr.ts                   |  2 +
 .../main.svelte                               |  7 ++-
 .../main.svelte                               |  7 ++-
 .../main.svelte                               |  2 +-
 7 files changed, 70 insertions(+), 12 deletions(-)

diff --git a/src/compiler/compile/render_dom/Block.ts b/src/compiler/compile/render_dom/Block.ts
index 3d149275e720..7e3249a31ef1 100644
--- a/src/compiler/compile/render_dom/Block.ts
+++ b/src/compiler/compile/render_dom/Block.ts
@@ -316,7 +316,12 @@ export default class Block {
 
 				properties.update = x`function #update(${ctx}, ${dirty}) {
 					${this.maintain_context && b`#ctx = ${ctx};`}
-					${this.chunks.update}
+					
+                    try {
+                        ${this.chunks.update}
+                    } catch (e) {
+                        @handle_error(@get_current_component(), e);
+                    }
 				}`;
 			}
 		}
diff --git a/src/compiler/compile/render_dom/index.ts b/src/compiler/compile/render_dom/index.ts
index 68bff74f90fa..cebc42ecd0f1 100644
--- a/src/compiler/compile/render_dom/index.ts
+++ b/src/compiler/compile/render_dom/index.ts
@@ -6,7 +6,7 @@ import { walk } from 'estree-walker';
 import { extract_names, Scope } from 'periscopic';
 import { invalidate } from './invalidate';
 import Block from './Block';
-import { ImportDeclaration, ClassDeclaration, FunctionExpression, Node, Statement, ObjectExpression, Expression } from 'estree';
+import { ImportDeclaration, ClassDeclaration, FunctionExpression, Node, Statement, ObjectExpression, Expression, Identifier } from 'estree';
 import { apply_preprocessor_sourcemap } from '../../utils/mapped_code';
 import { RawSourceMap, DecodedSourceMap } from '@ampproject/remapping/dist/types/types';
 import { flatten } from '../../utils/flatten';
@@ -442,7 +442,7 @@ export default function dom(
 			`;
 		}
 
-        const return_value_reference = b`let return_values = []`;
+        const return_value_reference = b`let #return_values = []`;
 
 		const return_value = {
 			type: 'ArrayExpression',
@@ -451,10 +451,42 @@ export default function dom(
 				name: member.name
 			}) as Expression)
 		};
+        
+        let instance_javascript_with_ctx = [];
+        let initializedIdentifiers = [];
+        instance_javascript.forEach(node => {
+            instance_javascript_with_ctx.push(node);
+
+            if (Array.isArray(node) && node[0].type === "VariableDeclaration" ) {
+                walk(node[0], {
+                    enter(declaration: Identifier) {
+                        if (declaration.type === 'Identifier' && !initializedIdentifiers.includes(declaration.name)) {
+                            let index = renderer.initial_context.findIndex(member => member.name === declaration.name);
+
+                            if (index >= 0) {
+                                node.push(x`#return_values[${index}] = ${declaration}`);
+                                initializedIdentifiers.push(declaration.name);
+                            }
+                        }
+                    }
+                });
+            }
+
+            if (node.type === "FunctionDeclaration") {
+                if (!initializedIdentifiers.includes(node.id.name)) {
+                    let index = renderer.initial_context.findIndex(member => member.name === node.id.name);
+
+                    if (index >= 0) {
+                        instance_javascript_with_ctx.push(x`#return_values[${index}] = ${node.id.name}`);
+                        initializedIdentifiers.push(node.id.name);
+                    }
+                }
+            }
+        });
 
         const instance_try_block: any = b`
             try {
-                ${instance_javascript}
+                ${instance_javascript_with_ctx}
 
                 ${unknown_props_check}
 
@@ -480,10 +512,13 @@ export default function dom(
 
                 ${uses_props && b`$$props = @exclude_internal_props($$props);`}
 
-                return ${return_value}
+                #return_values = ${return_value}
+                return #return_values;
             }
             catch(e) {
+                $$self.$$.ctx = #return_values;
                 @handle_error($$self, e);
+                return #return_values;
             }
         `;
 
diff --git a/src/compiler/compile/render_ssr/index.ts b/src/compiler/compile/render_ssr/index.ts
index b35a6ce6ffee..e352b610f97d 100644
--- a/src/compiler/compile/render_ssr/index.ts
+++ b/src/compiler/compile/render_ssr/index.ts
@@ -186,7 +186,11 @@ export default function ssr(
 
 			${reactive_store_unsubscriptions}
 
-			return ${literal};`;
+			try {
+                return ${literal};
+            } catch (e) {
+                @handle_error(@get_current_component(), e);
+            }`;
 
 	const blocks = [
 		...injected.map(name => b`let ${name};`),
@@ -194,7 +198,13 @@ export default function ssr(
 		slots,
 		...reactive_store_declarations,
 		...reactive_store_subscriptions,
-		instance_javascript,
+		b`
+            try {
+                ${instance_javascript}
+            } catch (e) {
+                @handle_error(@get_current_component(), e);
+            }
+        `,
 		...parent_bindings,
 		css.code && b`$$result.css.add(#css);`,
 		main
diff --git a/src/runtime/internal/ssr.ts b/src/runtime/internal/ssr.ts
index c64d88fa7553..f7d3616d024a 100644
--- a/src/runtime/internal/ssr.ts
+++ b/src/runtime/internal/ssr.ts
@@ -97,6 +97,8 @@ export function create_ssr_component(fn) {
 			on_mount: [],
 			before_update: [],
 			after_update: [],
+            on_error: [],
+            parent_component,
 			callbacks: blank_object()
 		};
 
diff --git a/test/runtime/samples/error-handling-bubble-to-parent-manually/main.svelte b/test/runtime/samples/error-handling-bubble-to-parent-manually/main.svelte
index 5c7caa7dc9c2..8a7621bd24c8 100644
--- a/test/runtime/samples/error-handling-bubble-to-parent-manually/main.svelte
+++ b/test/runtime/samples/error-handling-bubble-to-parent-manually/main.svelte
@@ -1,9 +1,12 @@
 <script>
+    import Child from "./child.svelte";
     import { onError } from "svelte";
 
-    var error = false;
+    export var error = false;
 
     onError(e => {
         error = true;
     });
-</script>
\ No newline at end of file
+</script>
+
+<Child />
\ No newline at end of file
diff --git a/test/runtime/samples/error-handling-bubble-to-parent/main.svelte b/test/runtime/samples/error-handling-bubble-to-parent/main.svelte
index 5c7caa7dc9c2..8a7621bd24c8 100644
--- a/test/runtime/samples/error-handling-bubble-to-parent/main.svelte
+++ b/test/runtime/samples/error-handling-bubble-to-parent/main.svelte
@@ -1,9 +1,12 @@
 <script>
+    import Child from "./child.svelte";
     import { onError } from "svelte";
 
-    var error = false;
+    export var error = false;
 
     onError(e => {
         error = true;
     });
-</script>
\ No newline at end of file
+</script>
+
+<Child />
\ No newline at end of file
diff --git a/test/runtime/samples/error-handling-event-correct-this/main.svelte b/test/runtime/samples/error-handling-event-correct-this/main.svelte
index 89fe5e86a4ed..a8760ae348e3 100644
--- a/test/runtime/samples/error-handling-event-correct-this/main.svelte
+++ b/test/runtime/samples/error-handling-event-correct-this/main.svelte
@@ -2,7 +2,7 @@
     import { onError } from "svelte";
 
     var a = {};
-    var that;
+    export var that;
     export var error = false;
 
     onError(e => {

From 648c62790d6fcc89cc606d9b29580e44ad6fc45b Mon Sep 17 00:00:00 2001
From: rster20002 <rster2002dev@gmail.com>
Date: Sat, 31 Jul 2021 21:07:57 +0200
Subject: [PATCH 13/21] Added more specific tests

Temp

temp
---
 src/compiler/compile/render_dom/Block.ts      | 30 +++++++---
 src/compiler/compile/render_dom/index.ts      | 56 ++++++++++---------
 src/compiler/compile/render_ssr/index.ts      | 22 ++++----
 .../_config.js                                |  5 ++
 .../child.svelte                              |  4 ++
 .../main.svelte                               | 12 ++++
 .../_config.js                                |  5 ++
 .../main.svelte                               | 20 +++++++
 .../_config.js                                | 10 ++++
 .../main.svelte                               | 14 +++++
 .../error-handling-each-block/_config.js      |  5 ++
 .../error-handling-each-block/main.svelte     | 14 +++++
 .../_config.js                                | 10 ++++
 .../main.svelte                               | 24 ++++++++
 .../_config.js                                | 10 ++++
 .../child.svelte                              |  4 ++
 .../main.svelte                               | 21 +++++++
 .../error-handling-if-block/_config.js        |  5 ++
 .../error-handling-if-block/main.svelte       | 14 +++++
 .../_config.js                                |  5 ++
 .../child.svelte                              |  4 ++
 .../main.svelte                               | 15 +++++
 .../wrapper.svelte                            |  7 +++
 23 files changed, 274 insertions(+), 42 deletions(-)
 create mode 100644 test/runtime/samples/error-handling-dynamic-component/_config.js
 create mode 100644 test/runtime/samples/error-handling-dynamic-component/child.svelte
 create mode 100644 test/runtime/samples/error-handling-dynamic-component/main.svelte
 create mode 100644 test/runtime/samples/error-handling-each-block-non-array/_config.js
 create mode 100644 test/runtime/samples/error-handling-each-block-non-array/main.svelte
 create mode 100644 test/runtime/samples/error-handling-each-block-reactive-non-array/_config.js
 create mode 100644 test/runtime/samples/error-handling-each-block-reactive-non-array/main.svelte
 create mode 100644 test/runtime/samples/error-handling-each-block/_config.js
 create mode 100644 test/runtime/samples/error-handling-each-block/main.svelte
 create mode 100644 test/runtime/samples/error-handling-if-block-reactive/_config.js
 create mode 100644 test/runtime/samples/error-handling-if-block-reactive/main.svelte
 create mode 100644 test/runtime/samples/error-handling-if-block-show-component/_config.js
 create mode 100644 test/runtime/samples/error-handling-if-block-show-component/child.svelte
 create mode 100644 test/runtime/samples/error-handling-if-block-show-component/main.svelte
 create mode 100644 test/runtime/samples/error-handling-if-block/_config.js
 create mode 100644 test/runtime/samples/error-handling-if-block/main.svelte
 create mode 100644 test/runtime/samples/error-handling-slotted-component/_config.js
 create mode 100644 test/runtime/samples/error-handling-slotted-component/child.svelte
 create mode 100644 test/runtime/samples/error-handling-slotted-component/main.svelte
 create mode 100644 test/runtime/samples/error-handling-slotted-component/wrapper.svelte

diff --git a/src/compiler/compile/render_dom/Block.ts b/src/compiler/compile/render_dom/Block.ts
index 7e3249a31ef1..d568461b1074 100644
--- a/src/compiler/compile/render_dom/Block.ts
+++ b/src/compiler/compile/render_dom/Block.ts
@@ -393,16 +393,34 @@ export default class Block {
 
 		const block = dev && this.get_unique_name('block');
 
-        const init_statements = Array.from(this.variables.values()).filter(({ init }) => init !== undefined).map(({ id, init }) => {
-            return b`${id} = ${init}`;
+        const init_declarations = [];
+        const init_statements = [];
+
+        Array.from(this.variables.values()).forEach(({ id, init }) => {
+            init_declarations.push(b`let ${id};`);
+            
+            if (init) {
+                init_statements.push(b`${id} = ${init}`);
+            }
+        });
+
+        console.log("H");
+        this.chunks.init.forEach(node => {
+            if (Array.isArray(node) && node[0].type === "VariableDeclaration") {
+                node[0].declarations.forEach(({ id, init }) => {
+                    console.log(id);
+                    init_declarations.push(b`let ${id};`);
+                    init_statements.push(b`${id} = ${init}`);
+                });
+            } else {
+                init_declarations.push(node);
+            }
         });
 
 		const body = b`
 			${this.chunks.declarations}
 
-			${Array.from(this.variables.values()).map(({ id }) => {
-				return b`let ${id}`;
-			})}
+			${init_declarations}
 
             ${init_statements.length > 0
                 ? b`
@@ -414,8 +432,6 @@ export default class Block {
                 : ''
             }
 
-			${this.chunks.init}
-
 			${dev
 				? b`
 					const ${block} = ${return_value};
diff --git a/src/compiler/compile/render_dom/index.ts b/src/compiler/compile/render_dom/index.ts
index cebc42ecd0f1..dd1fba8f7a77 100644
--- a/src/compiler/compile/render_dom/index.ts
+++ b/src/compiler/compile/render_dom/index.ts
@@ -454,35 +454,41 @@ export default function dom(
         
         let instance_javascript_with_ctx = [];
         let initializedIdentifiers = [];
-        instance_javascript.forEach(node => {
-            instance_javascript_with_ctx.push(node);
-
-            if (Array.isArray(node) && node[0].type === "VariableDeclaration" ) {
-                walk(node[0], {
-                    enter(declaration: Identifier) {
-                        if (declaration.type === 'Identifier' && !initializedIdentifiers.includes(declaration.name)) {
-                            let index = renderer.initial_context.findIndex(member => member.name === declaration.name);
-
-                            if (index >= 0) {
-                                node.push(x`#return_values[${index}] = ${declaration}`);
-                                initializedIdentifiers.push(declaration.name);
+
+        if (instance_javascript === null) {
+            instance_javascript_with_ctx = instance_javascript;
+        } else {
+            instance_javascript.forEach(node => {
+                instance_javascript_with_ctx.push(node);
+    
+                if (Array.isArray(node) && node[0].type === "VariableDeclaration" ) {
+                    walk(node[0], {
+                        enter(declaration: Identifier) {
+                            if (declaration.type === 'Identifier' && !initializedIdentifiers.includes(declaration.name)) {
+                                let index = renderer.initial_context.findIndex(member => member.name === declaration.name);
+    
+                                if (index >= 0) {
+                                    node.push(x`#return_values[${index}] = ${declaration}`);
+                                    initializedIdentifiers.push(declaration.name);
+                                }
                             }
                         }
-                    }
-                });
-            }
-
-            if (node.type === "FunctionDeclaration") {
-                if (!initializedIdentifiers.includes(node.id.name)) {
-                    let index = renderer.initial_context.findIndex(member => member.name === node.id.name);
-
-                    if (index >= 0) {
-                        instance_javascript_with_ctx.push(x`#return_values[${index}] = ${node.id.name}`);
-                        initializedIdentifiers.push(node.id.name);
+                    });
+                }
+    
+                if (node.type === "FunctionDeclaration") {
+                    if (!initializedIdentifiers.includes(node.id.name)) {
+                        let index = renderer.initial_context.findIndex(member => member.name === node.id.name);
+    
+                        if (index >= 0) {
+                            instance_javascript_with_ctx.push(x`#return_values[${index}] = ${node.id.name}`);
+                            initializedIdentifiers.push(node.id.name);
+                        }
                     }
                 }
-            }
-        });
+            });
+        }
+
 
         const instance_try_block: any = b`
             try {
diff --git a/src/compiler/compile/render_ssr/index.ts b/src/compiler/compile/render_ssr/index.ts
index e352b610f97d..6f85ae98309d 100644
--- a/src/compiler/compile/render_ssr/index.ts
+++ b/src/compiler/compile/render_ssr/index.ts
@@ -182,11 +182,13 @@ export default function ssr(
 			return $$rendered;
 		`
 		: b`
-			${reactive_declarations}
+			try {
+                ${instance_javascript}
 
-			${reactive_store_unsubscriptions}
+                ${reactive_declarations}
+
+                ${reactive_store_unsubscriptions}
 
-			try {
                 return ${literal};
             } catch (e) {
                 @handle_error(@get_current_component(), e);
@@ -198,13 +200,13 @@ export default function ssr(
 		slots,
 		...reactive_store_declarations,
 		...reactive_store_subscriptions,
-		b`
-            try {
-                ${instance_javascript}
-            } catch (e) {
-                @handle_error(@get_current_component(), e);
-            }
-        `,
+		// b`
+        //     try {
+        //         ${instance_javascript}
+        //     } catch (e) {
+        //         @handle_error(@get_current_component(), e);
+        //     }
+        // `,
 		...parent_bindings,
 		css.code && b`$$result.css.add(#css);`,
 		main
diff --git a/test/runtime/samples/error-handling-dynamic-component/_config.js b/test/runtime/samples/error-handling-dynamic-component/_config.js
new file mode 100644
index 000000000000..acd4e2a2f0f4
--- /dev/null
+++ b/test/runtime/samples/error-handling-dynamic-component/_config.js
@@ -0,0 +1,5 @@
+export default {
+    test({ assert, component }) {
+        assert.equal(component.error, true);
+    }
+}
\ No newline at end of file
diff --git a/test/runtime/samples/error-handling-dynamic-component/child.svelte b/test/runtime/samples/error-handling-dynamic-component/child.svelte
new file mode 100644
index 000000000000..19c327680a37
--- /dev/null
+++ b/test/runtime/samples/error-handling-dynamic-component/child.svelte
@@ -0,0 +1,4 @@
+<script>
+    var a = {};
+    console.log(a.b.c);
+</script>
\ No newline at end of file
diff --git a/test/runtime/samples/error-handling-dynamic-component/main.svelte b/test/runtime/samples/error-handling-dynamic-component/main.svelte
new file mode 100644
index 000000000000..5395fbb0d384
--- /dev/null
+++ b/test/runtime/samples/error-handling-dynamic-component/main.svelte
@@ -0,0 +1,12 @@
+<script>
+    import Child from "./child.svelte";
+    import { onError } from "svelte";
+
+    export var error = false;
+
+    onError(e => {
+        error = true;
+    });
+</script>
+
+<svelte:component this={Child} />
\ No newline at end of file
diff --git a/test/runtime/samples/error-handling-each-block-non-array/_config.js b/test/runtime/samples/error-handling-each-block-non-array/_config.js
new file mode 100644
index 000000000000..acd4e2a2f0f4
--- /dev/null
+++ b/test/runtime/samples/error-handling-each-block-non-array/_config.js
@@ -0,0 +1,5 @@
+export default {
+    test({ assert, component }) {
+        assert.equal(component.error, true);
+    }
+}
\ No newline at end of file
diff --git a/test/runtime/samples/error-handling-each-block-non-array/main.svelte b/test/runtime/samples/error-handling-each-block-non-array/main.svelte
new file mode 100644
index 000000000000..b4fb0abca4bf
--- /dev/null
+++ b/test/runtime/samples/error-handling-each-block-non-array/main.svelte
@@ -0,0 +1,20 @@
+<script>
+    import { onError } from "svelte";
+
+    var a = [1, 2, 3];
+    export var error = false;
+    
+    onError(e => {
+        error = true;
+    });
+
+    function handleClick() {
+        a = 10;
+    }
+</script>
+
+{#each a as item}
+    {item}
+{/each}
+
+<button on:click={handleClick}></button>
\ No newline at end of file
diff --git a/test/runtime/samples/error-handling-each-block-reactive-non-array/_config.js b/test/runtime/samples/error-handling-each-block-reactive-non-array/_config.js
new file mode 100644
index 000000000000..edd0bd074bf3
--- /dev/null
+++ b/test/runtime/samples/error-handling-each-block-reactive-non-array/_config.js
@@ -0,0 +1,10 @@
+export default {
+    async test({ assert, component, target, window }) {
+        const button = target.querySelector('button');
+        const event = new window.MouseEvent('click');
+
+        await button.dispatchEvent(event);
+
+        assert.equal(component.error, true);
+    }
+}
\ No newline at end of file
diff --git a/test/runtime/samples/error-handling-each-block-reactive-non-array/main.svelte b/test/runtime/samples/error-handling-each-block-reactive-non-array/main.svelte
new file mode 100644
index 000000000000..0a39d8a0b735
--- /dev/null
+++ b/test/runtime/samples/error-handling-each-block-reactive-non-array/main.svelte
@@ -0,0 +1,14 @@
+<script>
+    import { onError } from "svelte";
+
+    var a = {}
+    export var error = false;
+    
+    onError(e => {
+        error = true;
+    });
+</script>
+
+{#each a.b.c as item}
+    {item}
+{/each}
\ No newline at end of file
diff --git a/test/runtime/samples/error-handling-each-block/_config.js b/test/runtime/samples/error-handling-each-block/_config.js
new file mode 100644
index 000000000000..acd4e2a2f0f4
--- /dev/null
+++ b/test/runtime/samples/error-handling-each-block/_config.js
@@ -0,0 +1,5 @@
+export default {
+    test({ assert, component }) {
+        assert.equal(component.error, true);
+    }
+}
\ No newline at end of file
diff --git a/test/runtime/samples/error-handling-each-block/main.svelte b/test/runtime/samples/error-handling-each-block/main.svelte
new file mode 100644
index 000000000000..0a39d8a0b735
--- /dev/null
+++ b/test/runtime/samples/error-handling-each-block/main.svelte
@@ -0,0 +1,14 @@
+<script>
+    import { onError } from "svelte";
+
+    var a = {}
+    export var error = false;
+    
+    onError(e => {
+        error = true;
+    });
+</script>
+
+{#each a.b.c as item}
+    {item}
+{/each}
\ No newline at end of file
diff --git a/test/runtime/samples/error-handling-if-block-reactive/_config.js b/test/runtime/samples/error-handling-if-block-reactive/_config.js
new file mode 100644
index 000000000000..edd0bd074bf3
--- /dev/null
+++ b/test/runtime/samples/error-handling-if-block-reactive/_config.js
@@ -0,0 +1,10 @@
+export default {
+    async test({ assert, component, target, window }) {
+        const button = target.querySelector('button');
+        const event = new window.MouseEvent('click');
+
+        await button.dispatchEvent(event);
+
+        assert.equal(component.error, true);
+    }
+}
\ No newline at end of file
diff --git a/test/runtime/samples/error-handling-if-block-reactive/main.svelte b/test/runtime/samples/error-handling-if-block-reactive/main.svelte
new file mode 100644
index 000000000000..e3752f2d5eab
--- /dev/null
+++ b/test/runtime/samples/error-handling-if-block-reactive/main.svelte
@@ -0,0 +1,24 @@
+<script>
+    import { onError } from "svelte";
+
+    var a = {
+        b: {
+            c: false
+        }
+    };
+    export var error = false;
+
+    onError(e => {
+        error = true;
+    });
+
+    function clickEvent() {
+        a = {};
+    }
+</script>
+
+<button on:click={clickEvent}></button>
+
+{#if a.b.c === true}
+    Hello world
+{/if}
\ No newline at end of file
diff --git a/test/runtime/samples/error-handling-if-block-show-component/_config.js b/test/runtime/samples/error-handling-if-block-show-component/_config.js
new file mode 100644
index 000000000000..edd0bd074bf3
--- /dev/null
+++ b/test/runtime/samples/error-handling-if-block-show-component/_config.js
@@ -0,0 +1,10 @@
+export default {
+    async test({ assert, component, target, window }) {
+        const button = target.querySelector('button');
+        const event = new window.MouseEvent('click');
+
+        await button.dispatchEvent(event);
+
+        assert.equal(component.error, true);
+    }
+}
\ No newline at end of file
diff --git a/test/runtime/samples/error-handling-if-block-show-component/child.svelte b/test/runtime/samples/error-handling-if-block-show-component/child.svelte
new file mode 100644
index 000000000000..19c327680a37
--- /dev/null
+++ b/test/runtime/samples/error-handling-if-block-show-component/child.svelte
@@ -0,0 +1,4 @@
+<script>
+    var a = {};
+    console.log(a.b.c);
+</script>
\ No newline at end of file
diff --git a/test/runtime/samples/error-handling-if-block-show-component/main.svelte b/test/runtime/samples/error-handling-if-block-show-component/main.svelte
new file mode 100644
index 000000000000..dbfb508df34e
--- /dev/null
+++ b/test/runtime/samples/error-handling-if-block-show-component/main.svelte
@@ -0,0 +1,21 @@
+<script>
+    import Child from "./child.svelte";
+    import { onError } from "svelte";
+
+    var show = false;
+    export var error = false;
+
+    onError(e => {
+        error = true;
+    });
+
+    function clickEvent() {
+        show = true;
+    }
+</script>
+
+<button on:click={clickEvent}></button>
+
+{#if show}
+    <Child />
+{/if}
\ No newline at end of file
diff --git a/test/runtime/samples/error-handling-if-block/_config.js b/test/runtime/samples/error-handling-if-block/_config.js
new file mode 100644
index 000000000000..acd4e2a2f0f4
--- /dev/null
+++ b/test/runtime/samples/error-handling-if-block/_config.js
@@ -0,0 +1,5 @@
+export default {
+    test({ assert, component }) {
+        assert.equal(component.error, true);
+    }
+}
\ No newline at end of file
diff --git a/test/runtime/samples/error-handling-if-block/main.svelte b/test/runtime/samples/error-handling-if-block/main.svelte
new file mode 100644
index 000000000000..e7f50afaf693
--- /dev/null
+++ b/test/runtime/samples/error-handling-if-block/main.svelte
@@ -0,0 +1,14 @@
+<script>
+    import { onError } from "svelte";
+
+    var a = {};
+    export var error = false;
+
+    onError(e => {
+        error = true;
+    });
+</script>
+
+{#if a.b.c === true}
+    Hello world
+{/if}
\ No newline at end of file
diff --git a/test/runtime/samples/error-handling-slotted-component/_config.js b/test/runtime/samples/error-handling-slotted-component/_config.js
new file mode 100644
index 000000000000..acd4e2a2f0f4
--- /dev/null
+++ b/test/runtime/samples/error-handling-slotted-component/_config.js
@@ -0,0 +1,5 @@
+export default {
+    test({ assert, component }) {
+        assert.equal(component.error, true);
+    }
+}
\ No newline at end of file
diff --git a/test/runtime/samples/error-handling-slotted-component/child.svelte b/test/runtime/samples/error-handling-slotted-component/child.svelte
new file mode 100644
index 000000000000..19c327680a37
--- /dev/null
+++ b/test/runtime/samples/error-handling-slotted-component/child.svelte
@@ -0,0 +1,4 @@
+<script>
+    var a = {};
+    console.log(a.b.c);
+</script>
\ No newline at end of file
diff --git a/test/runtime/samples/error-handling-slotted-component/main.svelte b/test/runtime/samples/error-handling-slotted-component/main.svelte
new file mode 100644
index 000000000000..6ad0d0ee88ea
--- /dev/null
+++ b/test/runtime/samples/error-handling-slotted-component/main.svelte
@@ -0,0 +1,15 @@
+<script>
+    import Wrapper from "./wrapper.svelte";
+    import Child from "./child.svelte";
+    import { onError } from "svelte";
+
+    export var error = false;
+
+    onError(e => {
+        error = true;
+    });
+</script>
+
+<Wrapper>
+    <Child />
+</Wrapper>
\ No newline at end of file
diff --git a/test/runtime/samples/error-handling-slotted-component/wrapper.svelte b/test/runtime/samples/error-handling-slotted-component/wrapper.svelte
new file mode 100644
index 000000000000..8c813a7b0e30
--- /dev/null
+++ b/test/runtime/samples/error-handling-slotted-component/wrapper.svelte
@@ -0,0 +1,7 @@
+<script>
+    import { onError } from "svelte";
+
+    onError(e => {});
+</script>
+
+<slot />
\ No newline at end of file

From ad2aba861be981f1c97dced335e9531c2d486500 Mon Sep 17 00:00:00 2001
From: rster20002 <rster2002dev@gmail.com>
Date: Tue, 3 Aug 2021 10:41:49 +0200
Subject: [PATCH 14/21] Fixed added error handling tests

---
 src/compiler/compile/render_dom/Block.ts      | 19 ++++++++++++-------
 src/compiler/compile/render_dom/index.ts      | 10 +++++-----
 src/runtime/internal/dom.ts                   |  4 +++-
 .../_config.js                                |  2 +-
 .../_config.js                                |  2 +-
 .../_config.js                                |  2 +-
 .../_config.js                                |  2 +-
 .../_config.js                                |  2 +-
 .../main.svelte                               | 12 +++---------
 .../_config.js                                |  2 +-
 .../main.svelte                               | 12 +++++++++---
 .../error-handling-each-block/_config.js      |  2 +-
 .../_config.js                                |  2 +-
 .../samples/error-handling-event/_config.js   |  2 +-
 .../_config.js                                |  2 +-
 .../_config.js                                |  2 +-
 .../error-handling-if-block/_config.js        |  2 +-
 .../_config.js                                |  2 +-
 .../child.svelte                              |  0
 .../main.svelte                               |  0
 .../_config.js                                |  2 +-
 .../_config.js                                |  2 +-
 .../error-handling-template/_config.js        |  2 +-
 23 files changed, 48 insertions(+), 41 deletions(-)
 rename test/runtime/samples/{error-handling-bubble-to-parent-manually => error-handling-manually-bubble-to-parent}/_config.js (97%)
 rename test/runtime/samples/{error-handling-bubble-to-parent-manually => error-handling-manually-bubble-to-parent}/child.svelte (100%)
 rename test/runtime/samples/{error-handling-bubble-to-parent-manually => error-handling-manually-bubble-to-parent}/main.svelte (100%)

diff --git a/src/compiler/compile/render_dom/Block.ts b/src/compiler/compile/render_dom/Block.ts
index d568461b1074..5ff5139b38bb 100644
--- a/src/compiler/compile/render_dom/Block.ts
+++ b/src/compiler/compile/render_dom/Block.ts
@@ -404,16 +404,20 @@ export default class Block {
             }
         });
 
-        console.log("H");
         this.chunks.init.forEach(node => {
-            if (Array.isArray(node) && node[0].type === "VariableDeclaration") {
-                node[0].declarations.forEach(({ id, init }) => {
-                    console.log(id);
-                    init_declarations.push(b`let ${id};`);
-                    init_statements.push(b`${id} = ${init}`);
+            if (Array.isArray(node)) {
+                node.forEach((declaration: any) => { // TODO add type to this
+                    if (declaration.declarations) {
+                        declaration.declarations.forEach(({ id, init }) => {
+                            init_declarations.push(b`let ${id}`);
+                            init_statements.push(b`${id} = ${init}`);
+                        });
+                    } else {
+                        init_statements.push(declaration);
+                    }
                 });
             } else {
-                init_declarations.push(node);
+                init_statements.push(node);
             }
         });
 
@@ -428,6 +432,7 @@ export default class Block {
                         ${init_statements}
                     } catch (e) {
                         @handle_error(@get_current_component(), e);
+                        return;
                     }`
                 : ''
             }
diff --git a/src/compiler/compile/render_dom/index.ts b/src/compiler/compile/render_dom/index.ts
index dd1fba8f7a77..226a0d58285d 100644
--- a/src/compiler/compile/render_dom/index.ts
+++ b/src/compiler/compile/render_dom/index.ts
@@ -453,7 +453,7 @@ export default function dom(
 		};
         
         let instance_javascript_with_ctx = [];
-        let initializedIdentifiers = [];
+        const initializedIdentifiers = [];
 
         if (instance_javascript === null) {
             instance_javascript_with_ctx = instance_javascript;
@@ -461,11 +461,11 @@ export default function dom(
             instance_javascript.forEach(node => {
                 instance_javascript_with_ctx.push(node);
     
-                if (Array.isArray(node) && node[0].type === "VariableDeclaration" ) {
+                if (Array.isArray(node) && node[0].type === 'VariableDeclaration') {
                     walk(node[0], {
                         enter(declaration: Identifier) {
                             if (declaration.type === 'Identifier' && !initializedIdentifiers.includes(declaration.name)) {
-                                let index = renderer.initial_context.findIndex(member => member.name === declaration.name);
+                                const index = renderer.initial_context.findIndex(member => member.name === declaration.name);
     
                                 if (index >= 0) {
                                     node.push(x`#return_values[${index}] = ${declaration}`);
@@ -476,9 +476,9 @@ export default function dom(
                     });
                 }
     
-                if (node.type === "FunctionDeclaration") {
+                if (node.type === 'FunctionDeclaration') {
                     if (!initializedIdentifiers.includes(node.id.name)) {
-                        let index = renderer.initial_context.findIndex(member => member.name === node.id.name);
+                        const index = renderer.initial_context.findIndex(member => member.name === node.id.name);
     
                         if (index >= 0) {
                             instance_javascript_with_ctx.push(x`#return_values[${index}] = ${node.id.name}`);
diff --git a/src/runtime/internal/dom.ts b/src/runtime/internal/dom.ts
index f563f6d099da..8768435d4b24 100644
--- a/src/runtime/internal/dom.ts
+++ b/src/runtime/internal/dom.ts
@@ -203,7 +203,9 @@ export function insert_hydration(target: NodeEx, node: NodeEx, anchor?: NodeEx)
 }
 
 export function detach(node: Node) {
-	node.parentNode.removeChild(node);
+    if (node.parentNode !== null) {
+        node.parentNode.removeChild(node);
+    }
 }
 
 export function destroy_each(iterations, detaching) {
diff --git a/test/runtime/samples/error-handling-bubble-to-parent/_config.js b/test/runtime/samples/error-handling-bubble-to-parent/_config.js
index acd4e2a2f0f4..fab5d76ee60e 100644
--- a/test/runtime/samples/error-handling-bubble-to-parent/_config.js
+++ b/test/runtime/samples/error-handling-bubble-to-parent/_config.js
@@ -2,4 +2,4 @@ export default {
     test({ assert, component }) {
         assert.equal(component.error, true);
     }
-}
\ No newline at end of file
+};
diff --git a/test/runtime/samples/error-handling-catch-after-error/_config.js b/test/runtime/samples/error-handling-catch-after-error/_config.js
index acd4e2a2f0f4..fab5d76ee60e 100644
--- a/test/runtime/samples/error-handling-catch-after-error/_config.js
+++ b/test/runtime/samples/error-handling-catch-after-error/_config.js
@@ -2,4 +2,4 @@ export default {
     test({ assert, component }) {
         assert.equal(component.error, true);
     }
-}
\ No newline at end of file
+};
diff --git a/test/runtime/samples/error-handling-catch-before-error/_config.js b/test/runtime/samples/error-handling-catch-before-error/_config.js
index acd4e2a2f0f4..fab5d76ee60e 100644
--- a/test/runtime/samples/error-handling-catch-before-error/_config.js
+++ b/test/runtime/samples/error-handling-catch-before-error/_config.js
@@ -2,4 +2,4 @@ export default {
     test({ assert, component }) {
         assert.equal(component.error, true);
     }
-}
\ No newline at end of file
+};
diff --git a/test/runtime/samples/error-handling-dynamic-component/_config.js b/test/runtime/samples/error-handling-dynamic-component/_config.js
index acd4e2a2f0f4..fab5d76ee60e 100644
--- a/test/runtime/samples/error-handling-dynamic-component/_config.js
+++ b/test/runtime/samples/error-handling-dynamic-component/_config.js
@@ -2,4 +2,4 @@ export default {
     test({ assert, component }) {
         assert.equal(component.error, true);
     }
-}
\ No newline at end of file
+};
diff --git a/test/runtime/samples/error-handling-each-block-non-array/_config.js b/test/runtime/samples/error-handling-each-block-non-array/_config.js
index acd4e2a2f0f4..fab5d76ee60e 100644
--- a/test/runtime/samples/error-handling-each-block-non-array/_config.js
+++ b/test/runtime/samples/error-handling-each-block-non-array/_config.js
@@ -2,4 +2,4 @@ export default {
     test({ assert, component }) {
         assert.equal(component.error, true);
     }
-}
\ No newline at end of file
+};
diff --git a/test/runtime/samples/error-handling-each-block-non-array/main.svelte b/test/runtime/samples/error-handling-each-block-non-array/main.svelte
index b4fb0abca4bf..0a39d8a0b735 100644
--- a/test/runtime/samples/error-handling-each-block-non-array/main.svelte
+++ b/test/runtime/samples/error-handling-each-block-non-array/main.svelte
@@ -1,20 +1,14 @@
 <script>
     import { onError } from "svelte";
 
-    var a = [1, 2, 3];
+    var a = {}
     export var error = false;
     
     onError(e => {
         error = true;
     });
-
-    function handleClick() {
-        a = 10;
-    }
 </script>
 
-{#each a as item}
+{#each a.b.c as item}
     {item}
-{/each}
-
-<button on:click={handleClick}></button>
\ No newline at end of file
+{/each}
\ No newline at end of file
diff --git a/test/runtime/samples/error-handling-each-block-reactive-non-array/_config.js b/test/runtime/samples/error-handling-each-block-reactive-non-array/_config.js
index edd0bd074bf3..773299e41517 100644
--- a/test/runtime/samples/error-handling-each-block-reactive-non-array/_config.js
+++ b/test/runtime/samples/error-handling-each-block-reactive-non-array/_config.js
@@ -7,4 +7,4 @@ export default {
 
         assert.equal(component.error, true);
     }
-}
\ No newline at end of file
+};
diff --git a/test/runtime/samples/error-handling-each-block-reactive-non-array/main.svelte b/test/runtime/samples/error-handling-each-block-reactive-non-array/main.svelte
index 0a39d8a0b735..b4fb0abca4bf 100644
--- a/test/runtime/samples/error-handling-each-block-reactive-non-array/main.svelte
+++ b/test/runtime/samples/error-handling-each-block-reactive-non-array/main.svelte
@@ -1,14 +1,20 @@
 <script>
     import { onError } from "svelte";
 
-    var a = {}
+    var a = [1, 2, 3];
     export var error = false;
     
     onError(e => {
         error = true;
     });
+
+    function handleClick() {
+        a = 10;
+    }
 </script>
 
-{#each a.b.c as item}
+{#each a as item}
     {item}
-{/each}
\ No newline at end of file
+{/each}
+
+<button on:click={handleClick}></button>
\ No newline at end of file
diff --git a/test/runtime/samples/error-handling-each-block/_config.js b/test/runtime/samples/error-handling-each-block/_config.js
index acd4e2a2f0f4..fab5d76ee60e 100644
--- a/test/runtime/samples/error-handling-each-block/_config.js
+++ b/test/runtime/samples/error-handling-each-block/_config.js
@@ -2,4 +2,4 @@ export default {
     test({ assert, component }) {
         assert.equal(component.error, true);
     }
-}
\ No newline at end of file
+};
diff --git a/test/runtime/samples/error-handling-event-correct-this/_config.js b/test/runtime/samples/error-handling-event-correct-this/_config.js
index 3f90d0b5cc52..3a1e25bd22ef 100644
--- a/test/runtime/samples/error-handling-event-correct-this/_config.js
+++ b/test/runtime/samples/error-handling-event-correct-this/_config.js
@@ -8,4 +8,4 @@ export default {
         assert.equal(component.error, true);
         assert.equal(component.that, button);
     }
-}
\ No newline at end of file
+};
diff --git a/test/runtime/samples/error-handling-event/_config.js b/test/runtime/samples/error-handling-event/_config.js
index edd0bd074bf3..773299e41517 100644
--- a/test/runtime/samples/error-handling-event/_config.js
+++ b/test/runtime/samples/error-handling-event/_config.js
@@ -7,4 +7,4 @@ export default {
 
         assert.equal(component.error, true);
     }
-}
\ No newline at end of file
+};
diff --git a/test/runtime/samples/error-handling-if-block-reactive/_config.js b/test/runtime/samples/error-handling-if-block-reactive/_config.js
index edd0bd074bf3..773299e41517 100644
--- a/test/runtime/samples/error-handling-if-block-reactive/_config.js
+++ b/test/runtime/samples/error-handling-if-block-reactive/_config.js
@@ -7,4 +7,4 @@ export default {
 
         assert.equal(component.error, true);
     }
-}
\ No newline at end of file
+};
diff --git a/test/runtime/samples/error-handling-if-block-show-component/_config.js b/test/runtime/samples/error-handling-if-block-show-component/_config.js
index edd0bd074bf3..773299e41517 100644
--- a/test/runtime/samples/error-handling-if-block-show-component/_config.js
+++ b/test/runtime/samples/error-handling-if-block-show-component/_config.js
@@ -7,4 +7,4 @@ export default {
 
         assert.equal(component.error, true);
     }
-}
\ No newline at end of file
+};
diff --git a/test/runtime/samples/error-handling-if-block/_config.js b/test/runtime/samples/error-handling-if-block/_config.js
index acd4e2a2f0f4..fab5d76ee60e 100644
--- a/test/runtime/samples/error-handling-if-block/_config.js
+++ b/test/runtime/samples/error-handling-if-block/_config.js
@@ -2,4 +2,4 @@ export default {
     test({ assert, component }) {
         assert.equal(component.error, true);
     }
-}
\ No newline at end of file
+};
diff --git a/test/runtime/samples/error-handling-bubble-to-parent-manually/_config.js b/test/runtime/samples/error-handling-manually-bubble-to-parent/_config.js
similarity index 97%
rename from test/runtime/samples/error-handling-bubble-to-parent-manually/_config.js
rename to test/runtime/samples/error-handling-manually-bubble-to-parent/_config.js
index acd4e2a2f0f4..fab5d76ee60e 100644
--- a/test/runtime/samples/error-handling-bubble-to-parent-manually/_config.js
+++ b/test/runtime/samples/error-handling-manually-bubble-to-parent/_config.js
@@ -2,4 +2,4 @@ export default {
     test({ assert, component }) {
         assert.equal(component.error, true);
     }
-}
\ No newline at end of file
+};
diff --git a/test/runtime/samples/error-handling-bubble-to-parent-manually/child.svelte b/test/runtime/samples/error-handling-manually-bubble-to-parent/child.svelte
similarity index 100%
rename from test/runtime/samples/error-handling-bubble-to-parent-manually/child.svelte
rename to test/runtime/samples/error-handling-manually-bubble-to-parent/child.svelte
diff --git a/test/runtime/samples/error-handling-bubble-to-parent-manually/main.svelte b/test/runtime/samples/error-handling-manually-bubble-to-parent/main.svelte
similarity index 100%
rename from test/runtime/samples/error-handling-bubble-to-parent-manually/main.svelte
rename to test/runtime/samples/error-handling-manually-bubble-to-parent/main.svelte
diff --git a/test/runtime/samples/error-handling-slotted-component/_config.js b/test/runtime/samples/error-handling-slotted-component/_config.js
index acd4e2a2f0f4..fab5d76ee60e 100644
--- a/test/runtime/samples/error-handling-slotted-component/_config.js
+++ b/test/runtime/samples/error-handling-slotted-component/_config.js
@@ -2,4 +2,4 @@ export default {
     test({ assert, component }) {
         assert.equal(component.error, true);
     }
-}
\ No newline at end of file
+};
diff --git a/test/runtime/samples/error-handling-template-reactive/_config.js b/test/runtime/samples/error-handling-template-reactive/_config.js
index edd0bd074bf3..773299e41517 100644
--- a/test/runtime/samples/error-handling-template-reactive/_config.js
+++ b/test/runtime/samples/error-handling-template-reactive/_config.js
@@ -7,4 +7,4 @@ export default {
 
         assert.equal(component.error, true);
     }
-}
\ No newline at end of file
+};
diff --git a/test/runtime/samples/error-handling-template/_config.js b/test/runtime/samples/error-handling-template/_config.js
index acd4e2a2f0f4..fab5d76ee60e 100644
--- a/test/runtime/samples/error-handling-template/_config.js
+++ b/test/runtime/samples/error-handling-template/_config.js
@@ -2,4 +2,4 @@ export default {
     test({ assert, component }) {
         assert.equal(component.error, true);
     }
-}
\ No newline at end of file
+};

From 5343883edfa092fb7702259d8706e73df3a54255 Mon Sep 17 00:00:00 2001
From: rster20002 <rster2002dev@gmail.com>
Date: Fri, 6 Aug 2021 12:48:05 +0200
Subject: [PATCH 15/21] Add more test cases

---
 .../error-handling-action-destroy/_config.js  |  9 ++++++++
 .../error-handling-action-destroy/main.svelte | 22 +++++++++++++++++++
 .../_config.js                                |  5 +++++
 .../main.svelte                               | 15 +++++++++++++
 .../samples/error-handling-action/_config.js  |  5 +++++
 .../samples/error-handling-action/main.svelte | 15 +++++++++++++
 .../error-handling-anonymous-event/_config.js | 10 +++++++++
 .../main.svelte                               | 12 ++++++++++
 .../error-handling-attribute/_config.js       |  5 +++++
 .../error-handling-attribute/main.svelte      | 12 ++++++++++
 .../_config.js                                | 10 +++++++++
 .../main.svelte                               | 21 ++++++++++++++++++
 .../samples/error-handling-binding/_config.js |  5 +++++
 .../error-handling-binding/main.svelte        | 12 ++++++++++
 14 files changed, 158 insertions(+)
 create mode 100644 test/runtime/samples/error-handling-action-destroy/_config.js
 create mode 100644 test/runtime/samples/error-handling-action-destroy/main.svelte
 create mode 100644 test/runtime/samples/error-handling-action-with-arguments/_config.js
 create mode 100644 test/runtime/samples/error-handling-action-with-arguments/main.svelte
 create mode 100644 test/runtime/samples/error-handling-action/_config.js
 create mode 100644 test/runtime/samples/error-handling-action/main.svelte
 create mode 100644 test/runtime/samples/error-handling-anonymous-event/_config.js
 create mode 100644 test/runtime/samples/error-handling-anonymous-event/main.svelte
 create mode 100644 test/runtime/samples/error-handling-attribute/_config.js
 create mode 100644 test/runtime/samples/error-handling-attribute/main.svelte
 create mode 100644 test/runtime/samples/error-handling-binding-reactive/_config.js
 create mode 100644 test/runtime/samples/error-handling-binding-reactive/main.svelte
 create mode 100644 test/runtime/samples/error-handling-binding/_config.js
 create mode 100644 test/runtime/samples/error-handling-binding/main.svelte

diff --git a/test/runtime/samples/error-handling-action-destroy/_config.js b/test/runtime/samples/error-handling-action-destroy/_config.js
new file mode 100644
index 000000000000..c43b64736de4
--- /dev/null
+++ b/test/runtime/samples/error-handling-action-destroy/_config.js
@@ -0,0 +1,9 @@
+export default {
+    test({ assert, component }) {
+        assert.equal(component.error, false);
+
+        component.visible = false;
+
+        assert.equal(component.error, true);
+    }
+};
diff --git a/test/runtime/samples/error-handling-action-destroy/main.svelte b/test/runtime/samples/error-handling-action-destroy/main.svelte
new file mode 100644
index 000000000000..f9496ca8a232
--- /dev/null
+++ b/test/runtime/samples/error-handling-action-destroy/main.svelte
@@ -0,0 +1,22 @@
+<script>
+    import { onError } from "svelte";
+
+    export var visible = true;
+    export var error = false;
+
+    onError(e => {
+        error = true;
+    });
+
+    function action(node, arg) {
+        return {
+            destroy() {
+                a.b;
+            }
+        }
+    }
+</script>
+
+{#if visible}
+    <div use:action />
+{/if}
\ No newline at end of file
diff --git a/test/runtime/samples/error-handling-action-with-arguments/_config.js b/test/runtime/samples/error-handling-action-with-arguments/_config.js
new file mode 100644
index 000000000000..fab5d76ee60e
--- /dev/null
+++ b/test/runtime/samples/error-handling-action-with-arguments/_config.js
@@ -0,0 +1,5 @@
+export default {
+    test({ assert, component }) {
+        assert.equal(component.error, true);
+    }
+};
diff --git a/test/runtime/samples/error-handling-action-with-arguments/main.svelte b/test/runtime/samples/error-handling-action-with-arguments/main.svelte
new file mode 100644
index 000000000000..f15ebcbac6c9
--- /dev/null
+++ b/test/runtime/samples/error-handling-action-with-arguments/main.svelte
@@ -0,0 +1,15 @@
+<script>
+    import { onError } from "svelte";
+
+    export var error = false;
+
+    onError(e => {
+        error = true;
+    });
+
+    function action(node, arg) {
+        a.b;
+    }
+</script>
+
+<div use:action={10} />
\ No newline at end of file
diff --git a/test/runtime/samples/error-handling-action/_config.js b/test/runtime/samples/error-handling-action/_config.js
new file mode 100644
index 000000000000..fab5d76ee60e
--- /dev/null
+++ b/test/runtime/samples/error-handling-action/_config.js
@@ -0,0 +1,5 @@
+export default {
+    test({ assert, component }) {
+        assert.equal(component.error, true);
+    }
+};
diff --git a/test/runtime/samples/error-handling-action/main.svelte b/test/runtime/samples/error-handling-action/main.svelte
new file mode 100644
index 000000000000..14bdae809f80
--- /dev/null
+++ b/test/runtime/samples/error-handling-action/main.svelte
@@ -0,0 +1,15 @@
+<script>
+    import { onError } from "svelte";
+
+    export var error = false;
+
+    onError(e => {
+        error = true;
+    });
+
+    function action() {
+        a.b;
+    }
+</script>
+
+<div use:action />
\ No newline at end of file
diff --git a/test/runtime/samples/error-handling-anonymous-event/_config.js b/test/runtime/samples/error-handling-anonymous-event/_config.js
new file mode 100644
index 000000000000..773299e41517
--- /dev/null
+++ b/test/runtime/samples/error-handling-anonymous-event/_config.js
@@ -0,0 +1,10 @@
+export default {
+    async test({ assert, component, target, window }) {
+        const button = target.querySelector('button');
+        const event = new window.MouseEvent('click');
+
+        await button.dispatchEvent(event);
+
+        assert.equal(component.error, true);
+    }
+};
diff --git a/test/runtime/samples/error-handling-anonymous-event/main.svelte b/test/runtime/samples/error-handling-anonymous-event/main.svelte
new file mode 100644
index 000000000000..f8b206e5bbca
--- /dev/null
+++ b/test/runtime/samples/error-handling-anonymous-event/main.svelte
@@ -0,0 +1,12 @@
+<script>
+    import { onError } from "svelte";
+
+    var a = {};
+    export var error = false;
+
+    onError(e => {
+        error = true;
+    });
+</script>
+
+<button on:click={() => console.log(a.b.c)}></button>
\ No newline at end of file
diff --git a/test/runtime/samples/error-handling-attribute/_config.js b/test/runtime/samples/error-handling-attribute/_config.js
new file mode 100644
index 000000000000..fab5d76ee60e
--- /dev/null
+++ b/test/runtime/samples/error-handling-attribute/_config.js
@@ -0,0 +1,5 @@
+export default {
+    test({ assert, component }) {
+        assert.equal(component.error, true);
+    }
+};
diff --git a/test/runtime/samples/error-handling-attribute/main.svelte b/test/runtime/samples/error-handling-attribute/main.svelte
new file mode 100644
index 000000000000..ad5e33248217
--- /dev/null
+++ b/test/runtime/samples/error-handling-attribute/main.svelte
@@ -0,0 +1,12 @@
+<script>
+    import { onError } from "svelte";
+
+    var a = {};
+    export var error = false;
+
+    onError(e => {
+        error = true;
+    });
+</script>
+
+<a href={a.b.c}></a>
\ No newline at end of file
diff --git a/test/runtime/samples/error-handling-binding-reactive/_config.js b/test/runtime/samples/error-handling-binding-reactive/_config.js
new file mode 100644
index 000000000000..773299e41517
--- /dev/null
+++ b/test/runtime/samples/error-handling-binding-reactive/_config.js
@@ -0,0 +1,10 @@
+export default {
+    async test({ assert, component, target, window }) {
+        const button = target.querySelector('button');
+        const event = new window.MouseEvent('click');
+
+        await button.dispatchEvent(event);
+
+        assert.equal(component.error, true);
+    }
+};
diff --git a/test/runtime/samples/error-handling-binding-reactive/main.svelte b/test/runtime/samples/error-handling-binding-reactive/main.svelte
new file mode 100644
index 000000000000..59881d269982
--- /dev/null
+++ b/test/runtime/samples/error-handling-binding-reactive/main.svelte
@@ -0,0 +1,21 @@
+<script>
+    import { onError } from "svelte";
+
+    var a = {
+        b: {
+            c: "10"
+        }
+    };
+    export var error = false;
+
+    onError(e => {
+        error = true;
+    });
+
+    function clickEvent() {
+        a = {};
+    }
+</script>
+
+<input bind:value={a.b.c} />
+<button on:click={clickEvent}></button>
\ No newline at end of file
diff --git a/test/runtime/samples/error-handling-binding/_config.js b/test/runtime/samples/error-handling-binding/_config.js
new file mode 100644
index 000000000000..fab5d76ee60e
--- /dev/null
+++ b/test/runtime/samples/error-handling-binding/_config.js
@@ -0,0 +1,5 @@
+export default {
+    test({ assert, component }) {
+        assert.equal(component.error, true);
+    }
+};
diff --git a/test/runtime/samples/error-handling-binding/main.svelte b/test/runtime/samples/error-handling-binding/main.svelte
new file mode 100644
index 000000000000..917b1b462574
--- /dev/null
+++ b/test/runtime/samples/error-handling-binding/main.svelte
@@ -0,0 +1,12 @@
+<script>
+    import { onError } from "svelte";
+
+    var a = {};
+    export var error = false;
+
+    onError(e => {
+        error = true;
+    });
+</script>
+
+<input bind:value={a.b.c} />
\ No newline at end of file

From c8736dd81fdfd5432584f5739f56bca9af9d6475 Mon Sep 17 00:00:00 2001
From: rster20002 <rster2002dev@gmail.com>
Date: Sat, 7 Aug 2021 12:49:47 +0200
Subject: [PATCH 16/21] Fixed a lot of runtime issues

---
 src/compiler/compile/render_dom/Block.ts      | 55 ++++++++++++++++---
 src/compiler/compile/render_dom/index.ts      | 32 +++++------
 .../wrappers/Element/EventHandler.ts          |  2 +-
 .../render_dom/wrappers/Element/index.ts      |  2 +-
 .../render_dom/wrappers/shared/add_actions.ts |  2 +-
 src/compiler/compile/render_ssr/index.ts      | 48 +++++++---------
 src/runtime/internal/Component.ts             |  2 +-
 src/runtime/internal/utils.ts                 |  4 +-
 8 files changed, 88 insertions(+), 59 deletions(-)

diff --git a/src/compiler/compile/render_dom/Block.ts b/src/compiler/compile/render_dom/Block.ts
index 5ff5139b38bb..fef08b88ef27 100644
--- a/src/compiler/compile/render_dom/Block.ts
+++ b/src/compiler/compile/render_dom/Block.ts
@@ -375,6 +375,36 @@ export default class Block {
 			}
 		}
 
+        if (properties.create.type === 'FunctionExpression') {
+            properties.create.body.body = b`
+                try {
+                    ${properties.create.body.body}
+                } catch (e) {
+                    @handle_error(@get_current_component(), e);
+                }
+            `;
+        }
+
+        if (properties.mount.type === 'FunctionExpression') {
+            properties.mount.body.body = b`
+                try {
+                    ${properties.mount.body.body}
+                } catch (e) {
+                    @handle_error(@get_current_component(), e);
+                }
+            `;
+        }
+
+        if (properties.hydrate?.type === 'FunctionExpression') {
+            properties.hydrate.body.body = b`
+                try {
+                    ${properties.hydrate.body.body}
+                } catch (e) {
+                    @handle_error(@get_current_component(), e);
+                }
+            `;
+        }
+
 		const return_value: any = x`{
 			key: ${properties.key},
 			first: ${properties.first},
@@ -395,6 +425,7 @@ export default class Block {
 
         const init_declarations = [];
         const init_statements = [];
+        const init_functions = [];
 
         Array.from(this.variables.values()).forEach(({ id, init }) => {
             init_declarations.push(b`let ${id};`);
@@ -407,9 +438,12 @@ export default class Block {
         this.chunks.init.forEach(node => {
             if (Array.isArray(node)) {
                 node.forEach((declaration: any) => { // TODO add type to this
-                    if (declaration.declarations) {
+                    if (declaration.type === 'FunctionDeclaration') {
+                        init_declarations.push(b`let ${declaration.id};`);
+                        init_functions.push(b`${declaration.id} = ${declaration}`);
+                    } else if (declaration.type === 'VariableDeclaration') {
                         declaration.declarations.forEach(({ id, init }) => {
-                            init_declarations.push(b`let ${id}`);
+                            init_declarations.push(b`let ${id}`); // TODO declaration is not always `let`
                             init_statements.push(b`${id} = ${init}`);
                         });
                     } else {
@@ -426,9 +460,11 @@ export default class Block {
 
 			${init_declarations}
 
-            ${init_statements.length > 0
+            ${init_statements.length > 0 || init_functions.length > 0
                 ? b`
                     try {
+                        ${init_functions}
+
                         ${init_statements}
                     } catch (e) {
                         @handle_error(@get_current_component(), e);
@@ -490,7 +526,6 @@ export default class Block {
 	render_listeners(chunk: string = '') {
 		if (this.event_listeners.length > 0) {
 			this.add_variable({ type: 'Identifier', name: '#mounted' });
-			this.chunks.destroy.push(b`#mounted = false`);
 
 			const dispose: Identifier = {
 				type: 'Identifier',
@@ -499,10 +534,6 @@ export default class Block {
 
 			this.add_variable(dispose);
 
-            this.event_listeners.forEach((event_listener: any) => {
-                event_listener.arguments[2] = x`@attach_error_handler(${event_listener.arguments[0]}, @get_current_component(), ${event_listener.arguments[2]})`;
-            });
-
 			if (this.event_listeners.length === 1) {
 				this.chunks.mount.push(
 					b`
@@ -514,7 +545,11 @@ export default class Block {
 				);
 
 				this.chunks.destroy.push(
-					b`${dispose}();`
+					b`
+                        if (#mounted) {
+                            ${dispose}();
+                        }
+                    `
 				);
 			} else {
 				this.chunks.mount.push(b`
@@ -530,6 +565,8 @@ export default class Block {
 					b`@run_all(${dispose});`
 				);
 			}
+
+            this.chunks.destroy.push(b`#mounted = false`);
 		}
 	}
 }
diff --git a/src/compiler/compile/render_dom/index.ts b/src/compiler/compile/render_dom/index.ts
index 226a0d58285d..1b8760c16206 100644
--- a/src/compiler/compile/render_dom/index.ts
+++ b/src/compiler/compile/render_dom/index.ts
@@ -6,7 +6,7 @@ import { walk } from 'estree-walker';
 import { extract_names, Scope } from 'periscopic';
 import { invalidate } from './invalidate';
 import Block from './Block';
-import { ImportDeclaration, ClassDeclaration, FunctionExpression, Node, Statement, ObjectExpression, Expression, Identifier } from 'estree';
+import { ImportDeclaration, ClassDeclaration, FunctionExpression, Node, Statement, ObjectExpression, Expression } from 'estree';
 import { apply_preprocessor_sourcemap } from '../../utils/mapped_code';
 import { RawSourceMap, DecodedSourceMap } from '@ampproject/remapping/dist/types/types';
 import { flatten } from '../../utils/flatten';
@@ -462,16 +462,12 @@ export default function dom(
                 instance_javascript_with_ctx.push(node);
     
                 if (Array.isArray(node) && node[0].type === 'VariableDeclaration') {
-                    walk(node[0], {
-                        enter(declaration: Identifier) {
-                            if (declaration.type === 'Identifier' && !initializedIdentifiers.includes(declaration.name)) {
-                                const index = renderer.initial_context.findIndex(member => member.name === declaration.name);
-    
-                                if (index >= 0) {
-                                    node.push(x`#return_values[${index}] = ${declaration}`);
-                                    initializedIdentifiers.push(declaration.name);
-                                }
-                            }
+                    node[0].declarations.forEach(({ id }) => {
+                        const index = renderer.initial_context.findIndex(member => member.name === id.name);
+
+                        if (index >= 0) {
+                            instance_javascript_with_ctx.push(b`#return_values[${index}] = ${id};`[0]);
+                            initializedIdentifiers.push(id.name);
                         }
                     });
                 }
@@ -481,7 +477,7 @@ export default function dom(
                         const index = renderer.initial_context.findIndex(member => member.name === node.id.name);
     
                         if (index >= 0) {
-                            instance_javascript_with_ctx.push(x`#return_values[${index}] = ${node.id.name}`);
+                            instance_javascript_with_ctx.push(b`#return_values[${index}] = ${node.id};`[0]);
                             initializedIdentifiers.push(node.id.name);
                         }
                     }
@@ -492,6 +488,12 @@ export default function dom(
 
         const instance_try_block: any = b`
             try {
+                ${reactive_store_declarations}
+
+				${reactive_store_subscriptions}
+
+				${resubscribable_reactive_store_unsubscribers}
+
                 ${instance_javascript_with_ctx}
 
                 ${unknown_props_check}
@@ -534,12 +536,6 @@ export default function dom(
 
 				${rest}
 
-				${reactive_store_declarations}
-
-				${reactive_store_subscriptions}
-
-				${resubscribable_reactive_store_unsubscribers}
-
 				${component.slots.size || component.compile_options.dev || uses_slots ? b`let { $$slots: #slots = {}, $$scope } = $$props;` : null}
 				${component.compile_options.dev && b`@validate_slots('${component.tag}', #slots, [${[...component.slots.keys()].map(key => `'${key}'`).join(',')}]);`}
 				${compute_slots}
diff --git a/src/compiler/compile/render_dom/wrappers/Element/EventHandler.ts b/src/compiler/compile/render_dom/wrappers/Element/EventHandler.ts
index fc65a9aa5e96..eec574478b8b 100644
--- a/src/compiler/compile/render_dom/wrappers/Element/EventHandler.ts
+++ b/src/compiler/compile/render_dom/wrappers/Element/EventHandler.ts
@@ -67,7 +67,7 @@ export default class EventHandlerWrapper {
 		}
 
 		block.event_listeners.push(
-			x`@listen(${target}, "${this.node.name}", ${snippet}, ${args})`
+            x`@listen(${target}, "${this.node.name}", @attach_error_handler(${target}, @get_current_component(), ${snippet}), ${args})`
 		);
 	}
 }
diff --git a/src/compiler/compile/render_dom/wrappers/Element/index.ts b/src/compiler/compile/render_dom/wrappers/Element/index.ts
index db26b6673c2c..300695efdc40 100644
--- a/src/compiler/compile/render_dom/wrappers/Element/index.ts
+++ b/src/compiler/compile/render_dom/wrappers/Element/index.ts
@@ -541,7 +541,7 @@ export default class ElementWrapper extends Wrapper {
 				);
 			} else {
 				block.event_listeners.push(
-					x`@listen(${this.var}, "${name}", ${callee})`
+                    x`@listen(${this.var}, "${name}", @attach_error_handler(${this.var}, @get_current_component(), ${callee}))`
 				);
 			}
 		});
diff --git a/src/compiler/compile/render_dom/wrappers/shared/add_actions.ts b/src/compiler/compile/render_dom/wrappers/shared/add_actions.ts
index b57820beb3ed..a0d71c3bc14a 100644
--- a/src/compiler/compile/render_dom/wrappers/shared/add_actions.ts
+++ b/src/compiler/compile/render_dom/wrappers/shared/add_actions.ts
@@ -40,7 +40,7 @@ export function add_action(block: Block, target: string, action: Action) {
 		);
 	} else {
 		block.event_listeners.push(
-			x`@action_destroyer(${id} = ${fn}.call(null, ${target}, ${snippet}))`
+            x`@action_destroyer(${id} = @attach_error_handler(null, @get_current_component(), ${fn}).call(null, ${target}, ${snippet}))`
 		);
 	}
 
diff --git a/src/compiler/compile/render_ssr/index.ts b/src/compiler/compile/render_ssr/index.ts
index 6f85ae98309d..6cfe0f061ed1 100644
--- a/src/compiler/compile/render_ssr/index.ts
+++ b/src/compiler/compile/render_ssr/index.ts
@@ -182,35 +182,25 @@ export default function ssr(
 			return $$rendered;
 		`
 		: b`
-			try {
-                ${instance_javascript}
+			${reactive_declarations}
 
-                ${reactive_declarations}
+			${reactive_store_unsubscriptions}
+
+			return ${literal};`;
+
+    const blocks = [
+        ...injected.map(name => b`let ${name};`),
+        rest,
+        slots,
+        ...reactive_store_declarations,
+        ...reactive_store_subscriptions,
+        instance_javascript,
+        ...parent_bindings,
+        css.code && b`$$result.css.add(#css);`,
+        main
+    ].filter(Boolean);
 
-                ${reactive_store_unsubscriptions}
 
-                return ${literal};
-            } catch (e) {
-                @handle_error(@get_current_component(), e);
-            }`;
-
-	const blocks = [
-		...injected.map(name => b`let ${name};`),
-		rest,
-		slots,
-		...reactive_store_declarations,
-		...reactive_store_subscriptions,
-		// b`
-        //     try {
-        //         ${instance_javascript}
-        //     } catch (e) {
-        //         @handle_error(@get_current_component(), e);
-        //     }
-        // `,
-		...parent_bindings,
-		css.code && b`$$result.css.add(#css);`,
-		main
-	].filter(Boolean);
 
 	const js = b`
 		${css.code ? b`
@@ -224,7 +214,11 @@ export default function ssr(
 		${component.fully_hoisted}
 
 		const ${name} = @create_ssr_component(($$result, $$props, $$bindings, #slots) => {
-			${blocks}
+			try {
+                ${blocks}
+            } catch (e) {
+                @handle_error(@get_current_component(), e);
+            }
 		});
 	`;
 
diff --git a/src/runtime/internal/Component.ts b/src/runtime/internal/Component.ts
index 29289470228d..e9e21d4b94c6 100644
--- a/src/runtime/internal/Component.ts
+++ b/src/runtime/internal/Component.ts
@@ -109,7 +109,7 @@ function make_dirty(component, i) {
 export function attach_error_handler(that: any, component, fn) {
     return (...rest) => {
         try {
-            fn.call(that, ...rest);
+            return fn.call(that, ...rest);
         } catch (e) {
             handle_error(component, e);
         }
diff --git a/src/runtime/internal/utils.ts b/src/runtime/internal/utils.ts
index 8868e38ee29f..9e8b2057ca03 100644
--- a/src/runtime/internal/utils.ts
+++ b/src/runtime/internal/utils.ts
@@ -1,4 +1,6 @@
 import { Readable } from 'svelte/store';
+import { attach_error_handler } from './Component';
+import { get_current_component } from './lifecycle';
 
 export function noop() {}
 
@@ -185,5 +187,5 @@ export function set_store_value(store, ret, value) {
 export const has_prop = (obj, prop) => Object.prototype.hasOwnProperty.call(obj, prop);
 
 export function action_destroyer(action_result) {
-	return action_result && is_function(action_result.destroy) ? action_result.destroy : noop;
+    return action_result && is_function(action_result.destroy) ? attach_error_handler(action_result, get_current_component(), action_result.destroy) : noop;
 }

From e0568fd97672778527dfc1488a5b855e7ef8838e Mon Sep 17 00:00:00 2001
From: rster20002 <rster2002dev@gmail.com>
Date: Sun, 8 Aug 2021 16:42:31 +0200
Subject: [PATCH 17/21] Prevent one error being handled multiple times

---
 src/runtime/internal/Component.ts | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/src/runtime/internal/Component.ts b/src/runtime/internal/Component.ts
index e9e21d4b94c6..bded4cc8fdd8 100644
--- a/src/runtime/internal/Component.ts
+++ b/src/runtime/internal/Component.ts
@@ -121,7 +121,7 @@ export function handle_error(component, e, skip = false) {
         bubble_error(component, e);
     }
 
-    if (!skip) {
+    if (!skip && !e.unhandled) {
         component.$$.on_error.forEach(handler => {
             try {
                 handler(e);
@@ -136,6 +136,7 @@ function bubble_error(component, e) {
     if (component.$$.parent_component) {
         handle_error(component.$$.parent_component, e, component.$$.in_slot);
     } else {
+        e.unhandled = true; // TODO this is very gross
         throw e;
     }
 }

From 90c8f972492f3eea4aa826a929228e4105d30868 Mon Sep 17 00:00:00 2001
From: rster20002 <rster2002dev@gmail.com>
Date: Tue, 10 Aug 2021 15:25:22 +0200
Subject: [PATCH 18/21] Add keyed each tests

---
 .../_config.js                                | 10 ++++++++
 .../main.svelte                               | 25 +++++++++++++++++++
 .../_config.js                                |  5 ++++
 .../main.svelte                               | 14 +++++++++++
 4 files changed, 54 insertions(+)
 create mode 100644 test/runtime/samples/error-handling-keyed-each-block-reactive/_config.js
 create mode 100644 test/runtime/samples/error-handling-keyed-each-block-reactive/main.svelte
 create mode 100644 test/runtime/samples/error-handling-keyed-each-block/_config.js
 create mode 100644 test/runtime/samples/error-handling-keyed-each-block/main.svelte

diff --git a/test/runtime/samples/error-handling-keyed-each-block-reactive/_config.js b/test/runtime/samples/error-handling-keyed-each-block-reactive/_config.js
new file mode 100644
index 000000000000..773299e41517
--- /dev/null
+++ b/test/runtime/samples/error-handling-keyed-each-block-reactive/_config.js
@@ -0,0 +1,10 @@
+export default {
+    async test({ assert, component, target, window }) {
+        const button = target.querySelector('button');
+        const event = new window.MouseEvent('click');
+
+        await button.dispatchEvent(event);
+
+        assert.equal(component.error, true);
+    }
+};
diff --git a/test/runtime/samples/error-handling-keyed-each-block-reactive/main.svelte b/test/runtime/samples/error-handling-keyed-each-block-reactive/main.svelte
new file mode 100644
index 000000000000..567c8273bd24
--- /dev/null
+++ b/test/runtime/samples/error-handling-keyed-each-block-reactive/main.svelte
@@ -0,0 +1,25 @@
+<script>
+    import { onError } from "svelte";
+
+    var a = [{
+        a: {
+            b: 10
+        }
+    }];
+
+    export var error = false;
+    
+    onError(e => {
+        error = true;
+    });
+
+    function clickEvent() {
+        a = [{}];
+    }
+</script>
+
+<button on:click={clickEvent}></button>
+
+{#each a as item (item.a.b)}
+    {item}
+{/each}
\ No newline at end of file
diff --git a/test/runtime/samples/error-handling-keyed-each-block/_config.js b/test/runtime/samples/error-handling-keyed-each-block/_config.js
new file mode 100644
index 000000000000..fab5d76ee60e
--- /dev/null
+++ b/test/runtime/samples/error-handling-keyed-each-block/_config.js
@@ -0,0 +1,5 @@
+export default {
+    test({ assert, component }) {
+        assert.equal(component.error, true);
+    }
+};
diff --git a/test/runtime/samples/error-handling-keyed-each-block/main.svelte b/test/runtime/samples/error-handling-keyed-each-block/main.svelte
new file mode 100644
index 000000000000..98c79c454bdb
--- /dev/null
+++ b/test/runtime/samples/error-handling-keyed-each-block/main.svelte
@@ -0,0 +1,14 @@
+<script>
+    import { onError } from "svelte";
+
+    var a = [{}]
+    export var error = false;
+    
+    onError(e => {
+        error = true;
+    });
+</script>
+
+{#each a as item (item.a.b)}
+    {item}
+{/each}
\ No newline at end of file

From ba7c38f900c59245a7742c2347dc5098c9e6f350 Mon Sep 17 00:00:00 2001
From: rster20002 <rster2002dev@gmail.com>
Date: Wed, 11 Aug 2021 22:27:46 +0200
Subject: [PATCH 19/21] Remove unnecessary assignment

---
 src/compiler/compile/render_dom/index.ts | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/compiler/compile/render_dom/index.ts b/src/compiler/compile/render_dom/index.ts
index 1b8760c16206..7c84f0f580c3 100644
--- a/src/compiler/compile/render_dom/index.ts
+++ b/src/compiler/compile/render_dom/index.ts
@@ -520,7 +520,6 @@ export default function dom(
 
                 ${uses_props && b`$$props = @exclude_internal_props($$props);`}
 
-                #return_values = ${return_value}
                 return #return_values;
             }
             catch(e) {

From fb33f457bdc85764e8fb619f556402952b68a138 Mon Sep 17 00:00:00 2001
From: rster20002 <rster2002dev@gmail.com>
Date: Thu, 12 Aug 2021 12:38:59 +0200
Subject: [PATCH 20/21] Fixed slots and props not being added to ctx Fixed
 linting error Removed 'catch after error' test

---
 src/compiler/compile/render_dom/index.ts      | 42 ++++++++++---------
 .../_config.js                                |  5 ---
 .../main.svelte                               | 12 ------
 3 files changed, 22 insertions(+), 37 deletions(-)
 delete mode 100644 test/runtime/samples/error-handling-catch-after-error/_config.js
 delete mode 100644 test/runtime/samples/error-handling-catch-after-error/main.svelte

diff --git a/src/compiler/compile/render_dom/index.ts b/src/compiler/compile/render_dom/index.ts
index 7c84f0f580c3..f2efe39cca7d 100644
--- a/src/compiler/compile/render_dom/index.ts
+++ b/src/compiler/compile/render_dom/index.ts
@@ -443,18 +443,26 @@ export default function dom(
 		}
 
         const return_value_reference = b`let #return_values = []`;
-
-		const return_value = {
-			type: 'ArrayExpression',
-			elements: renderer.initial_context.map(member => ({
-				type: 'Identifier',
-				name: member.name
-			}) as Expression)
-		};
         
         let instance_javascript_with_ctx = [];
         const initializedIdentifiers = [];
 
+        const add_variable_to_ctx = id => {
+            const index = renderer.initial_context.findIndex(member => member.name === id.name);
+
+            if (index >= 0) {
+                instance_javascript_with_ctx.push(b`#return_values[${index}] = ${id};`[0]);
+                initializedIdentifiers.push(id.name);
+            }
+        }
+
+        const slot_definitions_present = component.slots.size || component.compile_options.dev || uses_slots;
+
+        if (slot_definitions_present) {
+            add_variable_to_ctx({ type: "Identifier", name: "#slots" });
+            add_variable_to_ctx({ type: "Identifier", name: "$$scope" });
+        }
+
         if (instance_javascript === null) {
             instance_javascript_with_ctx = instance_javascript;
         } else {
@@ -463,23 +471,17 @@ export default function dom(
     
                 if (Array.isArray(node) && node[0].type === 'VariableDeclaration') {
                     node[0].declarations.forEach(({ id }) => {
-                        const index = renderer.initial_context.findIndex(member => member.name === id.name);
-
-                        if (index >= 0) {
-                            instance_javascript_with_ctx.push(b`#return_values[${index}] = ${id};`[0]);
-                            initializedIdentifiers.push(id.name);
+                        if (id.type === 'ObjectPattern') {
+                            id.properties.forEach(property => add_variable_to_ctx(property.key));
+                        } else {
+                            add_variable_to_ctx(id);
                         }
                     });
                 }
     
                 if (node.type === 'FunctionDeclaration') {
                     if (!initializedIdentifiers.includes(node.id.name)) {
-                        const index = renderer.initial_context.findIndex(member => member.name === node.id.name);
-    
-                        if (index >= 0) {
-                            instance_javascript_with_ctx.push(b`#return_values[${index}] = ${node.id};`[0]);
-                            initializedIdentifiers.push(node.id.name);
-                        }
+                        add_variable_to_ctx(node.id);
                     }
                 }
             });
@@ -535,7 +537,7 @@ export default function dom(
 
 				${rest}
 
-				${component.slots.size || component.compile_options.dev || uses_slots ? b`let { $$slots: #slots = {}, $$scope } = $$props;` : null}
+				${slot_definitions_present ? b`let { $$slots: #slots = {}, $$scope } = $$props;` : null}
 				${component.compile_options.dev && b`@validate_slots('${component.tag}', #slots, [${[...component.slots.keys()].map(key => `'${key}'`).join(',')}]);`}
 				${compute_slots}
 
diff --git a/test/runtime/samples/error-handling-catch-after-error/_config.js b/test/runtime/samples/error-handling-catch-after-error/_config.js
deleted file mode 100644
index fab5d76ee60e..000000000000
--- a/test/runtime/samples/error-handling-catch-after-error/_config.js
+++ /dev/null
@@ -1,5 +0,0 @@
-export default {
-    test({ assert, component }) {
-        assert.equal(component.error, true);
-    }
-};
diff --git a/test/runtime/samples/error-handling-catch-after-error/main.svelte b/test/runtime/samples/error-handling-catch-after-error/main.svelte
deleted file mode 100644
index a5fdb5dfd89d..000000000000
--- a/test/runtime/samples/error-handling-catch-after-error/main.svelte
+++ /dev/null
@@ -1,12 +0,0 @@
-<script>
-    import { onError } from "svelte";
-
-    var a = {};
-    export var error = false;
-
-    a.b.c
-
-    onError(e => {
-        error = true;
-    });
-</script>
\ No newline at end of file

From 2dcee1fb8dbfa745cb293721a48e8e4579901600 Mon Sep 17 00:00:00 2001
From: rster20002 <rster2002dev@gmail.com>
Date: Thu, 12 Aug 2021 12:44:01 +0200
Subject: [PATCH 21/21] Actually fix lint errors

---
 src/compiler/compile/render_dom/index.ts | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/compiler/compile/render_dom/index.ts b/src/compiler/compile/render_dom/index.ts
index f2efe39cca7d..211390233d72 100644
--- a/src/compiler/compile/render_dom/index.ts
+++ b/src/compiler/compile/render_dom/index.ts
@@ -454,13 +454,13 @@ export default function dom(
                 instance_javascript_with_ctx.push(b`#return_values[${index}] = ${id};`[0]);
                 initializedIdentifiers.push(id.name);
             }
-        }
+        };
 
         const slot_definitions_present = component.slots.size || component.compile_options.dev || uses_slots;
 
         if (slot_definitions_present) {
-            add_variable_to_ctx({ type: "Identifier", name: "#slots" });
-            add_variable_to_ctx({ type: "Identifier", name: "$$scope" });
+            add_variable_to_ctx({ type: 'Identifier', name: '#slots' });
+            add_variable_to_ctx({ type: 'Identifier', name: '$$scope' });
         }
 
         if (instance_javascript === null) {