@lwc/engine-core 8.22.5 → 8.23.0

package/dist/framework/component.d.ts

@@ -8,6 +8,7 @@ type ComponentConstructorMetadata = {
     tmpl: Template;
     sel: string;
     apiVersion: APIVersion;
+    enableSyntheticElementInternals?: boolean | undefined;
 };
 /**
  * INTERNAL: This function can only be invoked by compiled code. The compiler
@@ -19,6 +20,7 @@ export declare function registerComponent(Ctor: any, metadata: ComponentConstruc
 export declare function getComponentRegisteredTemplate(Ctor: LightningElementConstructor): Template | undefined;
 export declare function getComponentRegisteredName(Ctor: LightningElementConstructor): string | undefined;
 export declare function getComponentAPIVersion(Ctor: LightningElementConstructor): APIVersion;
+export declare function supportsSyntheticElementInternals(Ctor: LightningElementConstructor): boolean;
 export declare function getTemplateReactiveObserver(vm: VM): ReactiveObserver;
 export declare function resetTemplateObserverAndUnsubscribe(vm: VM): void;
 export declare function renderComponent(vm: VM): VNodes;

package/dist/index.cjs.js

@@ -540,6 +540,18 @@ function unsubscribeFromSignals(target) {
         signalTracker.reset();
     }
 }
+/**
+ * A normalized string representation of an error, because browsers behave differently
+ */
+const errorWithStack = (err) => {
+    if (typeof err !== 'object' || err === null) {
+        return String(err);
+    }
+    const stack = 'stack' in err ? String(err.stack) : '';
+    const message = 'message' in err ? String(err.message) : '';
+    const constructor = err.constructor.name;
+    return stack.includes(message) ? stack : `${constructor}: ${message}\n${stack}`;
+};
 /**
  * This class is used to keep track of the signals associated to a given object.
  * It is used to prevent the LWC engine from subscribing duplicate callbacks multiple times
@@ -563,7 +575,7 @@ class SignalTracker {
             }
         }
         catch (err) {
-            logWarnOnce(`Attempted to subscribe to an object that has the shape of a signal but received the following error: ${err?.stack ?? err}`);
+            logWarnOnce(`Attempted to subscribe to an object that has the shape of a signal but received the following error: ${errorWithStack(err)}`);
         }
     }
     unsubscribeFromSignals() {
@@ -571,7 +583,7 @@ class SignalTracker {
             this.signalToUnsubscribeMap.forEach((unsubscribe) => unsubscribe());
         }
         catch (err) {
-            logWarnOnce(`Attempted to call a signal's unsubscribe callback but received the following error: ${err?.stack ?? err}`);
+            logWarnOnce(`Attempted to call a signal's unsubscribe callback but received the following error: ${errorWithStack(err)}`);
         }
     }
     reset() {
@@ -1849,16 +1861,35 @@ LightningElement.prototype = {
     },
     attachInternals() {
         const vm = getAssociatedVM(this);
-        const { elm, apiVersion, renderer: { attachInternals }, } = vm;
+        const { def: { ctor }, elm, apiVersion, renderer: { attachInternals }, } = vm;
         if (!shared.isAPIFeatureEnabled(7 /* APIFeature.ENABLE_ELEMENT_INTERNALS_AND_FACE */, apiVersion)) {
             throw new Error(`The attachInternals API is only supported in API version 61 and above. ` +
                 `The current version is ${apiVersion}. ` +
                 `To use this API, update the LWC component API version. https://lwc.dev/guide/versioning`);
         }
-        if (vm.shadowMode === 1 /* ShadowMode.Synthetic */) {
+        const internals = attachInternals(elm);
+        if (vm.shadowMode === 1 /* ShadowMode.Synthetic */ && supportsSyntheticElementInternals(ctor)) {
+            const handler = {
+                get(target, prop) {
+                    if (prop === 'shadowRoot') {
+                        return vm.shadowRoot;
+                    }
+                    const value = Reflect.get(target, prop);
+                    if (typeof value === 'function') {
+                        return value.bind(target);
+                    }
+                    return value;
+                },
+                set(target, prop, value) {
+                    return Reflect.set(target, prop, value);
+                },
+            };
+            return new Proxy(internals, handler);
+        }
+        else if (vm.shadowMode === 1 /* ShadowMode.Synthetic */) {
             throw new Error('attachInternals API is not supported in synthetic shadow.');
         }
-        return attachInternals(elm);
+        return internals;
     },
     get isConnected() {
         const vm = getAssociatedVM(this);
@@ -6693,6 +6724,9 @@ function getComponentAPIVersion(Ctor) {
     }
     return apiVersion;
 }
+function supportsSyntheticElementInternals(Ctor) {
+    return registeredComponentMap.get(Ctor)?.enableSyntheticElementInternals || false;
+}
 function getTemplateReactiveObserver(vm) {
     const reactiveObserver = createReactiveObserver(() => {
         const { isDirty } = vm;
@@ -6833,42 +6867,72 @@ class ContextBinding {
 }
 _ContextBinding_renderer = new WeakMap(), _ContextBinding_providedContextVarieties = new WeakMap(), _ContextBinding_elm = new WeakMap();
 function connectContext(vm) {
+    /**
+     * If ENABLE_LEGACY_CONTEXT_CONNECTION is true, enumerates directly on the component
+     * which can result in the component lifecycle observing properties that are not typically observed.
+     * See PR #5536 for more information.
+     */
+    if (lwcRuntimeFlags.ENABLE_LEGACY_CONTEXT_CONNECTION) {
+        connect(vm, shared.keys(shared.getPrototypeOf(vm.component)), vm.component);
+    }
+    else {
+        // Non-decorated objects
+        connect(vm, shared.keys(vm.cmpFields), vm.cmpFields);
+        // Decorated objects like @api context
+        connect(vm, shared.keys(vm.cmpProps), vm.cmpProps);
+    }
+}
+function disconnectContext(vm) {
+    /**
+     * If ENABLE_LEGACY_CONTEXT_CONNECTION is true, enumerates directly on the component
+     * which can result in the component lifecycle observing properties that are not typically observed.
+     * See PR #5536 for more information.
+     */
+    if (lwcRuntimeFlags.ENABLE_LEGACY_CONTEXT_CONNECTION) {
+        connect(vm, shared.keys(shared.getPrototypeOf(vm.component)), vm.component);
+    }
+    else {
+        // Non-decorated objects
+        disconnect(vm, shared.keys(vm.cmpFields), vm.cmpFields);
+        // Decorated objects like @api context
+        disconnect(vm, shared.keys(vm.cmpProps), vm.cmpProps);
+    }
+}
+function connect(vm, enumerableKeys, contextContainer) {
     const contextKeys = shared.getContextKeys();
     if (shared.isUndefined(contextKeys)) {
         return;
     }
     const { connectContext } = contextKeys;
     const { component } = vm;
-    const enumerableKeys = shared.keys(shared.getPrototypeOf(component));
-    const contextfulKeys = shared.ArrayFilter.call(enumerableKeys, (enumerableKey) => shared.isTrustedContext(component[enumerableKey]));
+    const contextfulKeys = shared.ArrayFilter.call(enumerableKeys, (enumerableKey) => shared.isTrustedContext(contextContainer[enumerableKey]));
     if (contextfulKeys.length === 0) {
         return;
     }
     const providedContextVarieties = new Map();
     try {
         for (let i = 0; i < contextfulKeys.length; i++) {
-            component[contextfulKeys[i]][connectContext](new ContextBinding(vm, component, providedContextVarieties));
+            contextContainer[contextfulKeys[i]][connectContext](new ContextBinding(vm, component, providedContextVarieties));
         }
     }
     catch (err) {
         logWarnOnce(`Attempted to connect to trusted context but received the following error: ${err.message}`);
     }
 }
-function disconnectContext(vm) {
+function disconnect(vm, enumerableKeys, contextContainer) {
     const contextKeys = shared.getContextKeys();
     if (!contextKeys) {
         return;
     }
     const { disconnectContext } = contextKeys;
     const { component } = vm;
-    const enumerableKeys = shared.keys(shared.getPrototypeOf(component));
-    const contextfulKeys = shared.ArrayFilter.call(enumerableKeys, (enumerableKey) => shared.isTrustedContext(component[enumerableKey]));
+    const contextfulKeys = shared.ArrayFilter.call(enumerableKeys, (enumerableKey) => shared.isTrustedContext(contextContainer[enumerableKey]));
     if (contextfulKeys.length === 0) {
         return;
     }
     try {
         for (let i = 0; i < contextfulKeys.length; i++) {
-            component[contextfulKeys[i]][disconnectContext](component);
+            contextContainer[contextfulKeys[i]][disconnectContext](component);
         }
     }
     catch (err) {
@@ -7479,8 +7543,10 @@ function forceRehydration(vm) {
     }
 }
 function runFormAssociatedCustomElementCallback(vm, faceCb, args) {
-    const { renderMode, shadowMode } = vm;
-    if (shadowMode === 1 /* ShadowMode.Synthetic */ && renderMode !== 0 /* RenderMode.Light */) {
+    const { renderMode, shadowMode, def: { ctor }, } = vm;
+    if (shadowMode === 1 /* ShadowMode.Synthetic */ &&
+        renderMode !== 0 /* RenderMode.Light */ &&
+        !supportsSyntheticElementInternals(ctor)) {
         throw new Error('Form associated lifecycle methods are not available in synthetic shadow. Please use native shadow or light DOM.');
     }
     invokeComponentCallback(vm, faceCb, args);
@@ -8759,5 +8825,5 @@ exports.swapTemplate = swapTemplate;
 exports.track = track;
 exports.unwrap = unwrap;
 exports.wire = wire;
-/** version: 8.22.5 */
+/** version: 8.23.0 */
 //# sourceMappingURL=index.cjs.js.map

package/dist/index.js

@@ -537,6 +537,18 @@ function unsubscribeFromSignals(target) {
         signalTracker.reset();
     }
 }
+/**
+ * A normalized string representation of an error, because browsers behave differently
+ */
+const errorWithStack = (err) => {
+    if (typeof err !== 'object' || err === null) {
+        return String(err);
+    }
+    const stack = 'stack' in err ? String(err.stack) : '';
+    const message = 'message' in err ? String(err.message) : '';
+    const constructor = err.constructor.name;
+    return stack.includes(message) ? stack : `${constructor}: ${message}\n${stack}`;
+};
 /**
  * This class is used to keep track of the signals associated to a given object.
  * It is used to prevent the LWC engine from subscribing duplicate callbacks multiple times
@@ -560,7 +572,7 @@ class SignalTracker {
             }
         }
         catch (err) {
-            logWarnOnce(`Attempted to subscribe to an object that has the shape of a signal but received the following error: ${err?.stack ?? err}`);
+            logWarnOnce(`Attempted to subscribe to an object that has the shape of a signal but received the following error: ${errorWithStack(err)}`);
         }
     }
     unsubscribeFromSignals() {
@@ -568,7 +580,7 @@ class SignalTracker {
             this.signalToUnsubscribeMap.forEach((unsubscribe) => unsubscribe());
         }
         catch (err) {
-            logWarnOnce(`Attempted to call a signal's unsubscribe callback but received the following error: ${err?.stack ?? err}`);
+            logWarnOnce(`Attempted to call a signal's unsubscribe callback but received the following error: ${errorWithStack(err)}`);
         }
     }
     reset() {
@@ -1846,16 +1858,35 @@ LightningElement.prototype = {
     },
     attachInternals() {
         const vm = getAssociatedVM(this);
-        const { elm, apiVersion, renderer: { attachInternals }, } = vm;
+        const { def: { ctor }, elm, apiVersion, renderer: { attachInternals }, } = vm;
         if (!isAPIFeatureEnabled(7 /* APIFeature.ENABLE_ELEMENT_INTERNALS_AND_FACE */, apiVersion)) {
             throw new Error(`The attachInternals API is only supported in API version 61 and above. ` +
                 `The current version is ${apiVersion}. ` +
                 `To use this API, update the LWC component API version. https://lwc.dev/guide/versioning`);
         }
-        if (vm.shadowMode === 1 /* ShadowMode.Synthetic */) {
+        const internals = attachInternals(elm);
+        if (vm.shadowMode === 1 /* ShadowMode.Synthetic */ && supportsSyntheticElementInternals(ctor)) {
+            const handler = {
+                get(target, prop) {
+                    if (prop === 'shadowRoot') {
+                        return vm.shadowRoot;
+                    }
+                    const value = Reflect.get(target, prop);
+                    if (typeof value === 'function') {
+                        return value.bind(target);
+                    }
+                    return value;
+                },
+                set(target, prop, value) {
+                    return Reflect.set(target, prop, value);
+                },
+            };
+            return new Proxy(internals, handler);
+        }
+        else if (vm.shadowMode === 1 /* ShadowMode.Synthetic */) {
             throw new Error('attachInternals API is not supported in synthetic shadow.');
         }
-        return attachInternals(elm);
+        return internals;
     },
     get isConnected() {
         const vm = getAssociatedVM(this);
@@ -6690,6 +6721,9 @@ function getComponentAPIVersion(Ctor) {
     }
     return apiVersion;
 }
+function supportsSyntheticElementInternals(Ctor) {
+    return registeredComponentMap.get(Ctor)?.enableSyntheticElementInternals || false;
+}
 function getTemplateReactiveObserver(vm) {
     const reactiveObserver = createReactiveObserver(() => {
         const { isDirty } = vm;
@@ -6830,42 +6864,72 @@ class ContextBinding {
 }
 _ContextBinding_renderer = new WeakMap(), _ContextBinding_providedContextVarieties = new WeakMap(), _ContextBinding_elm = new WeakMap();
 function connectContext(vm) {
+    /**
+     * If ENABLE_LEGACY_CONTEXT_CONNECTION is true, enumerates directly on the component
+     * which can result in the component lifecycle observing properties that are not typically observed.
+     * See PR #5536 for more information.
+     */
+    if (lwcRuntimeFlags.ENABLE_LEGACY_CONTEXT_CONNECTION) {
+        connect(vm, keys(getPrototypeOf$1(vm.component)), vm.component);
+    }
+    else {
+        // Non-decorated objects
+        connect(vm, keys(vm.cmpFields), vm.cmpFields);
+        // Decorated objects like @api context
+        connect(vm, keys(vm.cmpProps), vm.cmpProps);
+    }
+}
+function disconnectContext(vm) {
+    /**
+     * If ENABLE_LEGACY_CONTEXT_CONNECTION is true, enumerates directly on the component
+     * which can result in the component lifecycle observing properties that are not typically observed.
+     * See PR #5536 for more information.
+     */
+    if (lwcRuntimeFlags.ENABLE_LEGACY_CONTEXT_CONNECTION) {
+        connect(vm, keys(getPrototypeOf$1(vm.component)), vm.component);
+    }
+    else {
+        // Non-decorated objects
+        disconnect(vm, keys(vm.cmpFields), vm.cmpFields);
+        // Decorated objects like @api context
+        disconnect(vm, keys(vm.cmpProps), vm.cmpProps);
+    }
+}
+function connect(vm, enumerableKeys, contextContainer) {
     const contextKeys = getContextKeys();
     if (isUndefined$1(contextKeys)) {
         return;
     }
     const { connectContext } = contextKeys;
     const { component } = vm;
-    const enumerableKeys = keys(getPrototypeOf$1(component));
-    const contextfulKeys = ArrayFilter.call(enumerableKeys, (enumerableKey) => isTrustedContext(component[enumerableKey]));
+    const contextfulKeys = ArrayFilter.call(enumerableKeys, (enumerableKey) => isTrustedContext(contextContainer[enumerableKey]));
     if (contextfulKeys.length === 0) {
         return;
     }
     const providedContextVarieties = new Map();
     try {
         for (let i = 0; i < contextfulKeys.length; i++) {
-            component[contextfulKeys[i]][connectContext](new ContextBinding(vm, component, providedContextVarieties));
+            contextContainer[contextfulKeys[i]][connectContext](new ContextBinding(vm, component, providedContextVarieties));
         }
     }
     catch (err) {
         logWarnOnce(`Attempted to connect to trusted context but received the following error: ${err.message}`);
     }
 }
-function disconnectContext(vm) {
+function disconnect(vm, enumerableKeys, contextContainer) {
     const contextKeys = getContextKeys();
     if (!contextKeys) {
         return;
     }
     const { disconnectContext } = contextKeys;
     const { component } = vm;
-    const enumerableKeys = keys(getPrototypeOf$1(component));
-    const contextfulKeys = ArrayFilter.call(enumerableKeys, (enumerableKey) => isTrustedContext(component[enumerableKey]));
+    const contextfulKeys = ArrayFilter.call(enumerableKeys, (enumerableKey) => isTrustedContext(contextContainer[enumerableKey]));
     if (contextfulKeys.length === 0) {
         return;
     }
     try {
         for (let i = 0; i < contextfulKeys.length; i++) {
-            component[contextfulKeys[i]][disconnectContext](component);
+            contextContainer[contextfulKeys[i]][disconnectContext](component);
         }
     }
     catch (err) {
@@ -7476,8 +7540,10 @@ function forceRehydration(vm) {
     }
 }
 function runFormAssociatedCustomElementCallback(vm, faceCb, args) {
-    const { renderMode, shadowMode } = vm;
-    if (shadowMode === 1 /* ShadowMode.Synthetic */ && renderMode !== 0 /* RenderMode.Light */) {
+    const { renderMode, shadowMode, def: { ctor }, } = vm;
+    if (shadowMode === 1 /* ShadowMode.Synthetic */ &&
+        renderMode !== 0 /* RenderMode.Light */ &&
+        !supportsSyntheticElementInternals(ctor)) {
         throw new Error('Form associated lifecycle methods are not available in synthetic shadow. Please use native shadow or light DOM.');
     }
     invokeComponentCallback(vm, faceCb, args);
@@ -8685,5 +8751,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.22.5 */
+/** version: 8.23.0 */
 //# 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.22.5",
+    "version": "8.23.0",
     "description": "Core LWC engine APIs.",
     "keywords": [
         "lwc"
@@ -46,9 +46,9 @@
         }
     },
     "dependencies": {
-        "@lwc/features": "8.22.5",
-        "@lwc/shared": "8.22.5",
-        "@lwc/signals": "8.22.5"
+        "@lwc/features": "8.23.0",
+        "@lwc/shared": "8.23.0",
+        "@lwc/signals": "8.23.0"
     },
     "devDependencies": {
         "observable-membrane": "2.0.0"