fix: pass all the args to custom renderer events

pull/18058/head
paoloricciuti 5 months ago
parent e2cedcd93e
commit e0a5e4fa35

@ -69,15 +69,17 @@ export function create_event(event_name, dom, handler, options = {}) {
/** /**
* @this {EventTarget} * @this {EventTarget}
* @param {...any} args
*/ */
function target_handler(/** @type {Event} */ event) { function target_handler(...args) {
if (is_custom_renderer) { if (is_custom_renderer) {
// Custom renderers don't use DOM event propagation/delegation, // Custom renderers don't use DOM event propagation/delegation,
// so just call the handler directly // so just call the handler directly
return without_reactive_context(() => { return without_reactive_context(() => {
return handler?.call(this, event); return handler?.apply(this, /** @type {any} */ (args));
}); });
} }
var event = /** @type {Event} */ (args[0]);
if (!options.capture) { if (!options.capture) {
// Only call in the bubble phase, else delegated events would be called before the capturing events // Only call in the bubble phase, else delegated events would be called before the capturing events
handle_event_propagation.call(dom, event); handle_event_propagation.call(dom, event);

@ -11,14 +11,14 @@ export default test({
const listeners = button.listeners?.click; const listeners = button.listeners?.click;
assert.ok(listeners, 'button should have click listeners'); assert.ok(listeners, 'button should have click listeners');
// Call the handler with a plain object that is NOT a DOM Event. // Call the handler with multiple arguments.
// If handle_event_propagation is called, it will fail because // Custom renderers may pass multiple arguments to event handlers,
// it tries to access DOM-specific properties like composedPath, ownerDocument, etc. // so we need to make sure all arguments are forwarded.
for (const { handler } of listeners) { for (const { handler } of listeners) {
handler.call(button, { type: 'click' }); handler.call(button, { type: 'click' }, 'extra', 42);
} }
flushSync(); flushSync();
assert.deepEqual(logs, [{ type: 'click' }]); assert.deepEqual(logs, [{ type: 'click' }, 'extra', 42]);
} }
}); });

@ -1,6 +1,6 @@
<script> <script>
function increment(e) { function increment(...args) {
console.log(e); console.log(...args);
} }
</script> </script>

Loading…
Cancel
Save