@lwc/engine-core 8.18.1 → 8.18.2

package/dist/framework/modules/dynamic-events.d.ts

@@ -0,0 +1,5 @@
+import type { VM } from '../vm';
+import type { VBaseElement } from '../vnodes';
+import type { RendererAPI } from '../renderer';
+export declare function patchDynamicEventListeners(oldVnode: VBaseElement | null, vnode: VBaseElement, renderer: RendererAPI, owner: VM): void;
+//# sourceMappingURL=dynamic-events.d.ts.map

package/dist/framework/vm.d.ts

@@ -72,6 +72,8 @@ export interface VM<N = HostNode, E = HostElement> {
     readonly owner: VM<N, E> | null;
     /** References to elements rendered using lwc:ref (template refs) */
     refVNodes: RefVNodes | null;
+    /** event listeners added to elements corresponding to functions provided by lwc:on */
+    attachedEventListeners: WeakMap<Element, Record<string, EventListener | undefined>>;
     /** Whether or not the VM was hydrated */
     readonly hydrated: boolean;
     /** Rendering operations associated with the VM */

package/dist/framework/vnodes.d.ts

@@ -109,6 +109,8 @@ export interface VNodeData {
     readonly styleDecls?: ReadonlyArray<[string, string, boolean]>;
     readonly context?: Readonly<Record<string, Readonly<Record<string, any>>>>;
     readonly on?: Readonly<Record<string, (event: Event) => any>>;
+    readonly dynamicOn?: Readonly<Record<string, (event: Event) => any>>;
+    readonly dynamicOnRaw?: Readonly<Record<string, (event: Event) => any>>;
     readonly svg?: boolean;
     readonly renderer?: RendererAPI;
 }

package/dist/index.cjs.js

@@ -251,16 +251,6 @@ function shouldBeFormAssociated(Ctor) {
     }
     return ctorFormAssociated && apiFeatureEnabled;
 }
-// check if a property is in an object, and if the object throws an error merely because we are
-// checking if the property exists, return false
-function safeHasProp(obj, prop) {
-    try {
-        return prop in obj;
-    }
-    catch (_err) {
-        return false;
-    }
-}
 
 /*
  * Copyright (c) 2024, Salesforce, Inc.
@@ -620,9 +610,6 @@ function componentValueObserved(vm, key, target = {}) {
     if (lwcRuntimeFlags.ENABLE_EXPERIMENTAL_SIGNALS &&
         shared.isObject(target) &&
         !shared.isNull(target) &&
-        safeHasProp(target, 'value') &&
-        safeHasProp(target, 'subscribe') &&
-        shared.isFunction(target.subscribe) &&
         shared.isTrustedSignal(target) &&
         // Only subscribe if a template is being rendered by the engine
         tro.isObserving()) {
@@ -4243,6 +4230,73 @@ function applyEventListeners(vnode, renderer) {
     }
 }
 
+/*
+ * Copyright (c) 2025, salesforce.com, inc.
+ * All rights reserved.
+ * SPDX-License-Identifier: MIT
+ * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
+ */
+function patchDynamicEventListeners(oldVnode, vnode, renderer, owner) {
+    const { elm, data: { dynamicOn, dynamicOnRaw }, sel, } = vnode;
+    // dynamicOn : A cloned version of the object passed to lwc:on, with null prototype and only its own enumerable properties.
+    const oldDynamicOn = oldVnode?.data?.dynamicOn ?? EmptyObject;
+    const newDynamicOn = dynamicOn ?? EmptyObject;
+    // dynamicOnRaw : object passed to lwc:on
+    // Compare dynamicOnRaw to check if same object is passed to lwc:on
+    const isObjectSame = oldVnode?.data?.dynamicOnRaw === dynamicOnRaw;
+    const { addEventListener, removeEventListener } = renderer;
+    const attachedEventListeners = getAttachedEventListeners(owner, elm);
+    // Properties that are present in 'oldDynamicOn' but not in 'newDynamicOn'
+    for (const eventType in oldDynamicOn) {
+        if (!(eventType in newDynamicOn)) {
+            // log error if same object is passed
+            if (isObjectSame && process.env.NODE_ENV !== 'production') {
+                logError(`Detected mutation of property '${eventType}' in the object passed to lwc:on for <${sel}>. Reusing the same object with modified properties is prohibited. Please pass a new object instead.`, owner);
+            }
+            // Remove listeners that were attached previously but don't have a corresponding property in `newDynamicOn`
+            const attachedEventListener = attachedEventListeners[eventType];
+            removeEventListener(elm, eventType, attachedEventListener);
+            attachedEventListeners[eventType] = undefined;
+        }
+    }
+    // Ensure that the event listeners that are attached match what is present in `newDynamicOn`
+    for (const eventType in newDynamicOn) {
+        const typeExistsInOld = eventType in oldDynamicOn;
+        const newCallback = newDynamicOn[eventType];
+        // Skip if callback hasn't changed
+        if (typeExistsInOld && oldDynamicOn[eventType] === newCallback) {
+            continue;
+        }
+        // log error if same object is passed
+        if (isObjectSame && process.env.NODE_ENV !== 'production') {
+            logError(`Detected mutation of property '${eventType}' in the object passed to lwc:on for <${sel}>. Reusing the same object with modified properties is prohibited. Please pass a new object instead.`, owner);
+        }
+        // Remove listener that was attached previously
+        if (typeExistsInOld) {
+            const attachedEventListener = attachedEventListeners[eventType];
+            removeEventListener(elm, eventType, attachedEventListener);
+        }
+        // Bind new callback to owner component and add it as listener to element
+        const newBoundEventListener = bindEventListener(owner, newCallback);
+        addEventListener(elm, eventType, newBoundEventListener);
+        // Store the newly added eventListener
+        attachedEventListeners[eventType] = newBoundEventListener;
+    }
+}
+function getAttachedEventListeners(vm, elm) {
+    let attachedEventListeners = vm.attachedEventListeners.get(elm);
+    if (shared.isUndefined(attachedEventListeners)) {
+        attachedEventListeners = {};
+        vm.attachedEventListeners.set(elm, attachedEventListeners);
+    }
+    return attachedEventListeners;
+}
+function bindEventListener(vm, fn) {
+    return function (event) {
+        invokeEventListener(vm, fn, vm.component, event);
+    };
+}
+
 /*
  * Copyright (c) 2018, salesforce.com, inc.
  * All rights reserved.
@@ -4895,6 +4949,7 @@ function patchElementPropsAndAttrsAndRefs$1(oldVnode, vnode, renderer) {
         applyStaticStyleAttribute(vnode, renderer);
     }
     const { owner } = vnode;
+    patchDynamicEventListeners(oldVnode, vnode, renderer, owner);
     // Attrs need to be applied to element before props IE11 will wipe out value on radio inputs if
     // value is set before type=radio.
     patchClassAttribute(oldVnode, vnode, renderer);
@@ -6776,6 +6831,7 @@ function createVM(elm, ctor, renderer, options) {
         mode,
         owner,
         refVNodes: null,
+        attachedEventListeners: new WeakMap(),
         children: EmptyArray,
         aChildren: EmptyArray,
         velements: EmptyArray,
@@ -7982,6 +8038,7 @@ function handleMismatch(node, vnode, renderer) {
 }
 function patchElementPropsAndAttrsAndRefs(vnode, renderer) {
     applyEventListeners(vnode, renderer);
+    patchDynamicEventListeners(null, vnode, renderer, vnode.owner);
     patchProps(null, vnode, renderer);
     // The `refs` object is blown away in every re-render, so we always need to re-apply them
     applyRefs(vnode, vnode.owner);
@@ -8529,5 +8586,5 @@ exports.swapTemplate = swapTemplate;
 exports.track = track;
 exports.unwrap = unwrap;
 exports.wire = wire;
-/** version: 8.18.1 */
+/** version: 8.18.2 */
 //# sourceMappingURL=index.cjs.js.map

package/dist/index.js

@@ -248,16 +248,6 @@ function shouldBeFormAssociated(Ctor) {
     }
     return ctorFormAssociated && apiFeatureEnabled;
 }
-// check if a property is in an object, and if the object throws an error merely because we are
-// checking if the property exists, return false
-function safeHasProp(obj, prop) {
-    try {
-        return prop in obj;
-    }
-    catch (_err) {
-        return false;
-    }
-}
 
 /*
  * Copyright (c) 2024, Salesforce, Inc.
@@ -617,9 +607,6 @@ function componentValueObserved(vm, key, target = {}) {
     if (lwcRuntimeFlags.ENABLE_EXPERIMENTAL_SIGNALS &&
         isObject(target) &&
         !isNull(target) &&
-        safeHasProp(target, 'value') &&
-        safeHasProp(target, 'subscribe') &&
-        isFunction$1(target.subscribe) &&
         isTrustedSignal(target) &&
         // Only subscribe if a template is being rendered by the engine
         tro.isObserving()) {
@@ -4240,6 +4227,73 @@ function applyEventListeners(vnode, renderer) {
     }
 }
 
+/*
+ * Copyright (c) 2025, salesforce.com, inc.
+ * All rights reserved.
+ * SPDX-License-Identifier: MIT
+ * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
+ */
+function patchDynamicEventListeners(oldVnode, vnode, renderer, owner) {
+    const { elm, data: { dynamicOn, dynamicOnRaw }, sel, } = vnode;
+    // dynamicOn : A cloned version of the object passed to lwc:on, with null prototype and only its own enumerable properties.
+    const oldDynamicOn = oldVnode?.data?.dynamicOn ?? EmptyObject;
+    const newDynamicOn = dynamicOn ?? EmptyObject;
+    // dynamicOnRaw : object passed to lwc:on
+    // Compare dynamicOnRaw to check if same object is passed to lwc:on
+    const isObjectSame = oldVnode?.data?.dynamicOnRaw === dynamicOnRaw;
+    const { addEventListener, removeEventListener } = renderer;
+    const attachedEventListeners = getAttachedEventListeners(owner, elm);
+    // Properties that are present in 'oldDynamicOn' but not in 'newDynamicOn'
+    for (const eventType in oldDynamicOn) {
+        if (!(eventType in newDynamicOn)) {
+            // log error if same object is passed
+            if (isObjectSame && process.env.NODE_ENV !== 'production') {
+                logError(`Detected mutation of property '${eventType}' in the object passed to lwc:on for <${sel}>. Reusing the same object with modified properties is prohibited. Please pass a new object instead.`, owner);
+            }
+            // Remove listeners that were attached previously but don't have a corresponding property in `newDynamicOn`
+            const attachedEventListener = attachedEventListeners[eventType];
+            removeEventListener(elm, eventType, attachedEventListener);
+            attachedEventListeners[eventType] = undefined;
+        }
+    }
+    // Ensure that the event listeners that are attached match what is present in `newDynamicOn`
+    for (const eventType in newDynamicOn) {
+        const typeExistsInOld = eventType in oldDynamicOn;
+        const newCallback = newDynamicOn[eventType];
+        // Skip if callback hasn't changed
+        if (typeExistsInOld && oldDynamicOn[eventType] === newCallback) {
+            continue;
+        }
+        // log error if same object is passed
+        if (isObjectSame && process.env.NODE_ENV !== 'production') {
+            logError(`Detected mutation of property '${eventType}' in the object passed to lwc:on for <${sel}>. Reusing the same object with modified properties is prohibited. Please pass a new object instead.`, owner);
+        }
+        // Remove listener that was attached previously
+        if (typeExistsInOld) {
+            const attachedEventListener = attachedEventListeners[eventType];
+            removeEventListener(elm, eventType, attachedEventListener);
+        }
+        // Bind new callback to owner component and add it as listener to element
+        const newBoundEventListener = bindEventListener(owner, newCallback);
+        addEventListener(elm, eventType, newBoundEventListener);
+        // Store the newly added eventListener
+        attachedEventListeners[eventType] = newBoundEventListener;
+    }
+}
+function getAttachedEventListeners(vm, elm) {
+    let attachedEventListeners = vm.attachedEventListeners.get(elm);
+    if (isUndefined$1(attachedEventListeners)) {
+        attachedEventListeners = {};
+        vm.attachedEventListeners.set(elm, attachedEventListeners);
+    }
+    return attachedEventListeners;
+}
+function bindEventListener(vm, fn) {
+    return function (event) {
+        invokeEventListener(vm, fn, vm.component, event);
+    };
+}
+
 /*
  * Copyright (c) 2018, salesforce.com, inc.
  * All rights reserved.
@@ -4892,6 +4946,7 @@ function patchElementPropsAndAttrsAndRefs$1(oldVnode, vnode, renderer) {
         applyStaticStyleAttribute(vnode, renderer);
     }
     const { owner } = vnode;
+    patchDynamicEventListeners(oldVnode, vnode, renderer, owner);
     // Attrs need to be applied to element before props IE11 will wipe out value on radio inputs if
     // value is set before type=radio.
     patchClassAttribute(oldVnode, vnode, renderer);
@@ -6773,6 +6828,7 @@ function createVM(elm, ctor, renderer, options) {
         mode,
         owner,
         refVNodes: null,
+        attachedEventListeners: new WeakMap(),
         children: EmptyArray,
         aChildren: EmptyArray,
         velements: EmptyArray,
@@ -7979,6 +8035,7 @@ function handleMismatch(node, vnode, renderer) {
 }
 function patchElementPropsAndAttrsAndRefs(vnode, renderer) {
     applyEventListeners(vnode, renderer);
+    patchDynamicEventListeners(null, vnode, renderer, vnode.owner);
     patchProps(null, vnode, renderer);
     // The `refs` object is blown away in every re-render, so we always need to re-apply them
     applyRefs(vnode, vnode.owner);
@@ -8475,5 +8532,5 @@ function readonly(obj) {
 }
 
 export { BaseBridgeElement, LightningElement, profilerControl as __unstable__ProfilerControl, reportingControl as __unstable__ReportingControl, api$1 as api, computeShadowAndRenderMode, connectRootElement, createContextProviderWithRegister, createVM, disconnectRootElement, freezeTemplate, getAssociatedVMIfPresent, getComponentAPIVersion, getComponentConstructor, getComponentDef, getComponentHtmlPrototype, hydrateRoot, isComponentConstructor, parseFragment, parseSVGFragment, readonly, registerComponent, registerDecorators, registerTemplate, runFormAssociatedCallback, runFormDisabledCallback, runFormResetCallback, runFormStateRestoreCallback, sanitizeAttribute, shouldBeFormAssociated, swapComponent, swapStyle, swapTemplate, track, unwrap, wire };
-/** version: 8.18.1 */
+/** version: 8.18.2 */
 //# sourceMappingURL=index.js.map

package/package.json

@@ -4,7 +4,7 @@
         "You can safely modify dependencies, devDependencies, keywords, etc., but other props will be overwritten."
     ],
     "name": "@lwc/engine-core",
-    "version": "8.18.1",
+    "version": "8.18.2",
     "description": "Core LWC engine APIs.",
     "keywords": [
         "lwc"
@@ -46,9 +46,9 @@
         }
     },
     "dependencies": {
-        "@lwc/features": "8.18.1",
-        "@lwc/shared": "8.18.1",
-        "@lwc/signals": "8.18.1"
+        "@lwc/features": "8.18.2",
+        "@lwc/shared": "8.18.2",
+        "@lwc/signals": "8.18.2"
     },
     "devDependencies": {
         "observable-membrane": "2.0.0"