@lwc/engine-core 2.45.1 → 2.45.3

package/dist/framework/attributes.d.ts

@@ -0,0 +1 @@
+export declare const defaultDefHTMLPropertyNames: string[];

package/{types → dist}/framework/wiring/types.d.ts

@@ -10,7 +10,9 @@ export interface WireAdapter {
     disconnect(): void;
 }
 export interface WireAdapterConstructor {
-    new (callback: DataCallback): WireAdapter;
+    new (callback: DataCallback, sourceContext?: {
+        tagName: string;
+    }): WireAdapter;
     configSchema?: Record<string, WireAdapterSchemaValue>;
     contextSchema?: Record<string, WireAdapterSchemaValue>;
 }

package/dist/{engine-core.cjs.js → index.cjs.js}

@@ -1,6 +1,10 @@
-/* proxy-compat-disable */
+/**
+ * Copyright (C) 2023 salesforce.com, inc.
+ */
 'use strict';
 
+Object.defineProperty(exports, '__esModule', { value: true });
+
 var shared = require('@lwc/shared');
 var ariaReflection = require('@lwc/aria-reflection');
 var features = require('@lwc/features');
@@ -446,19 +450,6 @@ const defaultDefHTMLPropertyNames = [
     'tabIndex',
     'title',
 ];
-let controlledElement = null;
-let controlledAttributeName;
-function isAttributeLocked(elm, attrName) {
-    return elm !== controlledElement || attrName !== controlledAttributeName;
-}
-function lockAttribute(_elm, _key) {
-    controlledElement = null;
-    controlledAttributeName = undefined;
-}
-function unlockAttribute(elm, key) {
-    controlledElement = elm;
-    controlledAttributeName = key;
-}
 
 /*
  * Copyright (c) 2018, salesforce.com, inc.
@@ -497,6 +488,7 @@ shared.forEach.call(defaultDefHTMLPropertyNames, (propName) => {
  * SPDX-License-Identifier: MIT
  * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
  */
+/* eslint @lwc/lwc-internal/no-production-assert: "off" */
 function generateDataDescriptor(options) {
     return shared.assign({
         configurable: true,
@@ -1326,6 +1318,14 @@ function markLockerLiveObject(obj) {
  * SPDX-License-Identifier: MIT
  * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
  */
+/**
+ * This module is responsible for producing the ComponentDef object that is always
+ * accessible via `vm.def`. This is lazily created during the creation of the first
+ * instance of a component class, and shared across all instances.
+ *
+ * This structure can be used to synthetically create proxies, and understand the
+ * shape of a component. It is also used internally to apply extra optimizations.
+ */
 /**
  * This operation is called with a descriptor of an standard html property
  * that a Custom Element can support (including AOM properties), which
@@ -1489,15 +1489,11 @@ LightningElement.prototype = {
     removeAttribute(name) {
         const vm = getAssociatedVM(this);
         const { elm, renderer: { removeAttribute }, } = vm;
-        unlockAttribute(elm, name);
         removeAttribute(elm, name);
-        lockAttribute();
     },
     removeAttributeNS(namespace, name) {
         const { elm, renderer: { removeAttribute }, } = getAssociatedVM(this);
-        unlockAttribute(elm, name);
         removeAttribute(elm, name, namespace);
-        lockAttribute();
     },
     getAttribute(name) {
         const vm = getAssociatedVM(this);
@@ -1519,9 +1515,7 @@ LightningElement.prototype = {
                 logError(`Failed to construct '${getComponentTag(vm)}': The result must not have attributes.`);
             }
         }
-        unlockAttribute(elm, name);
         setAttribute(elm, name, value);
-        lockAttribute();
     },
     setAttributeNS(namespace, name, value) {
         const vm = getAssociatedVM(this);
@@ -1531,9 +1525,7 @@ LightningElement.prototype = {
                 logError(`Failed to construct '${getComponentTag(vm)}': The result must not have attributes.`);
             }
         }
-        unlockAttribute(elm, name);
         setAttribute(elm, name, value, namespace);
-        lockAttribute();
     },
     getBoundingClientRect() {
         const vm = getAssociatedVM(this);
@@ -1915,7 +1907,7 @@ function createConnector(vm, name, wireDef) {
     });
     runWithBoundaryProtection(vm, vm, shared.noop, () => {
         // job
-        connector = new adapter(dataCallback);
+        connector = new adapter(dataCallback, { tagName: vm.tagName });
     }, shared.noop);
     const updateConnectorConfig = (config) => {
         // every time the config is recomputed due to tracking,
@@ -2483,6 +2475,10 @@ function sanitizeAttribute(tagName, namespaceUri, attrName, attrValue) {
  * SPDX-License-Identifier: MIT
  * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
  */
+/**
+ * This module is responsible for creating the base bridge class BaseBridgeElement
+ * that represents the HTMLElement extension used for any LWC inserted in the DOM.
+ */
 // A bridge descriptor is a descriptor whose job is just to get the component instance
 // from the element instance, and get the value or set a new value on the component.
 // This means that across different elements, similar names can get the exact same
@@ -2536,14 +2532,6 @@ function createAttributeChangedCallback(attributeToPropMap, superAttributeChange
             }
             return;
         }
-        if (!isAttributeLocked(this, attrName)) {
-            // Ignore changes triggered by the engine itself during:
-            // * diffing when public props are attempting to reflect to the DOM
-            // * component via `this.setAttribute()`, should never update the prop
-            // Both cases, the setAttribute call is always wrapped by the unlocking of the
-            // attribute to be changed
-            return;
-        }
         // Reflect attribute change to the corresponding property when changed from outside.
         this[propName] = newValue;
     };
@@ -2888,6 +2876,14 @@ function swapStyle(oldStyle, newStyle) {
  * SPDX-License-Identifier: MIT
  * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
  */
+/**
+ * This module is responsible for producing the ComponentDef object that is always
+ * accessible via `vm.def`. This is lazily created during the creation of the first
+ * instance of a component class, and shared across all instances.
+ *
+ * This structure can be used to synthetically create proxies, and understand the
+ * shape of a component. It is also used internally to apply extra optimizations.
+ */
 const CtorToDefMap = new WeakMap();
 function getCtorProto(Ctor) {
     let proto = shared.getPrototypeOf(Ctor);
@@ -3329,7 +3325,6 @@ function patchAttributes(oldVnode, vnode, renderer) {
         const cur = attrs[key];
         const old = oldAttrs[key];
         if (old !== cur) {
-            unlockAttribute(elm, key);
             if (shared.StringCharCodeAt.call(key, 3) === ColonCharCode$1) {
                 // Assume xml namespace
                 setAttribute(elm, key, cur, shared.XML_NAMESPACE);
@@ -3344,7 +3339,6 @@ function patchAttributes(oldVnode, vnode, renderer) {
             else {
                 setAttribute(elm, key, cur);
             }
-            lockAttribute();
         }
     }
 }
@@ -6240,6 +6234,27 @@ function textNodeContentsAreEqual(node, vnode, renderer) {
     }
     return false;
 }
+// The validationOptOut static property can be an array of attribute names.
+// Any attribute names specified in that array will not be validated, and the
+// LWC runtime will assume that VDOM attrs and DOM attrs are in sync.
+function getValidationPredicate(optOutStaticProp) {
+    if (shared.isUndefined(optOutStaticProp)) {
+        return (_attrName) => true;
+    }
+    // If validationOptOut is true, no attributes will be checked for correctness
+    // and the runtime will assume VDOM attrs and DOM attrs are in sync.
+    if (shared.isTrue(optOutStaticProp)) {
+        return (_attrName) => false;
+    }
+    // If validationOptOut is an array of strings, attributes specified in the
+    // array will be "opted out". Attributes not specified in the array will still
+    // be validated.
+    if (shared.isArray(optOutStaticProp) && shared.arrayEvery(optOutStaticProp, shared.isString)) {
+        return (attrName) => !shared.ArrayIncludes.call(optOutStaticProp, attrName);
+    }
+    logWarn('Validation opt out must be `true` or an array of attributes that should not be validated.');
+    return (_attrName) => true;
+}
 function hydrateText(node, vnode, renderer) {
     var _a;
     if (!hasCorrectNodeType(vnode, node, 3 /* EnvNodeTypes.TEXT */, renderer)) {
@@ -6318,8 +6333,19 @@ function hydrateElement(elm, vnode, renderer) {
     return elm;
 }
 function hydrateCustomElement(elm, vnode, renderer) {
+    const { validationOptOut } = vnode.ctor;
+    const shouldValidateAttr = getValidationPredicate(validationOptOut);
+    // The validationOptOut static property can be an array of attribute names.
+    // Any attribute names specified in that array will not be validated, and the
+    // LWC runtime will assume that VDOM attrs and DOM attrs are in sync.
+    //
+    // If validationOptOut is true, no attributes will be checked for correctness
+    // and the runtime will assume VDOM attrs and DOM attrs are in sync.
+    //
+    // Therefore, if validationOptOut is falsey or an array of strings, we need to
+    // examine some or all of the custom element's attributes.
     if (!hasCorrectNodeType(vnode, elm, 1 /* EnvNodeTypes.ELEMENT */, renderer) ||
-        !isMatchingElement(vnode, elm, renderer)) {
+        !isMatchingElement(vnode, elm, renderer, shouldValidateAttr)) {
         return handleMismatch(elm, vnode, renderer);
     }
     const { sel, mode, ctor, owner } = vnode;
@@ -6350,14 +6376,12 @@ function hydrateCustomElement(elm, vnode, renderer) {
 function hydrateChildren(node, children, parentNode, owner) {
     let hasWarned = false;
     let nextNode = node;
-    let anchor = null;
     const { renderer } = owner;
     for (let i = 0; i < children.length; i++) {
         const childVnode = children[i];
         if (!shared.isNull(childVnode)) {
             if (nextNode) {
                 nextNode = hydrateNode(nextNode, childVnode, renderer);
-                anchor = childVnode.elm;
             }
             else {
                 hasMismatch = true;
@@ -6367,8 +6391,8 @@ function hydrateChildren(node, children, parentNode, owner) {
                         logError(`Hydration mismatch: incorrect number of rendered nodes. Client produced more nodes than the server.`, owner);
                     }
                 }
-                mount(childVnode, parentNode, renderer, anchor);
-                anchor = childVnode.elm;
+                mount(childVnode, parentNode, renderer, nextNode);
+                nextNode = renderer.nextSibling(childVnode.elm);
             }
         }
     }
@@ -6413,7 +6437,7 @@ function hasCorrectNodeType(vnode, node, nodeType, renderer) {
     }
     return true;
 }
-function isMatchingElement(vnode, elm, renderer) {
+function isMatchingElement(vnode, elm, renderer, shouldValidateAttr = () => true) {
     const { getProperty } = renderer;
     if (vnode.sel.toLowerCase() !== getProperty(elm, 'tagName').toLowerCase()) {
         if (process.env.NODE_ENV !== 'production') {
@@ -6421,10 +6445,14 @@ function isMatchingElement(vnode, elm, renderer) {
         }
         return false;
     }
-    const hasIncompatibleAttrs = validateAttrs(vnode, elm, renderer);
-    const hasIncompatibleClass = validateClassAttr(vnode, elm, renderer);
-    const hasIncompatibleStyle = validateStyleAttr(vnode, elm, renderer);
-    return hasIncompatibleAttrs && hasIncompatibleClass && hasIncompatibleStyle;
+    const hasCompatibleAttrs = validateAttrs(vnode, elm, renderer, shouldValidateAttr);
+    const hasCompatibleClass = shouldValidateAttr('class')
+        ? validateClassAttr(vnode, elm, renderer)
+        : true;
+    const hasCompatibleStyle = shouldValidateAttr('style')
+        ? validateStyleAttr(vnode, elm, renderer)
+        : true;
+    return hasCompatibleAttrs && hasCompatibleClass && hasCompatibleStyle;
 }
 function attributeValuesAreEqual(vnodeValue, value) {
     const vnodeValueAsString = String(vnodeValue);
@@ -6439,12 +6467,15 @@ function attributeValuesAreEqual(vnodeValue, value) {
     // In all other cases, the two values are not considered equal
     return false;
 }
-function validateAttrs(vnode, elm, renderer) {
+function validateAttrs(vnode, elm, renderer, shouldValidateAttr) {
     const { data: { attrs = {} }, } = vnode;
     let nodesAreCompatible = true;
     // Validate attributes, though we could always recovery from those by running the update mods.
     // Note: intentionally ONLY matching vnodes.attrs to elm.attrs, in case SSR is adding extra attributes.
     for (const [attrName, attrValue] of Object.entries(attrs)) {
+        if (!shouldValidateAttr(attrName)) {
+            continue;
+        }
         const { owner } = vnode;
         const { getAttribute } = renderer;
         const elmAttrValue = getAttribute(elm, attrName);
@@ -6907,5 +6938,5 @@ exports.swapTemplate = swapTemplate;
 exports.track = track;
 exports.unwrap = unwrap;
 exports.wire = wire;
-/* version: 2.45.1 */
-//# sourceMappingURL=engine-core.cjs.js.map
+/** version: 2.45.3 */
+//# sourceMappingURL=index.cjs.js.map