@livechat/postmessage - npm Package Compare versions

Comparing version 0.3.1 to 0.3.2-0

dist/postmessenger-es5.cjs.js

@@ -678,5 +678,8 @@ 'use strict';
 var requestCounter = 0;
-var makeRequest = (function (ownMessage$, postMessage, payload) {
+var makeRequest = (function (ownMessage$, postMessage, payload, request) {
+  if (request === void 0) {
+    request = requestCounter++;
+  }
+
   return defer(function () {
-    var request = requestCounter++;
     payload.request = request;
@@ -905,2 +908,6 @@ postMessage(payload);
 
+  if (process.env.NODE_ENV !== 'production' && handshakeRetry.count && handshakeRetry.count < 500) {
+    throw new Error('`handshakeRetry.interval` should be no less than 500.');
+  }
+
   var _partitionModel = partitionModel(model),
@@ -935,3 +942,7 @@ methods = _partitionModel[0],
 
-  var handshake$ = share(callbagTake(1)(retry(handshakeRetry.count || 5)(timeout(handshakeRetry.interval || 500)(takeUntil(destroy$)(makeRequest(ownMessage$, postMessage, createMessage(HANDSHAKE, data)))))));
+  var handshake$ = share(callbagTake(1)(retry(handshakeRetry.count || 5)(timeout(handshakeRetry.interval || 500)(takeUntil(destroy$)( // we don't care about which handshake response we actually get back
+  // so we pass null as requestId here
+  // without it it's possible that child would respond when parent already has started a new handshake request
+  // and this would cause a requestId mismatch and thus the response would get ignored
+  makeRequest(ownMessage$, postMessage, createMessage(HANDSHAKE, data), null))))));
 
@@ -972,2 +983,35 @@ var _messageHandler = createMessageHandler(api, emitter.emit, postMessage, methods);
 
+/**
+ * Debounces the given listenable source
+ *
+ * @param {number} wait - The number of ms to wait before letting a value pass
+ * @returns {Function}
+ */
+function debounce(wait) {
+  return function (source) {
+    return function (start, sink) {
+      if (start !== 0) return;
+      var timeout;
+      source(0, function (t, d) {
+        if (t === 1 || t === 2 && d === undefined) {
+          // t === 1 means the source is emitting a value
+          // t === 2 and d === undefined means the source emits a completion
+          if (!timeout && t === 2) {
+            return sink(t, d);
+          }
+
+          if (timeout) {
+            clearTimeout(timeout);
+          }
+
+          timeout = setTimeout(function () {
+            sink(t, d);
+            timeout = undefined;
+          }, wait);
+        } else sink(t, d);
+      });
+    };
+  };
+}
+
 function connectToParent(model, _temp) {
@@ -982,6 +1026,15 @@ if (model === void 0) {
 
+  if (process.env.NODE_ENV !== 'production' && handshakeTimeout < 1000) {
+    throw new Error('`handshakeTimeout` should be no less than 1000.');
+  }
+
   var handshake$ = switchMap(function () {
-    return callbagTake(1)(timeout(handshakeTimeout)(readme$1(function (message) {
+    return callbagTake(1)(timeout(handshakeTimeout)( // this is quite bizarre, but when iframe reloads during handshake process
+    // it can get "outdated" handshake (destined for the previous site)
+    // even *after* receiving its own "load" event
+    // we debounce here so event loop has a chance to flush all received messages
+    // as the parent site might send the handshake for a new site quickly after sending one for the previos iframe site
+    debounce(50)(readme$1(function (message) {
       return message.type === HANDSHAKE;
-    })(getWindowMessage$())));
+    })(getWindowMessage$()))));
   })(callbagTake(1)(getDocumentReady$())); // create & return api after handshake
@@ -988,0 +1041,0 @@

dist/postmessenger-es5.esm.js

@@ -672,5 +672,8 @@ import { noop, once, hasOwn, partitionObject, generateRandomId } from '@livechat/data-utils';
 var requestCounter = 0;
-var makeRequest = (function (ownMessage$, postMessage, payload) {
+var makeRequest = (function (ownMessage$, postMessage, payload, request) {
+  if (request === void 0) {
+    request = requestCounter++;
+  }
+
   return defer(function () {
-    var request = requestCounter++;
     payload.request = request;
@@ -899,2 +902,6 @@ postMessage(payload);
 
+  if (process.env.NODE_ENV !== 'production' && handshakeRetry.count && handshakeRetry.count < 500) {
+    throw new Error('`handshakeRetry.interval` should be no less than 500.');
+  }
+
   var _partitionModel = partitionModel(model),
@@ -929,3 +936,7 @@ methods = _partitionModel[0],
 
-  var handshake$ = share(callbagTake(1)(retry(handshakeRetry.count || 5)(timeout(handshakeRetry.interval || 500)(takeUntil(destroy$)(makeRequest(ownMessage$, postMessage, createMessage(HANDSHAKE, data)))))));
+  var handshake$ = share(callbagTake(1)(retry(handshakeRetry.count || 5)(timeout(handshakeRetry.interval || 500)(takeUntil(destroy$)( // we don't care about which handshake response we actually get back
+  // so we pass null as requestId here
+  // without it it's possible that child would respond when parent already has started a new handshake request
+  // and this would cause a requestId mismatch and thus the response would get ignored
+  makeRequest(ownMessage$, postMessage, createMessage(HANDSHAKE, data), null))))));
 
@@ -966,2 +977,35 @@ var _messageHandler = createMessageHandler(api, emitter.emit, postMessage, methods);
 
+/**
+ * Debounces the given listenable source
+ *
+ * @param {number} wait - The number of ms to wait before letting a value pass
+ * @returns {Function}
+ */
+function debounce(wait) {
+  return function (source) {
+    return function (start, sink) {
+      if (start !== 0) return;
+      var timeout;
+      source(0, function (t, d) {
+        if (t === 1 || t === 2 && d === undefined) {
+          // t === 1 means the source is emitting a value
+          // t === 2 and d === undefined means the source emits a completion
+          if (!timeout && t === 2) {
+            return sink(t, d);
+          }
+
+          if (timeout) {
+            clearTimeout(timeout);
+          }
+
+          timeout = setTimeout(function () {
+            sink(t, d);
+            timeout = undefined;
+          }, wait);
+        } else sink(t, d);
+      });
+    };
+  };
+}
+
 function connectToParent(model, _temp) {
@@ -976,6 +1020,15 @@ if (model === void 0) {
 
+  if (process.env.NODE_ENV !== 'production' && handshakeTimeout < 1000) {
+    throw new Error('`handshakeTimeout` should be no less than 1000.');
+  }
+
   var handshake$ = switchMap(function () {
-    return callbagTake(1)(timeout(handshakeTimeout)(readme$1(function (message) {
+    return callbagTake(1)(timeout(handshakeTimeout)( // this is quite bizarre, but when iframe reloads during handshake process
+    // it can get "outdated" handshake (destined for the previous site)
+    // even *after* receiving its own "load" event
+    // we debounce here so event loop has a chance to flush all received messages
+    // as the parent site might send the handshake for a new site quickly after sending one for the previos iframe site
+    debounce(50)(readme$1(function (message) {
       return message.type === HANDSHAKE;
-    })(getWindowMessage$())));
+    })(getWindowMessage$()))));
   })(callbagTake(1)(getDocumentReady$())); // create & return api after handshake
@@ -982,0 +1035,0 @@

dist/postmessenger.cjs.js

@@ -27,2 +27,3 @@ 'use strict';
 var timeout = _interopDefault(require('callbag-timeout'));
+var callbagDebounce = require('callbag-debounce');
 var _objectWithoutPropertiesLoose = _interopDefault(require('@babel/runtime/helpers/objectWithoutPropertiesLoose'));
@@ -63,5 +64,8 @@ var domUtils = require('@livechat/dom-utils');
 var requestCounter = 0;
-var makeRequest = (function (ownMessage$, postMessage, payload) {
+var makeRequest = (function (ownMessage$, postMessage, payload, request) {
+  if (request === void 0) {
+    request = requestCounter++;
+  }
+
   return defer(function () {
-    var request = requestCounter++;
     payload.request = request;
@@ -265,2 +269,6 @@ postMessage(payload);
 
+  if (process.env.NODE_ENV !== 'production' && handshakeRetry.count && handshakeRetry.count < 500) {
+    throw new Error('`handshakeRetry.interval` should be no less than 500.');
+  }
+
   var _partitionModel = partitionModel(model),
@@ -295,3 +303,7 @@ methods = _partitionModel[0],
 
-  var handshake$ = share(take(1)(retry(handshakeRetry.count || 5)(timeout(handshakeRetry.interval || 500)(takeUntil(destroy$)(makeRequest(ownMessage$, postMessage, createMessage(HANDSHAKE, data)))))));
+  var handshake$ = share(take(1)(retry(handshakeRetry.count || 5)(timeout(handshakeRetry.interval || 500)(takeUntil(destroy$)( // we don't care about which handshake response we actually get back
+  // so we pass null as requestId here
+  // without it it's possible that child would respond when parent already has started a new handshake request
+  // and this would cause a requestId mismatch and thus the response would get ignored
+  makeRequest(ownMessage$, postMessage, createMessage(HANDSHAKE, data), null))))));
 
@@ -341,6 +353,15 @@ var _messageHandler = createMessageHandler(api, emitter.emit, postMessage, methods);
 
+  if (process.env.NODE_ENV !== 'production' && handshakeTimeout < 1000) {
+    throw new Error('`handshakeTimeout` should be no less than 1000.');
+  }
+
   var handshake$ = switchMap(function () {
-    return take(1)(timeout(handshakeTimeout)(filter(function (message) {
+    return take(1)(timeout(handshakeTimeout)( // this is quite bizarre, but when iframe reloads during handshake process
+    // it can get "outdated" handshake (destined for the previous site)
+    // even *after* receiving its own "load" event
+    // we debounce here so event loop has a chance to flush all received messages
+    // as the parent site might send the handshake for a new site quickly after sending one for the previos iframe site
+    callbagDebounce.debounce(50)(filter(function (message) {
       return message.type === HANDSHAKE;
-    })(getWindowMessage$())));
+    })(getWindowMessage$()))));
   })(take(1)(getDocumentReady$())); // create & return api after handshake
@@ -347,0 +368,0 @@

dist/postmessenger.esm.js

@@ -21,2 +21,3 @@ import { noop, once, hasOwn, partitionObject, generateRandomId } from '@livechat/data-utils';
 import timeout from 'callbag-timeout';
+import { debounce } from 'callbag-debounce';
 import _objectWithoutPropertiesLoose from '@babel/runtime/helpers/esm/objectWithoutPropertiesLoose';
@@ -57,5 +58,8 @@ import { removeNode } from '@livechat/dom-utils';
 var requestCounter = 0;
-var makeRequest = (function (ownMessage$, postMessage, payload) {
+var makeRequest = (function (ownMessage$, postMessage, payload, request) {
+  if (request === void 0) {
+    request = requestCounter++;
+  }
+
   return defer(function () {
-    var request = requestCounter++;
     payload.request = request;
@@ -259,2 +263,6 @@ postMessage(payload);
 
+  if (process.env.NODE_ENV !== 'production' && handshakeRetry.count && handshakeRetry.count < 500) {
+    throw new Error('`handshakeRetry.interval` should be no less than 500.');
+  }
+
   var _partitionModel = partitionModel(model),
@@ -289,3 +297,7 @@ methods = _partitionModel[0],
 
-  var handshake$ = share(take(1)(retry(handshakeRetry.count || 5)(timeout(handshakeRetry.interval || 500)(takeUntil(destroy$)(makeRequest(ownMessage$, postMessage, createMessage(HANDSHAKE, data)))))));
+  var handshake$ = share(take(1)(retry(handshakeRetry.count || 5)(timeout(handshakeRetry.interval || 500)(takeUntil(destroy$)( // we don't care about which handshake response we actually get back
+  // so we pass null as requestId here
+  // without it it's possible that child would respond when parent already has started a new handshake request
+  // and this would cause a requestId mismatch and thus the response would get ignored
+  makeRequest(ownMessage$, postMessage, createMessage(HANDSHAKE, data), null))))));
 
@@ -335,6 +347,15 @@ var _messageHandler = createMessageHandler(api, emitter.emit, postMessage, methods);
 
+  if (process.env.NODE_ENV !== 'production' && handshakeTimeout < 1000) {
+    throw new Error('`handshakeTimeout` should be no less than 1000.');
+  }
+
   var handshake$ = switchMap(function () {
-    return take(1)(timeout(handshakeTimeout)(filter(function (message) {
+    return take(1)(timeout(handshakeTimeout)( // this is quite bizarre, but when iframe reloads during handshake process
+    // it can get "outdated" handshake (destined for the previous site)
+    // even *after* receiving its own "load" event
+    // we debounce here so event loop has a chance to flush all received messages
+    // as the parent site might send the handshake for a new site quickly after sending one for the previos iframe site
+    debounce(50)(filter(function (message) {
       return message.type === HANDSHAKE;
-    })(getWindowMessage$())));
+    })(getWindowMessage$()))));
   })(take(1)(getDocumentReady$())); // create & return api after handshake
@@ -341,0 +362,0 @@

package.json

 {
   "name": "@livechat/postmessage",
-  "version": "0.3.1",
+  "version": "0.3.2-0",
   "description": "",
@@ -22,2 +22,3 @@ "contributors": [
     "callbag-create": "^2.0.1",
+    "callbag-debounce": "^2.1.1",
     "callbag-defer": "^1.1.0",
@@ -24,0 +25,0 @@ "callbag-filter": "^1.0.1",

No alert changes

Improved metrics

Total package byte prevSize

99795

6.7%

Lines of code

2990

4.55%

Worsened metrics

Dependency count

24

4.35%

Number of low supply chain risk alerts

29

38.1%

Dependency changes

• + Added

  callbag-debounce@^2.1.1

• + Added

  callbag-debounce@2.1.3
  (transitive)