lwc 2.8.0 → 2.9.0

package/dist/engine-dom/umd/es5/engine-dom_debug.js

@@ -348,7 +348,7 @@
   var XML_NAMESPACE = 'http://www.w3.org/XML/1998/namespace';
   var SVG_NAMESPACE = 'http://www.w3.org/2000/svg';
   var XLINK_NAMESPACE = 'http://www.w3.org/1999/xlink';
-  /** version: 2.8.0 */
+  /** version: 2.9.0 */
 
   /*
    * Copyright (c) 2018, salesforce.com, inc.
@@ -517,7 +517,7 @@
 
   function setFeatureFlagForTest(name, value) {
   }
-  /** version: 2.8.0 */
+  /** version: 2.9.0 */
 
   /* proxy-compat-disable */
 
@@ -560,6 +560,21 @@
 
     return s4() + s4() + '-' + s4() + '-' + s4() + '-' + s4() + '-' + s4() + s4() + s4();
   } // Borrowed from Vue template compiler.
+
+
+  function cloneAndOmitKey(object, keyToOmit) {
+    var result = {};
+
+    for (var _i4 = 0, _Object$keys = Object.keys(object); _i4 < _Object$keys.length; _i4++) {
+      var key = _Object$keys[_i4];
+
+      if (key !== keyToOmit) {
+        result[key] = object[key];
+      }
+    }
+
+    return result;
+  } //
   // Primitives
   //
 
@@ -828,8 +843,8 @@
       var reactiveObservers = reactiveRecord[key];
 
       if (!isUndefined$1(reactiveObservers)) {
-        for (var _i4 = 0, _len2 = reactiveObservers.length; _i4 < _len2; _i4 += 1) {
-          var ro = reactiveObservers[_i4];
+        for (var _i5 = 0, _len2 = reactiveObservers.length; _i5 < _len2; _i5 += 1) {
+          var ro = reactiveObservers[_i5];
           ro.notify();
         }
       }
@@ -898,9 +913,9 @@
         var len = listeners.length;
 
         if (len > 0) {
-          for (var _i5 = 0; _i5 < len; _i5 += 1) {
-            var set = listeners[_i5];
-            var pos = ArrayIndexOf.call(listeners[_i5], this);
+          for (var _i6 = 0; _i6 < len; _i6 += 1) {
+            var set = listeners[_i6];
+            var pos = ArrayIndexOf.call(listeners[_i6], this);
             ArraySplice.call(set, pos, 1);
           }
 
@@ -2120,7 +2135,7 @@
 
 
   var _loop = function _loop() {
-    var childGetter = _childGetters[_i6];
+    var childGetter = _childGetters[_i7];
     queryAndChildGetterDescriptors[childGetter] = {
       get: function get() {
         var vm = getAssociatedVM(this);
@@ -2133,7 +2148,7 @@
     };
   };
 
-  for (var _i6 = 0, _childGetters = childGetters; _i6 < _childGetters.length; _i6++) {
+  for (var _i7 = 0, _childGetters = childGetters; _i7 < _childGetters.length; _i7++) {
     _loop();
   }
 
@@ -2157,7 +2172,7 @@
 
 
   var _loop2 = function _loop2() {
-    var queryMethod = _queryMethods[_i7];
+    var queryMethod = _queryMethods[_i8];
     queryAndChildGetterDescriptors[queryMethod] = {
       value: function value(arg) {
         var vm = getAssociatedVM(this);
@@ -2171,7 +2186,7 @@
     };
   };
 
-  for (var _i7 = 0, _queryMethods = queryMethods; _i7 < _queryMethods.length; _i7++) {
+  for (var _i8 = 0, _queryMethods = queryMethods; _i8 < _queryMethods.length; _i8++) {
     _loop2();
   }
 
@@ -2532,8 +2547,8 @@
     }
 
     if (!isUndefined$1(fields)) {
-      for (var _i8 = 0, n = fields.length; _i8 < n; _i8++) {
-        var _fieldName2 = fields[_i8];
+      for (var _i9 = 0, n = fields.length; _i9 < n; _i9++) {
+        var _fieldName2 = fields[_i9];
         descriptor = getOwnPropertyDescriptor$1(proto, _fieldName2);
         // tracked property. This is only here for backward compatibility purposes.
 
@@ -2750,8 +2765,8 @@
         superObservedAttributes = _SuperClass$observedA === void 0 ? [] : _SuperClass$observedA;
     var descriptors = create(null); // expose getters and setters for each public props on the new Element Bridge
 
-    for (var _i9 = 0, _len3 = props.length; _i9 < _len3; _i9 += 1) {
-      var _propName2 = props[_i9];
+    for (var _i10 = 0, _len3 = props.length; _i10 < _len3; _i10 += 1) {
+      var _propName2 = props[_i10];
       attributeToPropMap[htmlPropertyToAttribute(_propName2)] = _propName2;
       descriptors[_propName2] = {
         get: createGetter(_propName2),
@@ -2762,8 +2777,8 @@
     } // expose public methods as props on the new Element Bridge
 
 
-    for (var _i10 = 0, _len4 = methods.length; _i10 < _len4; _i10 += 1) {
-      var methodName = methods[_i10];
+    for (var _i11 = 0, _len4 = methods.length; _i11 < _len4; _i11 += 1) {
+      var methodName = methods[_i11];
       descriptors[methodName] = {
         value: createMethodCaller(methodName),
         writable: true,
@@ -3391,8 +3406,8 @@
       return;
     }
 
-    for (var _i11 = 0; _i11 < styleDecls.length; _i11++) {
-      var _styleDecls$_i = _slicedToArray(styleDecls[_i11], 3),
+    for (var _i12 = 0; _i12 < styleDecls.length; _i12++) {
+      var _styleDecls$_i = _slicedToArray(styleDecls[_i12], 3),
           prop = _styleDecls$_i[0],
           value = _styleDecls$_i[1],
           important = _styleDecls$_i[2];
@@ -3630,11 +3645,13 @@
       ) {
         // this element will now accept any manual content inserted into it
         observeElementChildNodes(elm);
-      } // when running in synthetic shadow mode, we need to set the shadowToken value
-      // into each element from the template, so they can be styled accordingly.
-
+      }
 
-      setElementShadowToken(elm, stylesheetToken);
+      if (!isUndefined$1(stylesheetToken)) {
+        // when running in synthetic shadow mode, we need to set the shadowToken value
+        // into each element from the template, so they can be styled accordingly.
+        setElementShadowToken(elm, stylesheetToken);
+      }
     }
   }
 
@@ -3697,7 +3714,9 @@
       var stylesheetToken = owner.context.stylesheetToken; // when running in synthetic shadow mode, we need to set the shadowToken value
       // into each element from the template, so they can be styled accordingly.
 
-      setElementShadowToken(elm, stylesheetToken);
+      if (!isUndefined$1(stylesheetToken)) {
+        setElementShadowToken(elm, stylesheetToken);
+      }
     }
 
     vm = createVM(elm, ctor, {
@@ -3745,8 +3764,8 @@
     var oldSlots = vm.cmpSlots;
     var cmpSlots = vm.cmpSlots = create(null);
 
-    for (var _i12 = 0, _len6 = children.length; _i12 < _len6; _i12 += 1) {
-      var vnode = children[_i12];
+    for (var _i13 = 0, _len6 = children.length; _i13 < _len6; _i13 += 1) {
+      var vnode = children[_i13];
 
       if (isNull(vnode)) {
         continue;
@@ -3780,8 +3799,8 @@
         return;
       }
 
-      for (var _i13 = 0, _len7 = oldKeys.length; _i13 < _len7; _i13 += 1) {
-        var key = oldKeys[_i13];
+      for (var _i14 = 0, _len7 = oldKeys.length; _i14 < _len7; _i14 += 1) {
+        var key = oldKeys[_i14];
 
         if (isUndefined$1(cmpSlots[key]) || oldSlots[key].length !== cmpSlots[key].length) {
           markComponentAsDirty(vm);
@@ -3866,6 +3885,7 @@
     var idxInOld;
     var elmToMove;
     var before;
+    var clonedOldCh = false;
 
     while (oldStartIdx <= oldEndIdx && newStartIdx <= newEndIdx) {
       if (!isVNode(oldStartVnode)) {
@@ -3917,7 +3937,18 @@
               newStartVnode.hook.create(newStartVnode);
               newStartVnode.hook.insert(newStartVnode, parentElm, oldStartVnode.elm);
             } else {
-              patchVnode(elmToMove, newStartVnode);
+              patchVnode(elmToMove, newStartVnode); // Delete the old child, but copy the array since it is read-only.
+              // The `oldCh` will be GC'ed after `updateDynamicChildren` is complete,
+              // so we only care about the `oldCh` object inside this function.
+              // To avoid cloning over and over again, we check `clonedOldCh`
+              // and only clone once.
+
+              if (!clonedOldCh) {
+                clonedOldCh = true;
+                oldCh = _toConsumableArray(oldCh);
+              } // We've already cloned at least once, so it's no longer read-only
+
+
               oldCh[idxInOld] = undefined;
               newStartVnode.hook.move(elmToMove, parentElm, oldStartVnode.elm);
             }
@@ -3932,12 +3963,12 @@
       if (oldStartIdx > oldEndIdx) {
         // There's some cases in which the sub array of vnodes to be inserted is followed by null(s) and an
         // already processed vnode, in such cases the vnodes to be inserted should be before that processed vnode.
-        var _i14 = newEndIdx;
+        var _i15 = newEndIdx;
         var n;
 
         do {
-          n = newCh[++_i14];
-        } while (!isVNode(n) && _i14 < newChEnd);
+          n = newCh[++_i15];
+        } while (!isVNode(n) && _i15 < newChEnd);
 
         before = isVNode(n) ? n.elm : null;
         addVnodes(parentElm, before, newCh, newStartIdx, newEndIdx);
@@ -3968,9 +3999,9 @@
 
     var referenceElm = null;
 
-    for (var _i15 = newChLength - 1; _i15 >= 0; _i15 -= 1) {
-      var vnode = newCh[_i15];
-      var oldVNode = oldCh[_i15];
+    for (var _i16 = newChLength - 1; _i16 >= 0; _i16 -= 1) {
+      var vnode = newCh[_i16];
+      var oldVNode = oldCh[_i16];
 
       if (vnode !== oldVNode) {
         if (isVNode(oldVNode)) {
@@ -4014,7 +4045,8 @@
   } // [h]tml node
 
 
-  function h(sel, data, children) {
+  function h(sel, data) {
+    var children = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : EmptyArray;
     var vmBeingRendered = getVMBeingRendered();
 
     var elm;
@@ -4288,7 +4320,8 @@
    * create a dynamic component via `<x-foo lwc:dynamic={Ctor}>`
    */
 
-  function dc(sel, Ctor, data, children) {
+  function dc(sel, Ctor, data) {
+    var children = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : EmptyArray;
 
 
     if (Ctor == null) {
@@ -4307,10 +4340,14 @@
     } // the new vnode key is a mix of idx and compiler key, this is required by the diffing algo
     // to identify different constructors as vnodes with different keys to avoid reusing the
     // element used for previous constructors.
+    // Shallow clone is necessary here becuase VElementData may be shared across VNodes due to
+    // hoisting optimization.
 
 
-    data.key = "dc:".concat(idx, ":").concat(data.key);
-    return c(sel, Ctor, data, children);
+    var newData = Object.assign(Object.assign({}, data), {
+      key: "dc:".concat(idx, ":").concat(data.key)
+    });
+    return c(sel, Ctor, newData, children);
   }
   /**
    * slow children collection marking mechanism. this API allows the compiler to signal
@@ -4419,12 +4456,14 @@
         oldHasTokenInClass = context.hasTokenInClass,
         oldHasTokenInAttribute = context.hasTokenInAttribute;
 
-    if (oldHasTokenInClass) {
-      getClassList$1(elm).remove(makeHostToken(oldToken));
-    }
+    if (!isUndefined$1(oldToken)) {
+      if (oldHasTokenInClass) {
+        getClassList$1(elm).remove(makeHostToken(oldToken));
+      }
 
-    if (oldHasTokenInAttribute) {
-      removeAttribute$1(elm, makeHostToken(oldToken));
+      if (oldHasTokenInAttribute) {
+        removeAttribute$1(elm, makeHostToken(oldToken));
+      }
     } // Apply the new template styling token to the host element, if the new template has any
     // associated stylesheets. In the case of light DOM, also ensure there is at least one scoped stylesheet.
 
@@ -4456,8 +4495,8 @@
     var content = [];
     var root;
 
-    for (var _i16 = 0; _i16 < stylesheets.length; _i16++) {
-      var stylesheet = stylesheets[_i16];
+    for (var _i17 = 0; _i17 < stylesheets.length; _i17++) {
+      var stylesheet = stylesheets[_i17];
 
       if (isArray$1(stylesheet)) {
         ArrayPush$1.apply(content, evaluateStylesheetsContent(stylesheet, stylesheetToken, vm));
@@ -4561,8 +4600,8 @@
     && shadowMode === 1
     /* Synthetic */
     ) {
-      for (var _i17 = 0; _i17 < stylesheets.length; _i17++) {
-        insertGlobalStylesheet$1(stylesheets[_i17]);
+      for (var _i18 = 0; _i18 < stylesheets.length; _i18++) {
+        insertGlobalStylesheet$1(stylesheets[_i18]);
       }
     } else if (ssr$1 || isHydrating$1()) {
       // Note: We need to ensure that during hydration, the stylesheets method is the same as those in ssr.
@@ -4576,12 +4615,12 @@
       var root = getNearestNativeShadowComponent(vm);
       var isGlobal = isNull(root);
 
-      for (var _i18 = 0; _i18 < stylesheets.length; _i18++) {
+      for (var _i19 = 0; _i19 < stylesheets.length; _i19++) {
         if (isGlobal) {
-          insertGlobalStylesheet$1(stylesheets[_i18]);
+          insertGlobalStylesheet$1(stylesheets[_i19]);
         } else {
           // local level
-          insertStylesheet$1(stylesheets[_i18], root.shadowRoot);
+          insertStylesheet$1(stylesheets[_i19], root.shadowRoot);
         }
       }
     }
@@ -4766,8 +4805,8 @@
     var stylesheets = template.stylesheets;
 
     if (!isUndefined$1(stylesheets)) {
-      for (var _i19 = 0; _i19 < stylesheets.length; _i19++) {
-        if (isTrue(stylesheets[_i19][KEY__SCOPED_CSS])) {
+      for (var _i20 = 0; _i20 < stylesheets.length; _i20++) {
+        if (isTrue(stylesheets[_i20][KEY__SCOPED_CSS])) {
           return true;
         }
       }
@@ -4950,8 +4989,8 @@
 
   function register(service) {
 
-    for (var _i20 = 0; _i20 < hooks.length; ++_i20) {
-      var hookName = hooks[_i20];
+    for (var _i21 = 0; _i21 < hooks.length; ++_i21) {
+      var hookName = hooks[_i21];
 
       if (hookName in service) {
         var l = Services[hookName];
@@ -4971,8 +5010,8 @@
         def = vm.def,
         context = vm.context;
 
-    for (var _i21 = 0, _len8 = cbs.length; _i21 < _len8; ++_i21) {
-      cbs[_i21].call(undefined, component, {}, def, context);
+    for (var _i22 = 0, _len8 = cbs.length; _i22 < _len8; ++_i22) {
+      cbs[_i22].call(undefined, component, {}, def, context);
     }
   }
   /*
@@ -5043,7 +5082,10 @@
 
       if (!isUndefined$1(props) && !isUndefined$1(props.innerHTML)) {
         if (elm.innerHTML === props.innerHTML) {
-          delete props.innerHTML;
+          // Do a shallow clone since VNodeData may be shared across VNodes due to hoist optimization
+          vnode.data = Object.assign(Object.assign({}, vnode.data), {
+            props: cloneAndOmitKey(props, 'innerHTML')
+          });
         } else {
           logWarn("Mismatch hydrating element <".concat(elm.tagName.toLowerCase(), ">: innerHTML values do not match for element, will recover from the difference"), vnode.owner);
         }
@@ -5090,8 +5132,8 @@
 
     var childNodeIndex = 0;
 
-    for (var _i22 = 0; _i22 < children.length; _i22++) {
-      var childVnode = children[_i22];
+    for (var _i23 = 0; _i23 < children.length; _i23++) {
+      var childVnode = children[_i23];
 
       if (!isNull(childVnode)) {
         var childNode = elmChildren[childNodeIndex];
@@ -5445,19 +5487,19 @@
     });
     rehydrateQueue = []; // reset to a new queue
 
-    for (var _i25 = 0, _len9 = vms.length; _i25 < _len9; _i25 += 1) {
-      var vm = vms[_i25];
+    for (var _i26 = 0, _len9 = vms.length; _i26 < _len9; _i26 += 1) {
+      var vm = vms[_i26];
 
       try {
         rehydrate(vm);
       } catch (error) {
-        if (_i25 + 1 < _len9) {
+        if (_i26 + 1 < _len9) {
           // pieces of the queue are still pending to be rehydrated, those should have priority
           if (rehydrateQueue.length === 0) {
             addCallbackToNextTick(flushRehydrationQueue);
           }
 
-          ArrayUnshift.apply(rehydrateQueue, ArraySlice.call(vms, _i25 + 1));
+          ArrayUnshift.apply(rehydrateQueue, ArraySlice.call(vms, _i26 + 1));
         } // we need to end the measure before throwing.
 
 
@@ -5556,8 +5598,8 @@
     var vCustomElementCollection = vm.velements; // Reporting disconnection for every child in inverse order since they are
     // inserted in reserved order.
 
-    for (var _i26 = vCustomElementCollection.length - 1; _i26 >= 0; _i26 -= 1) {
-      var elm = vCustomElementCollection[_i26].elm; // There are two cases where the element could be undefined:
+    for (var _i27 = vCustomElementCollection.length - 1; _i27 >= 0; _i27 -= 1) {
+      var elm = vCustomElementCollection[_i27].elm; // There are two cases where the element could be undefined:
       // * when there is an error during the construction phase, and an error
       //   boundary picks it, there is a possibility that the VCustomElement
       //   is not properly initialized, and therefore is should be ignored.
@@ -5591,8 +5633,8 @@
 
 
   function recursivelyDisconnectChildren(vnodes) {
-    for (var _i27 = 0, _len10 = vnodes.length; _i27 < _len10; _i27 += 1) {
-      var vnode = vnodes[_i27];
+    for (var _i28 = 0, _len10 = vnodes.length; _i28 < _len10; _i28 += 1) {
+      var vnode = vnodes[_i28];
 
       if (!isNull(vnode) && !isUndefined$1(vnode.elm)) {
         switch (vnode.type) {
@@ -5623,8 +5665,8 @@
     var children = vm.children,
         renderRoot = vm.renderRoot;
 
-    for (var _i28 = 0, _len11 = children.length; _i28 < _len11; _i28++) {
-      var child = children[_i28];
+    for (var _i29 = 0, _len11 = children.length; _i29 < _len11; _i29++) {
+      var child = children[_i29];
 
       if (!isNull(child) && !isUndefined$1(child.elm)) {
         remove$1(child.elm, renderRoot);
@@ -5974,8 +6016,8 @@
   function connectWireAdapters(vm) {
     var wiredConnecting = vm.context.wiredConnecting;
 
-    for (var _i29 = 0, _len12 = wiredConnecting.length; _i29 < _len12; _i29 += 1) {
-      wiredConnecting[_i29]();
+    for (var _i30 = 0, _len12 = wiredConnecting.length; _i30 < _len12; _i30 += 1) {
+      wiredConnecting[_i30]();
     }
   }
 
@@ -5983,8 +6025,8 @@
     var wiredDisconnecting = vm.context.wiredDisconnecting;
     runWithBoundaryProtection(vm, vm, noop, function () {
       // job
-      for (var _i30 = 0, _len13 = wiredDisconnecting.length; _i30 < _len13; _i30 += 1) {
-        wiredDisconnecting[_i30]();
+      for (var _i31 = 0, _len13 = wiredDisconnecting.length; _i31 < _len13; _i31 += 1) {
+        wiredDisconnecting[_i31]();
       }
     }, noop);
   }
@@ -6068,7 +6110,7 @@
     hooksAreSet = true;
     setSanitizeHtmlContentHook(hooks.sanitizeHtmlContent);
   }
-  /* version: 2.8.0 */
+  /* version: 2.9.0 */
 
   /*
    * Copyright (c) 2018, salesforce.com, inc.
@@ -6561,8 +6603,8 @@
         tagName: element.tagName.toLowerCase()
       });
 
-      for (var _i32 = 0, _Object$entries2 = Object.entries(props); _i32 < _Object$entries2.length; _i32++) {
-        var _Object$entries2$_i = _slicedToArray(_Object$entries2[_i32], 2),
+      for (var _i33 = 0, _Object$entries2 = Object.entries(props); _i33 < _Object$entries2.length; _i33++) {
+        var _Object$entries2$_i = _slicedToArray(_Object$entries2[_i33], 2),
             key = _Object$entries2$_i[0],
             value = _Object$entries2$_i[1];
 
@@ -6584,8 +6626,8 @@
         mode: 'open'
       });
 
-      for (var _i33 = 0, _Object$entries3 = Object.entries(props); _i33 < _Object$entries3.length; _i33++) {
-        var _Object$entries3$_i = _slicedToArray(_Object$entries3[_i33], 2),
+      for (var _i34 = 0, _Object$entries3 = Object.entries(props); _i34 < _Object$entries3.length; _i34++) {
+        var _Object$entries3$_i = _slicedToArray(_Object$entries3[_i34], 2),
             _key3 = _Object$entries3$_i[0],
             _value2 = _Object$entries3$_i[1];
 
@@ -6698,30 +6740,31 @@
 
   var _Node = Node;
   /**
-   * EXPERIMENTAL: This function detects whether or not a Node is controlled by a LWC template. This
-   * API is subject to change or being removed.
+   * EXPERIMENTAL: The purpose of this function is to detect shadowed nodes. THIS API WILL BE REMOVED
+   * ONCE LOCKER V1 IS NO LONGER SUPPORTED.
    */
 
-  function isNodeFromTemplate(node) {
+  function isNodeShadowed(node) {
     if (isFalse(node instanceof _Node)) {
       return false;
-    } // TODO [#1250]: skipping the shadowRoot instances itself makes no sense, we need to revisit
-    // this with locker
+    } // It's debatable whether shadow root instances should be considered as shadowed, but we keep
+    // this unchanged for legacy reasons (#1250).
 
 
     if (node instanceof ShadowRoot) {
       return false;
     }
 
-    if (isSyntheticShadowDefined) {
-      // TODO [#1252]: old behavior that is still used by some pieces of the platform,
-      // specifically, nodes inserted manually on places where `lwc:dom="manual"` directive is not
-      // used, will be considered global elements.
-      return !isUndefined$1(node[KEY__SHADOW_RESOLVER]);
-    }
+    var rootNode = node.getRootNode(); // Handle the native case. We can return early here because an invariant of LWC is that
+    // synthetic roots cannot be descendants of native roots.
+
+    if (rootNode instanceof ShadowRoot && isFalse(hasOwnProperty$1.call(getPrototypeOf$1(rootNode), 'synthetic'))) {
+      return true;
+    } // TODO [#1252]: Old behavior that is still used by some pieces of the platform. Manually
+    // inserted nodes without the `lwc:dom=manual` directive will be considered as global elements.
+
 
-    var root = node.getRootNode();
-    return root instanceof ShadowRoot;
+    return isSyntheticShadowDefined && !isUndefined$1(node[KEY__SHADOW_RESOLVER]);
   }
   /*
    * Copyright (c) 2018, salesforce.com, inc.
@@ -6765,7 +6808,7 @@
   });
   freeze(LightningElement);
   seal(LightningElement.prototype);
-  /* version: 2.8.0 */
+  /* version: 2.9.0 */
 
   exports.LightningElement = LightningElement;
   exports.__unstable__ProfilerControl = profilerControl;
@@ -6777,7 +6820,7 @@
   exports.getComponentDef = getComponentDef;
   exports.hydrateComponent = hydrateComponent;
   exports.isComponentConstructor = isComponentConstructor;
-  exports.isNodeFromTemplate = isNodeFromTemplate;
+  exports.isNodeFromTemplate = isNodeShadowed;
   exports.readonly = readonly;
   exports.register = register;
   exports.registerComponent = registerComponent;