@remote-ui/core - npm Package Compare versions

Comparing version 1.5.2 to 1.5.3

build/cjs/root.js

@@ -440,107 +440,7 @@ "use strict";
   if (Array.isArray(currentValue)) {
-    if (!Array.isArray(newValue)) {
-      var _collectNestedHotSwap;
-
-      return [makeValueHotSwappable(newValue), (_collectNestedHotSwap = collectNestedHotSwappableValues(currentValue)) === null || _collectNestedHotSwap === void 0 ? void 0 : _collectNestedHotSwap.map(function (hotSwappable) {
-        return [hotSwappable, undefined];
-      })];
-    }
-
-    var hasChanged = false;
-    var hotSwaps = [];
-    var newLength = newValue.length;
-    var currentLength = currentValue.length;
-    var maxLength = Math.max(currentLength, newLength);
-    var normalizedNewValue = [];
-
-    for (var i = 0; i < maxLength; i++) {
-      var currentArrayValue = currentValue[i];
-      var newArrayValue = newValue[i];
-
-      if (i < newLength) {
-        if (i >= currentLength) {
-          hasChanged = true;
-          normalizedNewValue[i] = makeValueHotSwappable(newValue);
-        } else {
-          var _tryHotSwappingValues3 = tryHotSwappingValues(currentArrayValue, newArrayValue),
-              _tryHotSwappingValues4 = _slicedToArray(_tryHotSwappingValues3, 2),
-              updatedValue = _tryHotSwappingValues4[0],
-              elementHotSwaps = _tryHotSwappingValues4[1];
-
-          if (elementHotSwaps) hotSwaps.push.apply(hotSwaps, _toConsumableArray(elementHotSwaps));
-
-          if (updatedValue === IGNORE) {
-            normalizedNewValue[i] = currentValue;
-          } else {
-            hasChanged = true;
-            normalizedNewValue[i] = updatedValue;
-          }
-        }
-      } else {
-        hasChanged = true;
-        var nestedHotSwappables = collectNestedHotSwappableValues(currentArrayValue);
-
-        if (nestedHotSwappables) {
-          hotSwaps.push.apply(hotSwaps, _toConsumableArray(nestedHotSwappables.map(function (hotSwappable) {
-            return [hotSwappable, undefined];
-          })));
-        }
-      }
-    }
-
-    return [hasChanged ? normalizedNewValue : IGNORE, hotSwaps];
+    return tryHotSwappingArrayValues(currentValue, newValue);
   }
 
   if (_typeof(currentValue) === 'object' && currentValue != null) {
-    if (_typeof(newValue) !== 'object' || newValue == null) {
-      var _collectNestedHotSwap2;
-
-      return [makeValueHotSwappable(newValue), (_collectNestedHotSwap2 = collectNestedHotSwappableValues(currentValue)) === null || _collectNestedHotSwap2 === void 0 ? void 0 : _collectNestedHotSwap2.map(function (hotSwappable) {
-        return [hotSwappable, undefined];
-      })];
-    }
-
-    var _hasChanged = false;
-    var _hotSwaps = [];
-    var _normalizedNewValue = {}; // eslint-disable-next-line guard-for-in
-
-    for (var _key4 in currentValue) {
-      var currentObjectValue = currentValue[_key4];
-
-      if (!(_key4 in newValue)) {
-        _hasChanged = true;
-
-        var _nestedHotSwappables = collectNestedHotSwappableValues(currentObjectValue);
-
-        if (_nestedHotSwappables) {
-          _hotSwaps.push.apply(_hotSwaps, _toConsumableArray(_nestedHotSwappables.map(function (hotSwappable) {
-            return [hotSwappable, undefined];
-          })));
-        }
-      }
-
-      var newObjectValue = newValue[_key4];
-
-      var _tryHotSwappingValues5 = tryHotSwappingValues(currentObjectValue, newObjectValue),
-          _tryHotSwappingValues6 = _slicedToArray(_tryHotSwappingValues5, 2),
-          _updatedValue = _tryHotSwappingValues6[0],
-          _elementHotSwaps = _tryHotSwappingValues6[1];
-
-      if (_elementHotSwaps) _hotSwaps.push.apply(_hotSwaps, _toConsumableArray(_elementHotSwaps));
-
-      if (_updatedValue === IGNORE) {
-        _normalizedNewValue[_key4] = currentObjectValue;
-      } else {
-        _hasChanged = true;
-        _normalizedNewValue[_key4] = _updatedValue;
-      }
-    }
-
-    for (var _key5 in newValue) {
-      if (_key5 in _normalizedNewValue) continue;
-      _hasChanged = true;
-      _normalizedNewValue[_key5] = makeValueHotSwappable(newValue[_key5]);
-    }
-
-    return [_hasChanged ? _normalizedNewValue : IGNORE, _hotSwaps];
+    return tryHotSwappingObjectValues(currentValue, newValue);
   }
@@ -732,2 +632,109 @@
   });
+}
+
+function tryHotSwappingObjectValues(currentValue, newValue) {
+  if (_typeof(newValue) !== 'object' || newValue == null) {
+    var _collectNestedHotSwap;
+
+    return [makeValueHotSwappable(newValue), (_collectNestedHotSwap = collectNestedHotSwappableValues(currentValue)) === null || _collectNestedHotSwap === void 0 ? void 0 : _collectNestedHotSwap.map(function (hotSwappable) {
+      return [hotSwappable, undefined];
+    })];
+  }
+
+  var hasChanged = false;
+  var hotSwaps = [];
+  var normalizedNewValue = {}; // eslint-disable-next-line guard-for-in
+
+  for (var _key4 in currentValue) {
+    var currentObjectValue = currentValue[_key4];
+
+    if (!(_key4 in newValue)) {
+      hasChanged = true;
+      var nestedHotSwappables = collectNestedHotSwappableValues(currentObjectValue);
+
+      if (nestedHotSwappables) {
+        hotSwaps.push.apply(hotSwaps, _toConsumableArray(nestedHotSwappables.map(function (hotSwappable) {
+          return [hotSwappable, undefined];
+        })));
+      }
+    }
+
+    var newObjectValue = newValue[_key4];
+
+    var _tryHotSwappingValues3 = tryHotSwappingValues(currentObjectValue, newObjectValue),
+        _tryHotSwappingValues4 = _slicedToArray(_tryHotSwappingValues3, 2),
+        updatedValue = _tryHotSwappingValues4[0],
+        elementHotSwaps = _tryHotSwappingValues4[1];
+
+    if (elementHotSwaps) hotSwaps.push.apply(hotSwaps, _toConsumableArray(elementHotSwaps));
+
+    if (updatedValue !== IGNORE) {
+      hasChanged = true;
+      normalizedNewValue[_key4] = updatedValue;
+    }
+  }
+
+  for (var _key5 in newValue) {
+    if (_key5 in normalizedNewValue) continue;
+    hasChanged = true;
+    normalizedNewValue[_key5] = makeValueHotSwappable(newValue[_key5]);
+  }
+
+  return [hasChanged ? normalizedNewValue : IGNORE, hotSwaps];
+}
+
+function tryHotSwappingArrayValues(currentValue, newValue) {
+  if (!Array.isArray(newValue)) {
+    var _collectNestedHotSwap2;
+
+    return [makeValueHotSwappable(newValue), (_collectNestedHotSwap2 = collectNestedHotSwappableValues(currentValue)) === null || _collectNestedHotSwap2 === void 0 ? void 0 : _collectNestedHotSwap2.map(function (hotSwappable) {
+      return [hotSwappable, undefined];
+    })];
+  }
+
+  var hasChanged = false;
+  var hotSwaps = [];
+  var newLength = newValue.length;
+  var currentLength = currentValue.length;
+  var maxLength = Math.max(currentLength, newLength);
+  var normalizedNewValue = [];
+
+  for (var i = 0; i < maxLength; i++) {
+    var currentArrayValue = currentValue[i];
+    var newArrayValue = newValue[i];
+
+    if (i < newLength) {
+      if (i >= currentLength) {
+        hasChanged = true;
+        normalizedNewValue[i] = makeValueHotSwappable(newArrayValue);
+        continue;
+      }
+
+      var _tryHotSwappingValues5 = tryHotSwappingValues(currentArrayValue, newArrayValue),
+          _tryHotSwappingValues6 = _slicedToArray(_tryHotSwappingValues5, 2),
+          updatedValue = _tryHotSwappingValues6[0],
+          elementHotSwaps = _tryHotSwappingValues6[1];
+
+      if (elementHotSwaps) hotSwaps.push.apply(hotSwaps, _toConsumableArray(elementHotSwaps));
+
+      if (updatedValue === IGNORE) {
+        normalizedNewValue[i] = currentArrayValue;
+        continue;
+      }
+
+      hasChanged = true;
+      normalizedNewValue[i] = updatedValue;
+    } else {
+      hasChanged = true;
+      var nestedHotSwappables = collectNestedHotSwappableValues(currentArrayValue);
+
+      if (nestedHotSwappables) {
+        hotSwaps.push.apply(hotSwaps, _toConsumableArray(nestedHotSwappables.map(function (hotSwappable) {
+          return [hotSwappable, undefined];
+        })));
+      }
+    }
+  }
+
+  return [hasChanged ? normalizedNewValue : IGNORE, hotSwaps];
 }

build/cjs/tests/root.test.js

@@ -7,3 +7,3 @@ "use strict";
 
-function _createForOfIteratorHelper(o, allowArrayLike) { var it; if (typeof Symbol === "undefined" || o[Symbol.iterator] == null) { if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = o[Symbol.iterator](); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it["return"] != null) it["return"](); } finally { if (didErr) throw err; } } }; }
+function _createForOfIteratorHelper(o, allowArrayLike) { var it; if (typeof Symbol === "undefined" || o[Symbol.iterator] == null) { if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e2) { throw _e2; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = o[Symbol.iterator](); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e3) { didErr = true; err = _e3; }, f: function f() { try { if (!normalCompletion && it["return"] != null) it["return"](); } finally { if (didErr) throw err; } } }; }
 
@@ -14,4 +14,2 @@ function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
 
-function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
-
 function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && Symbol.iterator in Object(iter)) return Array.from(iter); }
@@ -21,4 +19,14 @@
 
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+
 function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
 
+function _iterableToArrayLimit(arr, i) { if (typeof Symbol === "undefined" || !(Symbol.iterator in Object(arr))) return; var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
+
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+
 describe('root', function () {
@@ -178,2 +186,71 @@ describe('createComponent()', function () {
     });
+    it('hot-swaps function props for arrays when the length increases', function () {
+      var firstActionFuncOne = jest.fn();
+      var firstActionFuncTwo = jest.fn();
+      var secondActionFunc = jest.fn();
+      var receiver = createDelayedReceiver();
+      var root = (0, _root.createRemoteRoot)(receiver.receive);
+      var modal = root.createComponent('Modal', {
+        secondaryActions: [{
+          onAction: firstActionFuncOne
+        }]
+      });
+      root.appendChild(modal);
+      root.mount();
+      modal.updateProps({
+        secondaryActions: [{
+          onAction: firstActionFuncTwo
+        }, {
+          onAction: secondActionFunc
+        }]
+      });
+      receiver.flush();
+
+      var _props$secondaryActio = _slicedToArray(receiver.children[0].props.secondaryActions, 2),
+          firstAction = _props$secondaryActio[0],
+          secondAction = _props$secondaryActio[1];
+
+      firstAction.onAction();
+      secondAction.onAction();
+      expect(firstActionFuncOne).not.toHaveBeenCalled();
+      expect(firstActionFuncTwo).toHaveBeenCalled();
+      expect(secondActionFunc).toHaveBeenCalled();
+    });
+    it('hot-swaps function props for nested arrays', function () {
+      var firstActionFuncOne = jest.fn();
+      var firstActionFuncTwo = jest.fn();
+      var secondActionFuncOne = jest.fn();
+      var receiver = createDelayedReceiver();
+      var root = (0, _root.createRemoteRoot)(receiver.receive);
+      var modal = root.createComponent('Modal', {
+        actionGroups: [{
+          actions: [{
+            onAction: firstActionFuncOne
+          }]
+        }]
+      });
+      root.appendChild(modal);
+      root.mount();
+      modal.updateProps({
+        actionGroups: [{
+          actions: [{
+            onAction: firstActionFuncTwo
+          }, {
+            onAction: secondActionFuncOne
+          }]
+        }]
+      });
+      receiver.flush();
+
+      var _props$actionGroups = _slicedToArray(receiver.children[0].props.actionGroups, 1),
+          _props$actionGroups$ = _slicedToArray(_props$actionGroups[0].actions, 2),
+          actionOne = _props$actionGroups$[0],
+          actionTwo = _props$actionGroups$[1];
+
+      actionOne.onAction();
+      actionTwo.onAction();
+      expect(firstActionFuncOne).not.toHaveBeenCalled();
+      expect(firstActionFuncTwo).toHaveBeenCalled();
+      expect(secondActionFuncOne).toHaveBeenCalled();
+    });
   });
@@ -180,0 +257,0 @@ });

build/node/root.js

@@ -344,89 +344,7 @@ "use strict";
   if (Array.isArray(currentValue)) {
-    if (!Array.isArray(newValue)) {
-      var _collectNestedHotSwap;
-
-      return [makeValueHotSwappable(newValue), (_collectNestedHotSwap = collectNestedHotSwappableValues(currentValue)) === null || _collectNestedHotSwap === void 0 ? void 0 : _collectNestedHotSwap.map(hotSwappable => [hotSwappable, undefined])];
-    }
-
-    let hasChanged = false;
-    const hotSwaps = [];
-    const newLength = newValue.length;
-    const currentLength = currentValue.length;
-    const maxLength = Math.max(currentLength, newLength);
-    const normalizedNewValue = [];
-
-    for (let i = 0; i < maxLength; i++) {
-      const currentArrayValue = currentValue[i];
-      const newArrayValue = newValue[i];
-
-      if (i < newLength) {
-        if (i >= currentLength) {
-          hasChanged = true;
-          normalizedNewValue[i] = makeValueHotSwappable(newValue);
-        } else {
-          const [updatedValue, elementHotSwaps] = tryHotSwappingValues(currentArrayValue, newArrayValue);
-          if (elementHotSwaps) hotSwaps.push(...elementHotSwaps);
-
-          if (updatedValue === IGNORE) {
-            normalizedNewValue[i] = currentValue;
-          } else {
-            hasChanged = true;
-            normalizedNewValue[i] = updatedValue;
-          }
-        }
-      } else {
-        hasChanged = true;
-        const nestedHotSwappables = collectNestedHotSwappableValues(currentArrayValue);
-
-        if (nestedHotSwappables) {
-          hotSwaps.push(...nestedHotSwappables.map(hotSwappable => [hotSwappable, undefined]));
-        }
-      }
-    }
-
-    return [hasChanged ? normalizedNewValue : IGNORE, hotSwaps];
+    return tryHotSwappingArrayValues(currentValue, newValue);
   }
 
   if (typeof currentValue === 'object' && currentValue != null) {
-    if (typeof newValue !== 'object' || newValue == null) {
-      var _collectNestedHotSwap2;
-
-      return [makeValueHotSwappable(newValue), (_collectNestedHotSwap2 = collectNestedHotSwappableValues(currentValue)) === null || _collectNestedHotSwap2 === void 0 ? void 0 : _collectNestedHotSwap2.map(hotSwappable => [hotSwappable, undefined])];
-    }
-
-    let hasChanged = false;
-    const hotSwaps = [];
-    const normalizedNewValue = {}; // eslint-disable-next-line guard-for-in
-
-    for (const key in currentValue) {
-      const currentObjectValue = currentValue[key];
-
-      if (!(key in newValue)) {
-        hasChanged = true;
-        const nestedHotSwappables = collectNestedHotSwappableValues(currentObjectValue);
-
-        if (nestedHotSwappables) {
-          hotSwaps.push(...nestedHotSwappables.map(hotSwappable => [hotSwappable, undefined]));
-        }
-      }
-
-      const newObjectValue = newValue[key];
-      const [updatedValue, elementHotSwaps] = tryHotSwappingValues(currentObjectValue, newObjectValue);
-      if (elementHotSwaps) hotSwaps.push(...elementHotSwaps);
-
-      if (updatedValue === IGNORE) {
-        normalizedNewValue[key] = currentObjectValue;
-      } else {
-        hasChanged = true;
-        normalizedNewValue[key] = updatedValue;
-      }
-    }
-
-    for (const key in newValue) {
-      if (key in normalizedNewValue) continue;
-      hasChanged = true;
-      normalizedNewValue[key] = makeValueHotSwappable(newValue[key]);
-    }
-
-    return [hasChanged ? normalizedNewValue : IGNORE, hotSwaps];
+    return tryHotSwappingObjectValues(currentValue, newValue);
   }
@@ -613,2 +531,92 @@
   });
+}
+
+function tryHotSwappingObjectValues(currentValue, newValue) {
+  if (typeof newValue !== 'object' || newValue == null) {
+    var _collectNestedHotSwap;
+
+    return [makeValueHotSwappable(newValue), (_collectNestedHotSwap = collectNestedHotSwappableValues(currentValue)) === null || _collectNestedHotSwap === void 0 ? void 0 : _collectNestedHotSwap.map(hotSwappable => [hotSwappable, undefined])];
+  }
+
+  let hasChanged = false;
+  const hotSwaps = [];
+  const normalizedNewValue = {}; // eslint-disable-next-line guard-for-in
+
+  for (const key in currentValue) {
+    const currentObjectValue = currentValue[key];
+
+    if (!(key in newValue)) {
+      hasChanged = true;
+      const nestedHotSwappables = collectNestedHotSwappableValues(currentObjectValue);
+
+      if (nestedHotSwappables) {
+        hotSwaps.push(...nestedHotSwappables.map(hotSwappable => [hotSwappable, undefined]));
+      }
+    }
+
+    const newObjectValue = newValue[key];
+    const [updatedValue, elementHotSwaps] = tryHotSwappingValues(currentObjectValue, newObjectValue);
+    if (elementHotSwaps) hotSwaps.push(...elementHotSwaps);
+
+    if (updatedValue !== IGNORE) {
+      hasChanged = true;
+      normalizedNewValue[key] = updatedValue;
+    }
+  }
+
+  for (const key in newValue) {
+    if (key in normalizedNewValue) continue;
+    hasChanged = true;
+    normalizedNewValue[key] = makeValueHotSwappable(newValue[key]);
+  }
+
+  return [hasChanged ? normalizedNewValue : IGNORE, hotSwaps];
+}
+
+function tryHotSwappingArrayValues(currentValue, newValue) {
+  if (!Array.isArray(newValue)) {
+    var _collectNestedHotSwap2;
+
+    return [makeValueHotSwappable(newValue), (_collectNestedHotSwap2 = collectNestedHotSwappableValues(currentValue)) === null || _collectNestedHotSwap2 === void 0 ? void 0 : _collectNestedHotSwap2.map(hotSwappable => [hotSwappable, undefined])];
+  }
+
+  let hasChanged = false;
+  const hotSwaps = [];
+  const newLength = newValue.length;
+  const currentLength = currentValue.length;
+  const maxLength = Math.max(currentLength, newLength);
+  const normalizedNewValue = [];
+
+  for (let i = 0; i < maxLength; i++) {
+    const currentArrayValue = currentValue[i];
+    const newArrayValue = newValue[i];
+
+    if (i < newLength) {
+      if (i >= currentLength) {
+        hasChanged = true;
+        normalizedNewValue[i] = makeValueHotSwappable(newArrayValue);
+        continue;
+      }
+
+      const [updatedValue, elementHotSwaps] = tryHotSwappingValues(currentArrayValue, newArrayValue);
+      if (elementHotSwaps) hotSwaps.push(...elementHotSwaps);
+
+      if (updatedValue === IGNORE) {
+        normalizedNewValue[i] = currentArrayValue;
+        continue;
+      }
+
+      hasChanged = true;
+      normalizedNewValue[i] = updatedValue;
+    } else {
+      hasChanged = true;
+      const nestedHotSwappables = collectNestedHotSwappableValues(currentArrayValue);
+
+      if (nestedHotSwappables) {
+        hotSwaps.push(...nestedHotSwappables.map(hotSwappable => [hotSwappable, undefined]));
+      }
+    }
+  }
+
+  return [hasChanged ? normalizedNewValue : IGNORE, hotSwaps];
 }

build/node/tests/root.test.js

@@ -161,2 +161,68 @@ "use strict";
     });
+    it('hot-swaps function props for arrays when the length increases', () => {
+      const firstActionFuncOne = jest.fn();
+      const firstActionFuncTwo = jest.fn();
+      const secondActionFunc = jest.fn();
+      const receiver = createDelayedReceiver();
+      const root = (0, _root.createRemoteRoot)(receiver.receive);
+      const modal = root.createComponent('Modal', {
+        secondaryActions: [{
+          onAction: firstActionFuncOne
+        }]
+      });
+      root.appendChild(modal);
+      root.mount();
+      modal.updateProps({
+        secondaryActions: [{
+          onAction: firstActionFuncTwo
+        }, {
+          onAction: secondActionFunc
+        }]
+      });
+      receiver.flush();
+      const {
+        secondaryActions: [firstAction, secondAction]
+      } = receiver.children[0].props;
+      firstAction.onAction();
+      secondAction.onAction();
+      expect(firstActionFuncOne).not.toHaveBeenCalled();
+      expect(firstActionFuncTwo).toHaveBeenCalled();
+      expect(secondActionFunc).toHaveBeenCalled();
+    });
+    it('hot-swaps function props for nested arrays', () => {
+      const firstActionFuncOne = jest.fn();
+      const firstActionFuncTwo = jest.fn();
+      const secondActionFuncOne = jest.fn();
+      const receiver = createDelayedReceiver();
+      const root = (0, _root.createRemoteRoot)(receiver.receive);
+      const modal = root.createComponent('Modal', {
+        actionGroups: [{
+          actions: [{
+            onAction: firstActionFuncOne
+          }]
+        }]
+      });
+      root.appendChild(modal);
+      root.mount();
+      modal.updateProps({
+        actionGroups: [{
+          actions: [{
+            onAction: firstActionFuncTwo
+          }, {
+            onAction: secondActionFuncOne
+          }]
+        }]
+      });
+      receiver.flush();
+      const {
+        actionGroups: [{
+          actions: [actionOne, actionTwo]
+        }]
+      } = receiver.children[0].props;
+      actionOne.onAction();
+      actionTwo.onAction();
+      expect(firstActionFuncOne).not.toHaveBeenCalled();
+      expect(firstActionFuncTwo).toHaveBeenCalled();
+      expect(secondActionFuncOne).toHaveBeenCalled();
+    });
   });
@@ -163,0 +229,0 @@ });

build/ts/root.js

@@ -273,3 +273,2 @@ "use strict";
 function tryHotSwappingValues(currentValue, newValue) {
-    var _a, _b;
     if (typeof currentValue === 'function' &&
@@ -283,84 +282,6 @@ FUNCTION_CURRENT_IMPLEMENTATION_KEY in currentValue) {
     if (Array.isArray(currentValue)) {
-        if (!Array.isArray(newValue)) {
-            return [
-                makeValueHotSwappable(newValue),
-                (_a = collectNestedHotSwappableValues(currentValue)) === null || _a === void 0 ? void 0 : _a.map((hotSwappable) => [hotSwappable, undefined]),
-            ];
-        }
-        let hasChanged = false;
-        const hotSwaps = [];
-        const newLength = newValue.length;
-        const currentLength = currentValue.length;
-        const maxLength = Math.max(currentLength, newLength);
-        const normalizedNewValue = [];
-        for (let i = 0; i < maxLength; i++) {
-            const currentArrayValue = currentValue[i];
-            const newArrayValue = newValue[i];
-            if (i < newLength) {
-                if (i >= currentLength) {
-                    hasChanged = true;
-                    normalizedNewValue[i] = makeValueHotSwappable(newValue);
-                }
-                else {
-                    const [updatedValue, elementHotSwaps] = tryHotSwappingValues(currentArrayValue, newArrayValue);
-                    if (elementHotSwaps)
-                        hotSwaps.push(...elementHotSwaps);
-                    if (updatedValue === IGNORE) {
-                        normalizedNewValue[i] = currentValue;
-                    }
-                    else {
-                        hasChanged = true;
-                        normalizedNewValue[i] = updatedValue;
-                    }
-                }
-            }
-            else {
-                hasChanged = true;
-                const nestedHotSwappables = collectNestedHotSwappableValues(currentArrayValue);
-                if (nestedHotSwappables) {
-                    hotSwaps.push(...nestedHotSwappables.map((hotSwappable) => [hotSwappable, undefined]));
-                }
-            }
-        }
-        return [hasChanged ? normalizedNewValue : IGNORE, hotSwaps];
+        return tryHotSwappingArrayValues(currentValue, newValue);
     }
     if (typeof currentValue === 'object' && currentValue != null) {
-        if (typeof newValue !== 'object' || newValue == null) {
-            return [
-                makeValueHotSwappable(newValue),
-                (_b = collectNestedHotSwappableValues(currentValue)) === null || _b === void 0 ? void 0 : _b.map((hotSwappable) => [hotSwappable, undefined]),
-            ];
-        }
-        let hasChanged = false;
-        const hotSwaps = [];
-        const normalizedNewValue = {};
-        // eslint-disable-next-line guard-for-in
-        for (const key in currentValue) {
-            const currentObjectValue = currentValue[key];
-            if (!(key in newValue)) {
-                hasChanged = true;
-                const nestedHotSwappables = collectNestedHotSwappableValues(currentObjectValue);
-                if (nestedHotSwappables) {
-                    hotSwaps.push(...nestedHotSwappables.map((hotSwappable) => [hotSwappable, undefined]));
-                }
-            }
-            const newObjectValue = newValue[key];
-            const [updatedValue, elementHotSwaps] = tryHotSwappingValues(currentObjectValue, newObjectValue);
-            if (elementHotSwaps)
-                hotSwaps.push(...elementHotSwaps);
-            if (updatedValue === IGNORE) {
-                normalizedNewValue[key] = currentObjectValue;
-            }
-            else {
-                hasChanged = true;
-                normalizedNewValue[key] = updatedValue;
-            }
-        }
-        for (const key in newValue) {
-            if (key in normalizedNewValue)
-                continue;
-            hasChanged = true;
-            normalizedNewValue[key] = makeValueHotSwappable(newValue[key]);
-        }
-        return [hasChanged ? normalizedNewValue : IGNORE, hotSwaps];
+        return tryHotSwappingObjectValues(currentValue, newValue);
     }
@@ -516,1 +437,82 @@ return [currentValue === newValue ? IGNORE : newValue];
 }
+function tryHotSwappingObjectValues(currentValue, newValue) {
+    var _a;
+    if (typeof newValue !== 'object' || newValue == null) {
+        return [
+            makeValueHotSwappable(newValue),
+            (_a = collectNestedHotSwappableValues(currentValue)) === null || _a === void 0 ? void 0 : _a.map((hotSwappable) => [hotSwappable, undefined]),
+        ];
+    }
+    let hasChanged = false;
+    const hotSwaps = [];
+    const normalizedNewValue = {};
+    // eslint-disable-next-line guard-for-in
+    for (const key in currentValue) {
+        const currentObjectValue = currentValue[key];
+        if (!(key in newValue)) {
+            hasChanged = true;
+            const nestedHotSwappables = collectNestedHotSwappableValues(currentObjectValue);
+            if (nestedHotSwappables) {
+                hotSwaps.push(...nestedHotSwappables.map((hotSwappable) => [hotSwappable, undefined]));
+            }
+        }
+        const newObjectValue = newValue[key];
+        const [updatedValue, elementHotSwaps] = tryHotSwappingValues(currentObjectValue, newObjectValue);
+        if (elementHotSwaps)
+            hotSwaps.push(...elementHotSwaps);
+        if (updatedValue !== IGNORE) {
+            hasChanged = true;
+            normalizedNewValue[key] = updatedValue;
+        }
+    }
+    for (const key in newValue) {
+        if (key in normalizedNewValue)
+            continue;
+        hasChanged = true;
+        normalizedNewValue[key] = makeValueHotSwappable(newValue[key]);
+    }
+    return [hasChanged ? normalizedNewValue : IGNORE, hotSwaps];
+}
+function tryHotSwappingArrayValues(currentValue, newValue) {
+    var _a;
+    if (!Array.isArray(newValue)) {
+        return [
+            makeValueHotSwappable(newValue),
+            (_a = collectNestedHotSwappableValues(currentValue)) === null || _a === void 0 ? void 0 : _a.map((hotSwappable) => [hotSwappable, undefined]),
+        ];
+    }
+    let hasChanged = false;
+    const hotSwaps = [];
+    const newLength = newValue.length;
+    const currentLength = currentValue.length;
+    const maxLength = Math.max(currentLength, newLength);
+    const normalizedNewValue = [];
+    for (let i = 0; i < maxLength; i++) {
+        const currentArrayValue = currentValue[i];
+        const newArrayValue = newValue[i];
+        if (i < newLength) {
+            if (i >= currentLength) {
+                hasChanged = true;
+                normalizedNewValue[i] = makeValueHotSwappable(newArrayValue);
+                continue;
+            }
+            const [updatedValue, elementHotSwaps] = tryHotSwappingValues(currentArrayValue, newArrayValue);
+            if (elementHotSwaps)
+                hotSwaps.push(...elementHotSwaps);
+            if (updatedValue === IGNORE) {
+                normalizedNewValue[i] = currentArrayValue;
+                continue;
+            }
+            hasChanged = true;
+            normalizedNewValue[i] = updatedValue;
+        }
+        else {
+            hasChanged = true;
+            const nestedHotSwappables = collectNestedHotSwappableValues(currentArrayValue);
+            if (nestedHotSwappables) {
+                hotSwaps.push(...nestedHotSwappables.map((hotSwappable) => [hotSwappable, undefined]));
+            }
+        }
+    }
+    return [hasChanged ? normalizedNewValue : IGNORE, hotSwaps];
+}

build/ts/tests/root.test.js

@@ -141,2 +141,60 @@ "use strict";
         });
+        it('hot-swaps function props for arrays when the length increases', () => {
+            const firstActionFuncOne = jest.fn();
+            const firstActionFuncTwo = jest.fn();
+            const secondActionFunc = jest.fn();
+            const receiver = createDelayedReceiver();
+            const root = root_1.createRemoteRoot(receiver.receive);
+            const modal = root.createComponent('Modal', {
+                secondaryActions: [{ onAction: firstActionFuncOne }],
+            });
+            root.appendChild(modal);
+            root.mount();
+            modal.updateProps({
+                secondaryActions: [
+                    { onAction: firstActionFuncTwo },
+                    { onAction: secondActionFunc },
+                ],
+            });
+            receiver.flush();
+            const { secondaryActions: [firstAction, secondAction], } = receiver.children[0].props;
+            firstAction.onAction();
+            secondAction.onAction();
+            expect(firstActionFuncOne).not.toHaveBeenCalled();
+            expect(firstActionFuncTwo).toHaveBeenCalled();
+            expect(secondActionFunc).toHaveBeenCalled();
+        });
+        it('hot-swaps function props for nested arrays', () => {
+            const firstActionFuncOne = jest.fn();
+            const firstActionFuncTwo = jest.fn();
+            const secondActionFuncOne = jest.fn();
+            const receiver = createDelayedReceiver();
+            const root = root_1.createRemoteRoot(receiver.receive);
+            const modal = root.createComponent('Modal', {
+                actionGroups: [
+                    {
+                        actions: [{ onAction: firstActionFuncOne }],
+                    },
+                ],
+            });
+            root.appendChild(modal);
+            root.mount();
+            modal.updateProps({
+                actionGroups: [
+                    {
+                        actions: [
+                            { onAction: firstActionFuncTwo },
+                            { onAction: secondActionFuncOne },
+                        ],
+                    },
+                ],
+            });
+            receiver.flush();
+            const { actionGroups: [{ actions: [actionOne, actionTwo], },], } = receiver.children[0].props;
+            actionOne.onAction();
+            actionTwo.onAction();
+            expect(firstActionFuncOne).not.toHaveBeenCalled();
+            expect(firstActionFuncTwo).toHaveBeenCalled();
+            expect(secondActionFuncOne).toHaveBeenCalled();
+        });
     });
@@ -143,0 +201,0 @@ });

package.json

 {
   "name": "@remote-ui/core",
-  "version": "1.5.2",
+  "version": "1.5.3",
   "publishConfig": {
@@ -23,6 +23,6 @@ "access": "public",
   "dependencies": {
-    "@remote-ui/rpc": "^1.0.9",
+    "@remote-ui/rpc": "^1.0.10",
     "@remote-ui/types": "^1.0.4"
   },
-  "gitHead": "0981a0f1c83c5ab8c5ce6bc1cc8d247931fdb218"
+  "gitHead": "cc1bd68e40fb67346917b308503913ba11b61206"
 }

src/root.ts

@@ -469,123 +469,7 @@ import {RemoteComponentType} from '@remote-ui/types';
   if (Array.isArray(currentValue)) {
-    if (!Array.isArray(newValue)) {
-      return [
-        makeValueHotSwappable(newValue),
-        collectNestedHotSwappableValues(currentValue)?.map(
-          (hotSwappable) => [hotSwappable, undefined] as const,
-        ),
-      ];
-    }
-
-    let hasChanged = false;
-    const hotSwaps: HotSwapRecord[] = [];
-
-    const newLength = newValue.length;
-    const currentLength = currentValue.length;
-    const maxLength = Math.max(currentLength, newLength);
-
-    const normalizedNewValue: any[] = [];
-
-    for (let i = 0; i < maxLength; i++) {
-      const currentArrayValue = currentValue[i];
-      const newArrayValue = newValue[i];
-
-      if (i < newLength) {
-        if (i >= currentLength) {
-          hasChanged = true;
-          normalizedNewValue[i] = makeValueHotSwappable(newValue);
-        } else {
-          const [updatedValue, elementHotSwaps] = tryHotSwappingValues(
-            currentArrayValue,
-            newArrayValue,
-          );
-
-          if (elementHotSwaps) hotSwaps.push(...elementHotSwaps);
-
-          if (updatedValue === IGNORE) {
-            normalizedNewValue[i] = currentValue;
-          } else {
-            hasChanged = true;
-            normalizedNewValue[i] = updatedValue;
-          }
-        }
-      } else {
-        hasChanged = true;
-
-        const nestedHotSwappables = collectNestedHotSwappableValues(
-          currentArrayValue,
-        );
-
-        if (nestedHotSwappables) {
-          hotSwaps.push(
-            ...nestedHotSwappables.map(
-              (hotSwappable) => [hotSwappable, undefined] as const,
-            ),
-          );
-        }
-      }
-    }
-
-    return [hasChanged ? normalizedNewValue : IGNORE, hotSwaps];
+    return tryHotSwappingArrayValues(currentValue, newValue);
   }
 
   if (typeof currentValue === 'object' && currentValue != null) {
-    if (typeof newValue !== 'object' || newValue == null) {
-      return [
-        makeValueHotSwappable(newValue),
-        collectNestedHotSwappableValues(currentValue)?.map(
-          (hotSwappable) => [hotSwappable, undefined] as const,
-        ),
-      ];
-    }
-
-    let hasChanged = false;
-    const hotSwaps: HotSwapRecord[] = [];
-
-    const normalizedNewValue: {[key: string]: any} = {};
-
-    // eslint-disable-next-line guard-for-in
-    for (const key in currentValue) {
-      const currentObjectValue = (currentValue as any)[key];
-
-      if (!(key in newValue)) {
-        hasChanged = true;
-
-        const nestedHotSwappables = collectNestedHotSwappableValues(
-          currentObjectValue,
-        );
-
-        if (nestedHotSwappables) {
-          hotSwaps.push(
-            ...nestedHotSwappables.map(
-              (hotSwappable) => [hotSwappable, undefined] as const,
-            ),
-          );
-        }
-      }
-
-      const newObjectValue = (newValue as any)[key];
-
-      const [updatedValue, elementHotSwaps] = tryHotSwappingValues(
-        currentObjectValue,
-        newObjectValue,
-      );
-
-      if (elementHotSwaps) hotSwaps.push(...elementHotSwaps);
-
-      if (updatedValue === IGNORE) {
-        normalizedNewValue[key] = currentObjectValue;
-      } else {
-        hasChanged = true;
-        normalizedNewValue[key] = updatedValue;
-      }
-    }
-
-    for (const key in newValue) {
-      if (key in normalizedNewValue) continue;
-
-      hasChanged = true;
-      normalizedNewValue[key] = makeValueHotSwappable((newValue as any)[key]);
-    }
-
-    return [hasChanged ? normalizedNewValue : IGNORE, hotSwaps];
+    return tryHotSwappingObjectValues(currentValue, newValue);
   }
@@ -821,1 +705,131 @@
 }
+
+function tryHotSwappingObjectValues(
+  currentValue: object,
+  newValue: unknown,
+): [any, HotSwapRecord[]?] {
+  if (typeof newValue !== 'object' || newValue == null) {
+    return [
+      makeValueHotSwappable(newValue),
+      collectNestedHotSwappableValues(currentValue)?.map(
+        (hotSwappable) => [hotSwappable, undefined] as const,
+      ),
+    ];
+  }
+
+  let hasChanged = false;
+  const hotSwaps: HotSwapRecord[] = [];
+
+  const normalizedNewValue: {[key: string]: any} = {};
+
+  // eslint-disable-next-line guard-for-in
+  for (const key in currentValue) {
+    const currentObjectValue = (currentValue as any)[key];
+
+    if (!(key in newValue)) {
+      hasChanged = true;
+
+      const nestedHotSwappables = collectNestedHotSwappableValues(
+        currentObjectValue,
+      );
+
+      if (nestedHotSwappables) {
+        hotSwaps.push(
+          ...nestedHotSwappables.map(
+            (hotSwappable) => [hotSwappable, undefined] as const,
+          ),
+        );
+      }
+    }
+
+    const newObjectValue = (newValue as any)[key];
+
+    const [updatedValue, elementHotSwaps] = tryHotSwappingValues(
+      currentObjectValue,
+      newObjectValue,
+    );
+
+    if (elementHotSwaps) hotSwaps.push(...elementHotSwaps);
+
+    if (updatedValue !== IGNORE) {
+      hasChanged = true;
+      normalizedNewValue[key] = updatedValue;
+    }
+  }
+
+  for (const key in newValue) {
+    if (key in normalizedNewValue) continue;
+
+    hasChanged = true;
+    normalizedNewValue[key] = makeValueHotSwappable((newValue as any)[key]);
+  }
+
+  return [hasChanged ? normalizedNewValue : IGNORE, hotSwaps];
+}
+
+function tryHotSwappingArrayValues(
+  currentValue: unknown[],
+  newValue: unknown,
+): [any, HotSwapRecord[]?] {
+  if (!Array.isArray(newValue)) {
+    return [
+      makeValueHotSwappable(newValue),
+      collectNestedHotSwappableValues(currentValue)?.map(
+        (hotSwappable) => [hotSwappable, undefined] as const,
+      ),
+    ];
+  }
+
+  let hasChanged = false;
+  const hotSwaps: HotSwapRecord[] = [];
+
+  const newLength = newValue.length;
+  const currentLength = currentValue.length;
+  const maxLength = Math.max(currentLength, newLength);
+
+  const normalizedNewValue: any[] = [];
+
+  for (let i = 0; i < maxLength; i++) {
+    const currentArrayValue = currentValue[i];
+    const newArrayValue = newValue[i];
+
+    if (i < newLength) {
+      if (i >= currentLength) {
+        hasChanged = true;
+        normalizedNewValue[i] = makeValueHotSwappable(newArrayValue);
+        continue;
+      }
+
+      const [updatedValue, elementHotSwaps] = tryHotSwappingValues(
+        currentArrayValue,
+        newArrayValue,
+      );
+
+      if (elementHotSwaps) hotSwaps.push(...elementHotSwaps);
+
+      if (updatedValue === IGNORE) {
+        normalizedNewValue[i] = currentArrayValue;
+        continue;
+      }
+
+      hasChanged = true;
+      normalizedNewValue[i] = updatedValue;
+    } else {
+      hasChanged = true;
+
+      const nestedHotSwappables = collectNestedHotSwappableValues(
+        currentArrayValue,
+      );
+
+      if (nestedHotSwappables) {
+        hotSwaps.push(
+          ...nestedHotSwappables.map(
+            (hotSwappable) => [hotSwappable, undefined] as const,
+          ),
+        );
+      }
+    }
+  }
+
+  return [hasChanged ? normalizedNewValue : IGNORE, hotSwaps];
+}

src/tests/root.test.ts

@@ -179,2 +179,85 @@ import {createRemoteRoot} from '../root';
     });
+
+    it('hot-swaps function props for arrays when the length increases', () => {
+      const firstActionFuncOne = jest.fn();
+      const firstActionFuncTwo = jest.fn();
+      const secondActionFunc = jest.fn();
+      const receiver = createDelayedReceiver();
+
+      const root = createRemoteRoot(receiver.receive);
+      const modal = root.createComponent('Modal', {
+        secondaryActions: [{onAction: firstActionFuncOne}],
+      });
+
+      root.appendChild(modal);
+      root.mount();
+
+      modal.updateProps({
+        secondaryActions: [
+          {onAction: firstActionFuncTwo},
+          {onAction: secondActionFunc},
+        ],
+      });
+
+      receiver.flush();
+
+      const {
+        secondaryActions: [firstAction, secondAction],
+      } = (receiver.children[0] as any).props;
+
+      firstAction.onAction();
+      secondAction.onAction();
+
+      expect(firstActionFuncOne).not.toHaveBeenCalled();
+      expect(firstActionFuncTwo).toHaveBeenCalled();
+      expect(secondActionFunc).toHaveBeenCalled();
+    });
+
+    it('hot-swaps function props for nested arrays', () => {
+      const firstActionFuncOne = jest.fn();
+      const firstActionFuncTwo = jest.fn();
+      const secondActionFuncOne = jest.fn();
+      const receiver = createDelayedReceiver();
+
+      const root = createRemoteRoot(receiver.receive);
+      const modal = root.createComponent('Modal', {
+        actionGroups: [
+          {
+            actions: [{onAction: firstActionFuncOne}],
+          },
+        ],
+      });
+
+      root.appendChild(modal);
+      root.mount();
+
+      modal.updateProps({
+        actionGroups: [
+          {
+            actions: [
+              {onAction: firstActionFuncTwo},
+              {onAction: secondActionFuncOne},
+            ],
+          },
+        ],
+      });
+
+      receiver.flush();
+
+      const {
+        actionGroups: [
+          {
+            actions: [actionOne, actionTwo],
+          },
+        ],
+      } = (receiver.children[0] as any).props;
+
+      actionOne.onAction();
+      actionTwo.onAction();
+
+      expect(firstActionFuncOne).not.toHaveBeenCalled();
+      expect(firstActionFuncTwo).toHaveBeenCalled();
+
+      expect(secondActionFuncOne).toHaveBeenCalled();
+    });
   });
@@ -181,0 +264,0 @@ });

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

590535

increased by2.71%

Lines of code

5995

increased by6.28%

Dependency changes

• Updated@remote-ui/rpc@^1.0.10