@lwc/engine-core 2.28.0 → 2.28.1

package/dist/engine-core.cjs.js

@@ -3229,6 +3229,9 @@ function isSameVnode(vnode1, vnode2) {
 function isVCustomElement(vnode) {
     return vnode.type === 3 /* VNodeType.CustomElement */;
 }
+function isVFragment(vnode) {
+    return vnode.type === 5 /* VNodeType.Fragment */;
+}
 function isVScopedSlotFragment(vnode) {
     return vnode.type === 6 /* VNodeType.ScopedSlotFragment */;
 }
@@ -4121,26 +4124,26 @@ function createViewModelHook(elm, vnode, renderer) {
 
   return vm;
 }
+/**
+ * Collects all slots into a SlotSet, traversing through VFragment Nodes
+ */
 
-function allocateInSlot(vm, children, owner) {
-  var _a, _b;
 
-  const {
-    cmpSlots: {
-      slotAssignments: oldSlotsMapping
-    }
-  } = vm;
-  const cmpSlotsMapping = shared.create(null);
-  vm.cmpSlots = {
-    owner,
-    slotAssignments: cmpSlotsMapping
-  };
+function collectSlots(vm, children, cmpSlotsMapping) {
+  var _a, _b;
 
   for (let i = 0, len = children.length; i < len; i += 1) {
     const vnode = children[i];
 
     if (shared.isNull(vnode)) {
       continue;
+    } // Dive further iff the content is wrapped in a VFragment
+
+
+    if (isVFragment(vnode)) {
+      // Remove the text delimiter nodes to avoid overriding default slot content
+      collectSlots(vm, vnode.children.slice(1, -1), cmpSlotsMapping);
+      continue;
     }
 
     let slotName = '';
@@ -4154,6 +4157,20 @@ function allocateInSlot(vm, children, owner) {
     const vnodes = cmpSlotsMapping[slotName] = cmpSlotsMapping[slotName] || [];
     shared.ArrayPush.call(vnodes, vnode);
   }
+}
+
+function allocateInSlot(vm, children, owner) {
+  const {
+    cmpSlots: {
+      slotAssignments: oldSlotsMapping
+    }
+  } = vm;
+  const cmpSlotsMapping = shared.create(null);
+  collectSlots(vm, children, cmpSlotsMapping);
+  vm.cmpSlots = {
+    owner,
+    slotAssignments: cmpSlotsMapping
+  };
 
   if (shared.isFalse(vm.isDirty)) {
     // We need to determine if the old allocation is really different from the new one
@@ -6643,11 +6660,12 @@ function validateClassAttr(vnode, elm, renderer) {
         }
     }
     let nodesAreCompatible = true;
-    let vnodeClassName;
-    if (!shared.isUndefined(className) && String(className) !== getProperty(elm, 'className')) {
+    let readableVnodeClassname;
+    const elmClassName = getProperty(elm, 'className');
+    if (!shared.isUndefined(className) && String(className) !== elmClassName) {
         // className is used when class is bound to an expr.
         nodesAreCompatible = false;
-        vnodeClassName = className;
+        readableVnodeClassname = className;
     }
     else if (!shared.isUndefined(classMap)) {
         // classMap is used when class is set to static value.
@@ -6660,14 +6678,19 @@ function validateClassAttr(vnode, elm, renderer) {
                 nodesAreCompatible = false;
             }
         }
-        vnodeClassName = computedClassName.trim();
+        readableVnodeClassname = computedClassName.trim();
         if (classList.length > shared.keys(classMap).length) {
             nodesAreCompatible = false;
         }
     }
+    else if (shared.isUndefined(className) && elmClassName !== '') {
+        // SSR contains a className but client-side VDOM does not
+        nodesAreCompatible = false;
+        readableVnodeClassname = '';
+    }
     if (!nodesAreCompatible) {
         if (process.env.NODE_ENV !== 'production') {
-            logError(`Mismatch hydrating element <${getProperty(elm, 'tagName').toLowerCase()}>: attribute "class" has different values, expected "${vnodeClassName}" but found "${getProperty(elm, 'className')}"`, vnode.owner);
+            logError(`Mismatch hydrating element <${getProperty(elm, 'tagName').toLowerCase()}>: attribute "class" has different values, expected "${readableVnodeClassname}" but found "${elmClassName}"`, vnode.owner);
         }
     }
     return nodesAreCompatible;
@@ -6919,4 +6942,4 @@ exports.swapTemplate = swapTemplate;
 exports.track = track;
 exports.unwrap = unwrap;
 exports.wire = wire;
-/* version: 2.28.0 */
+/* version: 2.28.1 */

package/dist/engine-core.js

@@ -3226,6 +3226,9 @@ function isSameVnode(vnode1, vnode2) {
 function isVCustomElement(vnode) {
     return vnode.type === 3 /* VNodeType.CustomElement */;
 }
+function isVFragment(vnode) {
+    return vnode.type === 5 /* VNodeType.Fragment */;
+}
 function isVScopedSlotFragment(vnode) {
     return vnode.type === 6 /* VNodeType.ScopedSlotFragment */;
 }
@@ -4118,26 +4121,26 @@ function createViewModelHook(elm, vnode, renderer) {
 
   return vm;
 }
+/**
+ * Collects all slots into a SlotSet, traversing through VFragment Nodes
+ */
 
-function allocateInSlot(vm, children, owner) {
-  var _a, _b;
 
-  const {
-    cmpSlots: {
-      slotAssignments: oldSlotsMapping
-    }
-  } = vm;
-  const cmpSlotsMapping = create(null);
-  vm.cmpSlots = {
-    owner,
-    slotAssignments: cmpSlotsMapping
-  };
+function collectSlots(vm, children, cmpSlotsMapping) {
+  var _a, _b;
 
   for (let i = 0, len = children.length; i < len; i += 1) {
     const vnode = children[i];
 
     if (isNull(vnode)) {
       continue;
+    } // Dive further iff the content is wrapped in a VFragment
+
+
+    if (isVFragment(vnode)) {
+      // Remove the text delimiter nodes to avoid overriding default slot content
+      collectSlots(vm, vnode.children.slice(1, -1), cmpSlotsMapping);
+      continue;
     }
 
     let slotName = '';
@@ -4151,6 +4154,20 @@ function allocateInSlot(vm, children, owner) {
     const vnodes = cmpSlotsMapping[slotName] = cmpSlotsMapping[slotName] || [];
     ArrayPush$1.call(vnodes, vnode);
   }
+}
+
+function allocateInSlot(vm, children, owner) {
+  const {
+    cmpSlots: {
+      slotAssignments: oldSlotsMapping
+    }
+  } = vm;
+  const cmpSlotsMapping = create(null);
+  collectSlots(vm, children, cmpSlotsMapping);
+  vm.cmpSlots = {
+    owner,
+    slotAssignments: cmpSlotsMapping
+  };
 
   if (isFalse(vm.isDirty)) {
     // We need to determine if the old allocation is really different from the new one
@@ -6640,11 +6657,12 @@ function validateClassAttr(vnode, elm, renderer) {
         }
     }
     let nodesAreCompatible = true;
-    let vnodeClassName;
-    if (!isUndefined$1(className) && String(className) !== getProperty(elm, 'className')) {
+    let readableVnodeClassname;
+    const elmClassName = getProperty(elm, 'className');
+    if (!isUndefined$1(className) && String(className) !== elmClassName) {
         // className is used when class is bound to an expr.
         nodesAreCompatible = false;
-        vnodeClassName = className;
+        readableVnodeClassname = className;
     }
     else if (!isUndefined$1(classMap)) {
         // classMap is used when class is set to static value.
@@ -6657,14 +6675,19 @@ function validateClassAttr(vnode, elm, renderer) {
                 nodesAreCompatible = false;
             }
         }
-        vnodeClassName = computedClassName.trim();
+        readableVnodeClassname = computedClassName.trim();
         if (classList.length > keys(classMap).length) {
             nodesAreCompatible = false;
         }
     }
+    else if (isUndefined$1(className) && elmClassName !== '') {
+        // SSR contains a className but client-side VDOM does not
+        nodesAreCompatible = false;
+        readableVnodeClassname = '';
+    }
     if (!nodesAreCompatible) {
         if (process.env.NODE_ENV !== 'production') {
-            logError(`Mismatch hydrating element <${getProperty(elm, 'tagName').toLowerCase()}>: attribute "class" has different values, expected "${vnodeClassName}" but found "${getProperty(elm, 'className')}"`, vnode.owner);
+            logError(`Mismatch hydrating element <${getProperty(elm, 'tagName').toLowerCase()}>: attribute "class" has different values, expected "${readableVnodeClassname}" but found "${elmClassName}"`, vnode.owner);
         }
     }
     return nodesAreCompatible;
@@ -6880,4 +6903,4 @@ function getComponentConstructor(elm) {
 }
 
 export { LightningElement, profilerControl as __unstable__ProfilerControl, api$1 as api, connectRootElement, createContextProvider, createVM, disconnectRootElement, freezeTemplate, getAssociatedVMIfPresent, getComponentConstructor, getComponentDef, getComponentHtmlPrototype, hydrateRoot, isComponentConstructor, parseFragment, parseSVGFragment, readonly, register, registerComponent, registerDecorators, registerTemplate, sanitizeAttribute, setHooks, swapComponent, swapStyle, swapTemplate, track, unwrap, wire };
-/* version: 2.28.0 */
+/* version: 2.28.1 */

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@lwc/engine-core",
-    "version": "2.28.0",
+    "version": "2.28.1",
     "description": "Core LWC engine APIs.",
     "homepage": "https://lwc.dev/",
     "repository": {
@@ -24,8 +24,8 @@
         "types/"
     ],
     "dependencies": {
-        "@lwc/features": "2.28.0",
-        "@lwc/shared": "2.28.0"
+        "@lwc/features": "2.28.1",
+        "@lwc/shared": "2.28.1"
     },
     "devDependencies": {
         "observable-membrane": "2.0.0"

package/types/framework/vnodes.d.ts

@@ -88,4 +88,5 @@ export interface VElementData extends VNodeData {
 export declare function isVBaseElement(vnode: VNode): vnode is VElement | VCustomElement;
 export declare function isSameVnode(vnode1: VNode, vnode2: VNode): boolean;
 export declare function isVCustomElement(vnode: VBaseElement): vnode is VCustomElement;
+export declare function isVFragment(vnode: VNode): vnode is VFragment;
 export declare function isVScopedSlotFragment(vnode: VNode): vnode is VScopedSlotFragment;