diff --git a/.changeset/flat-flies-know.md b/.changeset/flat-flies-know.md new file mode 100644 index 0000000000..2eebab1ebb --- /dev/null +++ b/.changeset/flat-flies-know.md @@ -0,0 +1,5 @@ +--- +'svelte': patch +--- + +fix: allow custom element events on slot to bubble inside custom element diff --git a/packages/svelte/src/internal/client/dom/elements/events.js b/packages/svelte/src/internal/client/dom/elements/events.js index efbc568165..0e1624a118 100644 --- a/packages/svelte/src/internal/client/dom/elements/events.js +++ b/packages/svelte/src/internal/client/dom/elements/events.js @@ -233,7 +233,10 @@ export function handle_event_propagation(event) { while (current_target !== null) { /** @type {null | Element} */ var parent_element = - current_target.parentNode || /** @type {any} */ (current_target).host || null; + current_target.assignedSlot || + current_target.parentNode || + /** @type {any} */ (current_target).host || + null; try { // @ts-expect-error diff --git a/packages/svelte/tests/runtime-browser/custom-elements-samples/events-slotted/_config.js b/packages/svelte/tests/runtime-browser/custom-elements-samples/events-slotted/_config.js new file mode 100644 index 0000000000..0d9b5fb168 --- /dev/null +++ b/packages/svelte/tests/runtime-browser/custom-elements-samples/events-slotted/_config.js @@ -0,0 +1,21 @@ +import { test } from '../../assert'; +const tick = () => Promise.resolve(); + +export default test({ + async test({ assert, target }) { + target.innerHTML = ''; + + const custom_element = target.querySelector('custom-element'); + + const logs = []; + custom_element.callback = () => { + logs.push('called'); + }; + + await tick(); + /** @type {any} */ + const span = target.querySelector('span'); + span.click(); + assert.deepEqual(logs, ['called']); + } +}); diff --git a/packages/svelte/tests/runtime-browser/custom-elements-samples/events-slotted/main.svelte b/packages/svelte/tests/runtime-browser/custom-elements-samples/events-slotted/main.svelte new file mode 100644 index 0000000000..c31aded974 --- /dev/null +++ b/packages/svelte/tests/runtime-browser/custom-elements-samples/events-slotted/main.svelte @@ -0,0 +1,7 @@ + + +