mirrors/svelte
mirrors/svelte
0
0
Fork 0
mirror of https://github.com/sveltejs/svelte.git synced 2024-11-24 00:07:30 +01:00
Code Issues Releases Wiki Activity

chore: use unbound event listeners (#12165)

Browse Source
This commit is contained in:
Rich Harris 2024-06-24 12:03:42 -07:00 committed by GitHub
parent 752f872a1d
commit 7e462eec26
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 13 additions and 26 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
packages/svelte/src/internal/client/dom/elements/events.js
View File

@ -44,7 +44,7 @@ export function create_event(event_name, dom, handler, options) {
function target_handler(/** @type {Event} */ event) {
if (!options.capture) {
// Only call in the bubble phase, else delegated events would be called before the capturing events
handle_event_propagation(dom, event);
handle_event_propagation.call(dom, event);
}
if (!event.cancelBubble) {
return handler.call(this, event);
@ -143,11 +143,12 @@ export function delegate(events) {
}
/**
* @param {EventTarget} handler_element
* @this {EventTarget}
* @param {Event} event
* @returns {void}
*/
export function handle_event_propagation(handler_element, event) {
export function handle_event_propagation(event) {
var handler_element = this;
var owner_document = /** @type {Node} */ (handler_element).ownerDocument;
var event_name = event.type;
var path = event.composedPath?.() || [];

32
packages/svelte/src/internal/client/render.js
View File

@ -196,38 +196,23 @@ function _mount(Component, { target, anchor, props = {}, events, context, intro
const registered_events = new Set();
const bound_event_listener = handle_event_propagation.bind(null, target);
const bound_document_event_listener = handle_event_propagation.bind(null, document);
/** @param {Array<string>} events */
const event_handle = (events) => {
for (let i = 0; i < events.length; i++) {
const event_name = events[i];
const passive = PassiveDelegatedEvents.includes(event_name);
if (!registered_events.has(event_name)) {
registered_events.add(event_name);
// Add the event listener to both the container and the document.
// The container listener ensures we catch events from within in case
// the outer content stops propagation of the event.
target.addEventListener(
event_name,
bound_event_listener,
PassiveDelegatedEvents.includes(event_name)
? {
passive: true
}
: undefined
);
target.addEventListener(event_name, handle_event_propagation, { passive });
// The document listener ensures we catch events that originate from elements that were
// manually moved outside of the container (e.g. via manual portals).
document.addEventListener(
event_name,
bound_document_event_listener,
PassiveDelegatedEvents.includes(event_name)
? {
passive: true
}
: undefined
);
document.addEventListener(event_name, handle_event_propagation, { passive });
}
}
};
@ -264,9 +249,10 @@ function _mount(Component, { target, anchor, props = {}, events, context, intro
return () => {
for (const event_name of registered_events) {
target.removeEventListener(event_name, bound_event_listener);
document.removeEventListener(event_name, bound_document_event_listener);
target.removeEventListener(event_name, handle_event_propagation);
document.removeEventListener(event_name, handle_event_propagation);
}
root_event_handles.delete(event_handle);
mounted_components.delete(component);
};