From 070b05696cfa3a89af539e62b68fa650873f64b0 Mon Sep 17 00:00:00 2001 From: Rich Harris Date: Sat, 20 Apr 2024 10:26:08 -0400 Subject: [PATCH 1/3] fix: allow events to continue propagating following an error --- .changeset/light-penguins-invent.md | 5 ++ .../internal/client/dom/elements/events.js | 56 +++++++++++-------- 2 files changed, 37 insertions(+), 24 deletions(-) create mode 100644 .changeset/light-penguins-invent.md diff --git a/.changeset/light-penguins-invent.md b/.changeset/light-penguins-invent.md new file mode 100644 index 000000000000..2610fddf069a --- /dev/null +++ b/.changeset/light-penguins-invent.md @@ -0,0 +1,5 @@ +--- +'svelte': patch +--- + +fix: allow events to continue propagating following an error diff --git a/packages/svelte/src/internal/client/dom/elements/events.js b/packages/svelte/src/internal/client/dom/elements/events.js index 330bcc266128..c006743acd83 100644 --- a/packages/svelte/src/internal/client/dom/elements/events.js +++ b/packages/svelte/src/internal/client/dom/elements/events.js @@ -122,36 +122,44 @@ export function handle_event_propagation(handler_element, event) { } }); - while (current_target !== null) { + /** @param {Element} current_target */ + function next(current_target) { /** @type {null | Element} */ var parent_element = current_target.parentNode || /** @type {any} */ (current_target).host || null; - var internal_prop_name = '__' + event_name; - // @ts-ignore - var delegated = current_target[internal_prop_name]; - - if (delegated !== undefined && !(/** @type {any} */ (current_target).disabled)) { - if (is_array(delegated)) { - var [fn, ...data] = delegated; - fn.apply(current_target, [event, ...data]); - } else { - delegated.call(current_target, event); + + try { + // @ts-expect-error + var delegated = current_target['__' + event_name]; + + if (delegated !== undefined && !(/** @type {any} */ (current_target).disabled)) { + if (is_array(delegated)) { + var [fn, ...data] = delegated; + fn.apply(current_target, [event, ...data]); + } else { + delegated.call(current_target, event); + } + } + } finally { + if ( + event.cancelBubble || + parent_element === handler_element || + parent_element === null || + current_target === handler_element + ) { + return; } - } - if ( - event.cancelBubble || - parent_element === handler_element || - current_target === handler_element - ) { - break; + next(parent_element); } - - current_target = parent_element; } - // @ts-expect-error is used above - event.__root = handler_element; - // @ts-expect-error is used above - current_target = handler_element; + try { + next(current_target); + } finally { + // @ts-expect-error is used above + event.__root = handler_element; + // @ts-expect-error is used above + current_target = handler_element; + } } From 82873e6a63bff19a478fc7e337aab534fc85a3e1 Mon Sep 17 00:00:00 2001 From: Rich Harris Date: Sat, 20 Apr 2024 10:29:43 -0400 Subject: [PATCH 2/3] test --- .../event-propagation-with-error/_config.js | 15 +++++++++++++++ .../event-propagation-with-error/main.svelte | 19 +++++++++++++++++++ 2 files changed, 34 insertions(+) create mode 100644 packages/svelte/tests/runtime-runes/samples/event-propagation-with-error/_config.js create mode 100644 packages/svelte/tests/runtime-runes/samples/event-propagation-with-error/main.svelte diff --git a/packages/svelte/tests/runtime-runes/samples/event-propagation-with-error/_config.js b/packages/svelte/tests/runtime-runes/samples/event-propagation-with-error/_config.js new file mode 100644 index 000000000000..d12f42f8634c --- /dev/null +++ b/packages/svelte/tests/runtime-runes/samples/event-propagation-with-error/_config.js @@ -0,0 +1,15 @@ +import { flushSync } from 'svelte'; +import { test } from '../../test'; + +export default test({ + html: `
`, + + async test({ assert, target }) { + const button1 = target.querySelector('button'); + + flushSync(() => button1?.click()); + assert.htmlEqual(target.innerHTML, `
`); + }, + + runtime_error: 'nope' +}); diff --git a/packages/svelte/tests/runtime-runes/samples/event-propagation-with-error/main.svelte b/packages/svelte/tests/runtime-runes/samples/event-propagation-with-error/main.svelte new file mode 100644 index 000000000000..4bab3363479d --- /dev/null +++ b/packages/svelte/tests/runtime-runes/samples/event-propagation-with-error/main.svelte @@ -0,0 +1,19 @@ + + +
+ +
From 257496603c41d7dc92697667a736aef71f6ffa6b Mon Sep 17 00:00:00 2001 From: Rich Harris Date: Sat, 20 Apr 2024 10:35:08 -0400 Subject: [PATCH 3/3] appease eslint --- .../src/internal/client/dom/elements/events.js | 12 +++++------- 1 file changed, 5 insertions(+), 7 deletions(-) diff --git a/packages/svelte/src/internal/client/dom/elements/events.js b/packages/svelte/src/internal/client/dom/elements/events.js index c006743acd83..536b1c044244 100644 --- a/packages/svelte/src/internal/client/dom/elements/events.js +++ b/packages/svelte/src/internal/client/dom/elements/events.js @@ -142,15 +142,13 @@ export function handle_event_propagation(handler_element, event) { } } finally { if ( - event.cancelBubble || - parent_element === handler_element || - parent_element === null || - current_target === handler_element + !event.cancelBubble && + parent_element !== handler_element && + parent_element !== null && + current_target !== handler_element ) { - return; + next(parent_element); } - - next(parent_element); } }