@atlaskit/collab-provider 8.2.0 → 8.3.0

package/CHANGELOG.md

@@ -1,5 +1,38 @@
 # @atlaskit/collab-provider
 
+## 8.3.0
+
+### Minor Changes
+
+- [`1d36e909618`](https://bitbucket.org/atlassian/atlassian-frontend/commits/1d36e909618) - Log error on document restore
+- [`0529b1b833c`](https://bitbucket.org/atlassian/atlassian-frontend/commits/0529b1b833c) - Trigger catch up call on process steps failing
+- [`4f005660ce2`](https://bitbucket.org/atlassian/atlassian-frontend/commits/4f005660ce2) - Log step commit errors to analytics
+- [`6034004a812`](https://bitbucket.org/atlassian/atlassian-frontend/commits/6034004a812) - Log errors on reconnection failure
+- [`a261b2a9e6a`](https://bitbucket.org/atlassian/atlassian-frontend/commits/a261b2a9e6a) - [ESS-3183] Catch any errors in Presence functionality so an uncaught error there doesn't impact regular operation of the collab provider
+- [`7f35ae7d99c`](https://bitbucket.org/atlassian/atlassian-frontend/commits/7f35ae7d99c) - [ESS-2815] Added network status to analytics events
+- [`80feb6de229`](https://bitbucket.org/atlassian/atlassian-frontend/commits/80feb6de229) - [ESS-2815] Emit an error to consumers if the reconnections fails 8 times due to the network issues
+- [`611d9c643c6`](https://bitbucket.org/atlassian/atlassian-frontend/commits/611d9c643c6) - [ESS-3183] Retry syncing unconfirmed steps
+
+### Patch Changes
+
+- [`fccc5952d49`](https://bitbucket.org/atlassian/atlassian-frontend/commits/fccc5952d49) - Revert emitting errors to Confluence by default
+- [`0d25bcca6bb`](https://bitbucket.org/atlassian/atlassian-frontend/commits/0d25bcca6bb) - Added more comprehensive error handling for performance/analytics/ufo events in collab provider
+- [`e97495c5748`](https://bitbucket.org/atlassian/atlassian-frontend/commits/e97495c5748) - Extract emitTelepointer logic from Provider
+- [`260d1355cc6`](https://bitbucket.org/atlassian/atlassian-frontend/commits/260d1355cc6) - Reconnect collab provider immediately when browser emits online event.
+- [`5725fb45955`](https://bitbucket.org/atlassian/atlassian-frontend/commits/5725fb45955) - Introduce a file for UFO.
+
+  Introduce a file for commit step logic, which was already separate from the provider class
+
+- [`2b648e4db70`](https://bitbucket.org/atlassian/atlassian-frontend/commits/2b648e4db70) - NO-ISSUE Remove the analytics fall-back after validating acks work as expected
+- [`35c5e7dd9d5`](https://bitbucket.org/atlassian/atlassian-frontend/commits/35c5e7dd9d5) - NO-ISSUE deduplicate the analytics types dependency (again)
+- [`1c255047a29`](https://bitbucket.org/atlassian/atlassian-frontend/commits/1c255047a29) - improve catchup error handling
+- [`c9ad25cf224`](https://bitbucket.org/atlassian/atlassian-frontend/commits/c9ad25cf224) - [ESS-3183] Create abstraction around sending analytics events for errors or action events
+- [`607a34f4426`](https://bitbucket.org/atlassian/atlassian-frontend/commits/607a34f4426) - Pass through the analytics web client in places it was missing
+- [`efb112b06ab`](https://bitbucket.org/atlassian/atlassian-frontend/commits/efb112b06ab) - Move disonnected reason mapper
+- [`9e6ceda8977`](https://bitbucket.org/atlassian/atlassian-frontend/commits/9e6ceda8977) - Provide the reason for a page reset
+- [`6956eedc944`](https://bitbucket.org/atlassian/atlassian-frontend/commits/6956eedc944) - Tighten type definitions on analytics events
+- Updated dependencies
+
 ## 8.2.0
 
 ### Minor Changes

package/dist/cjs/analytics/index.js

@@ -4,34 +4,91 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.triggerAnalyticsEvent = void 0;
+exports.default = void 0;
+var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
+var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _const = require("../helpers/const");
 var _versionWrapper = require("../version-wrapper");
+var _singleton = require("../connectivity/singleton");
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+var EVENT_SUBJECT = 'collab';
+var COLLAB_SERVICE;
+(function (COLLAB_SERVICE) {
+  COLLAB_SERVICE["NCS"] = "ncs";
+  COLLAB_SERVICE["SYNCHRONY"] = "synchrony";
+})(COLLAB_SERVICE || (COLLAB_SERVICE = {}));
 var triggerAnalyticsEvent = function triggerAnalyticsEvent(analyticsEvent, analyticsClient) {
   if (!analyticsClient) {
     return;
   }
   var payload = {
-    actionSubject: _const.EVENT_SUBJECT,
+    actionSubject: EVENT_SUBJECT,
     attributes: _objectSpread({
       packageName: _versionWrapper.name,
       packageVersion: _versionWrapper.version,
-      collabService: _const.COLLAB_SERVICE.NCS
+      collabService: COLLAB_SERVICE.NCS,
+      network: {
+        status: _singleton.network.getStatus()
+      }
     }, analyticsEvent.attributes),
     tags: ['editor'],
     action: analyticsEvent.eventAction,
     source: 'unknown' // Adds zero analytics value, but event validation throws an error if you don't add it :-(
   };
 
+  if (analyticsEvent.eventAction === _const.EVENT_ACTION.ERROR) {
+    payload.nonPrivacySafeAttributes = analyticsEvent.nonPrivacySafeAttributes;
+  }
+
   // Let the browser figure out
   // when it should send those events
-  var requestIdleCallbackFunction = window.requestIdleCallback;
-  var runItLater = typeof requestIdleCallbackFunction === 'function' ? requestIdleCallbackFunction : window.requestAnimationFrame;
-  runItLater(function () {
-    analyticsClient.sendOperationalEvent(payload);
-  });
+  try {
+    var requestIdleCallbackFunction = window.requestIdleCallback;
+    var runItLater = typeof requestIdleCallbackFunction === 'function' ? requestIdleCallbackFunction : window.requestAnimationFrame;
+    runItLater(function () {
+      analyticsClient.sendOperationalEvent(payload);
+    });
+  } catch (error) {
+    // silently fail for now https://product-fabric.atlassian.net/browse/ESS-3112
+  }
 };
-exports.triggerAnalyticsEvent = triggerAnalyticsEvent;
+var AnalyticsHelper = /*#__PURE__*/function () {
+  function AnalyticsHelper(documentAri, analyticsClient) {
+    (0, _classCallCheck2.default)(this, AnalyticsHelper);
+    this.analyticsClient = analyticsClient;
+    this.documentAri = documentAri;
+  }
+  (0, _createClass2.default)(AnalyticsHelper, [{
+    key: "sendErrorEvent",
+    value: function sendErrorEvent(error, errorMessage) {
+      var errorAnalyticsEvent = {
+        eventAction: _const.EVENT_ACTION.ERROR,
+        attributes: {
+          documentAri: this.documentAri,
+          errorMessage: errorMessage
+        },
+        nonPrivacySafeAttributes: {
+          error: error
+        }
+      };
+      triggerAnalyticsEvent(errorAnalyticsEvent, this.analyticsClient);
+    }
+  }, {
+    key: "sendActionEvent",
+    value: function sendActionEvent(action, status, attributes // This breaks discriminated unions, because there is no obvious field to discriminate against any more
+    ) {
+      var analyticsEvent = {
+        eventAction: action,
+        attributes: _objectSpread({
+          documentAri: this.documentAri,
+          eventStatus: status
+        }, attributes)
+      };
+      triggerAnalyticsEvent(analyticsEvent, this.analyticsClient);
+    }
+  }]);
+  return AnalyticsHelper;
+}();
+exports.default = AnalyticsHelper;

package/dist/cjs/analytics/performance.js

@@ -4,7 +4,6 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.MEASURE_NAME = void 0;
-exports.clearMeasure = clearMeasure;
 exports.startMeasure = startMeasure;
 exports.stopMeasure = stopMeasure;
 var MEASURE_NAME;
@@ -12,8 +11,8 @@ exports.MEASURE_NAME = MEASURE_NAME;
 (function (MEASURE_NAME) {
   MEASURE_NAME["SOCKET_CONNECT"] = "socketConnect";
   MEASURE_NAME["DOCUMENT_INIT"] = "documentInit";
-  MEASURE_NAME["CONVERT_PM_TO_ADF"] = "convertPMToADF";
   MEASURE_NAME["COMMIT_UNCONFIRMED_STEPS"] = "commitUnconfirmedSteps";
+  MEASURE_NAME["PUBLISH_PAGE"] = "publishPage";
 })(MEASURE_NAME || (exports.MEASURE_NAME = MEASURE_NAME = {}));
 var isPerformanceAPIAvailable = function isPerformanceAPIAvailable() {
   return typeof window !== 'undefined' && 'performance' in window && ['measure', 'clearMeasures', 'clearMarks', 'getEntriesByName', 'getEntriesByType'].every(function (api) {
@@ -22,45 +21,56 @@ var isPerformanceAPIAvailable = function isPerformanceAPIAvailable() {
 };
 var hasPerformanceAPIAvailable = isPerformanceAPIAvailable();
 var measureMap = new Map();
-function startMeasure(measureName) {
-  if (!hasPerformanceAPIAvailable) {
-    return;
+function startMeasure(measureName, analyticsHelper) {
+  try {
+    if (!hasPerformanceAPIAvailable) {
+      return;
+    }
+    performance.mark("".concat(measureName, "::start"));
+    measureMap.set(measureName, performance.now());
+  } catch (error) {
+    analyticsHelper === null || analyticsHelper === void 0 ? void 0 : analyticsHelper.sendErrorEvent(error, 'Error while measuring performance when marking the start');
   }
-  performance.mark("".concat(measureName, "::start"));
-  measureMap.set(measureName, performance.now());
 }
-function stopMeasure(measureName, onMeasureComplete) {
-  if (!hasPerformanceAPIAvailable) {
-    return;
-  }
-
-  // `startMeasure` is not called with `measureName` before.
-  if (!measureMap.get(measureName)) {
-    return;
-  }
-  performance.mark("".concat(measureName, "::end"));
-  var start = onMeasureComplete ? measureMap.get(measureName) : undefined;
+function stopMeasure(measureName, analyticsHelper, onMeasureComplete) {
+  var start;
   try {
+    if (!hasPerformanceAPIAvailable) {
+      return;
+    }
+
+    // `startMeasure` is not called with `measureName` before.
+    if (!measureMap.get(measureName)) {
+      return;
+    }
+    performance.mark("".concat(measureName, "::end"));
+    start = onMeasureComplete ? measureMap.get(measureName) : undefined;
     performance.measure(measureName, "".concat(measureName, "::start"), "".concat(measureName, "::end"));
-  } catch (e) {}
-  var entry = performance.getEntriesByName(measureName).pop();
-  clearMeasure(measureName);
-  var measure;
-  if (entry) {
-    measure = {
-      duration: entry.duration,
-      startTime: entry.startTime
-    };
-  } else if (start) {
-    measure = {
-      duration: performance.now() - start,
-      startTime: start
-    };
+  } catch (error) {
+    analyticsHelper === null || analyticsHelper === void 0 ? void 0 : analyticsHelper.sendErrorEvent(error, 'Error while measuring performance when marking the end');
   }
-  if (measure && onMeasureComplete) {
-    onMeasureComplete(measure.duration, measure.startTime);
+  try {
+    var entry = performance.getEntriesByName(measureName).pop();
+    clearMeasure(measureName);
+    var measure;
+    if (entry) {
+      measure = {
+        duration: entry.duration,
+        startTime: entry.startTime
+      };
+    } else if (start) {
+      measure = {
+        duration: performance.now() - start,
+        startTime: start
+      };
+    }
+    if (measure && onMeasureComplete) {
+      onMeasureComplete(measure.duration, measure.startTime);
+    }
+    return measure;
+  } catch (error) {
+    analyticsHelper === null || analyticsHelper === void 0 ? void 0 : analyticsHelper.sendErrorEvent(error, 'Error while measuring performance when completing the measurement');
   }
-  return measure;
 }
 function clearMeasure(measureName) {
   if (!hasPerformanceAPIAvailable) {

package/dist/cjs/analytics/ufo.js

@@ -0,0 +1,33 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.createDocInitExp = void 0;
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _ufo = require("@atlaskit/ufo");
+var createDocumentInitExperience = function createDocumentInitExperience() {
+  return new _ufo.UFOExperience('collab-provider.document-init', {
+    type: _ufo.ExperienceTypes.Load,
+    performanceType: _ufo.ExperiencePerformanceTypes.Custom,
+    performanceConfig: {
+      histogram: (0, _defineProperty2.default)({}, _ufo.ExperiencePerformanceTypes.Custom, {
+        duration: '250_500_1000_1500_2000_3000_4000'
+      })
+    }
+  });
+};
+var withErrorHandling = function withErrorHandling(createExperience, analyticsHelper) {
+  var initExperience;
+  try {
+    initExperience = createExperience();
+  } catch (error) {
+    analyticsHelper === null || analyticsHelper === void 0 ? void 0 : analyticsHelper.sendErrorEvent(error, 'Error while initialising a UFO experience');
+  }
+  return initExperience;
+};
+var createDocInitExp = function createDocInitExp(analyticsHelper) {
+  return withErrorHandling(createDocumentInitExperience, analyticsHelper);
+};
+exports.createDocInitExp = createDocInitExp;

package/dist/cjs/channel.js

@@ -19,9 +19,10 @@ var _emitter = require("./emitter");
 var _errorCodeMapper = require("./error-code-mapper");
 var _utils = require("./helpers/utils");
 var _performance = require("./analytics/performance");
-var _analytics = require("./analytics");
 var _const = require("./helpers/const");
-var _ufo = require("@atlaskit/ufo");
+var _reconnectHelper = _interopRequireDefault(require("./connectivity/reconnect-helper"));
+var _ufo = require("./analytics/ufo");
+var _network = _interopRequireDefault(require("./connectivity/network"));
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(this, result); }; }
@@ -30,22 +31,15 @@ var logger = (0, _utils.createLogger)('Channel', 'green');
 var Channel = /*#__PURE__*/function (_Emitter) {
   (0, _inherits2.default)(Channel, _Emitter);
   var _super = _createSuper(Channel);
-  function Channel(config) {
+  function Channel(config, analyticsHelper) {
     var _this;
     (0, _classCallCheck2.default)(this, Channel);
     _this = _super.call(this);
     (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "connected", false);
     (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "socket", null);
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "reconnectHelper", null);
     (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "initialized", false);
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "initExperience", new _ufo.UFOExperience('collab-provider.document-init', {
-      type: _ufo.ExperienceTypes.Load,
-      performanceType: _ufo.ExperiencePerformanceTypes.Custom,
-      performanceConfig: {
-        histogram: (0, _defineProperty2.default)({}, _ufo.ExperiencePerformanceTypes.Custom, {
-          duration: '250_500_1000_1500_2000_3000_4000'
-        })
-      }
-    }));
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "network", null);
     (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "getInitialized", function () {
       return _this.initialized;
     });
@@ -56,16 +50,12 @@ var Channel = /*#__PURE__*/function (_Emitter) {
       return _this.socket;
     });
     (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onConnectError", function (error) {
-      var measure = (0, _performance.stopMeasure)(_performance.MEASURE_NAME.SOCKET_CONNECT);
-      (0, _analytics.triggerAnalyticsEvent)({
-        eventAction: _const.EVENT_ACTION.CONNECTION,
-        attributes: {
-          eventStatus: _const.EVENT_STATUS.FAILURE,
-          error: error,
-          latency: measure === null || measure === void 0 ? void 0 : measure.duration,
-          documentAri: _this.config.documentAri
-        }
-      }, _this.analyticsClient);
+      var _this$analyticsHelper, _this$analyticsHelper2;
+      var measure = (0, _performance.stopMeasure)(_performance.MEASURE_NAME.SOCKET_CONNECT, _this.analyticsHelper);
+      (_this$analyticsHelper = _this.analyticsHelper) === null || _this$analyticsHelper === void 0 ? void 0 : _this$analyticsHelper.sendActionEvent(_const.EVENT_ACTION.CONNECTION, _const.EVENT_STATUS.FAILURE, {
+        latency: measure === null || measure === void 0 ? void 0 : measure.duration
+      });
+      (_this$analyticsHelper2 = _this.analyticsHelper) === null || _this$analyticsHelper2 === void 0 ? void 0 : _this$analyticsHelper2.sendErrorEvent(error, 'Error while establishing connection');
       // If error received with `data`, it means the connection is rejected
       // by the server on purpose for example no permission, so no need to
       // keep the underneath connection, need to close. But some error like
@@ -79,18 +69,29 @@ var Channel = /*#__PURE__*/function (_Emitter) {
         data: error.data
       });
     });
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onReconnectError", function (error) {
+      var _this$reconnectHelper, _this$reconnectHelper2;
+      (_this$reconnectHelper = _this.reconnectHelper) === null || _this$reconnectHelper === void 0 ? void 0 : _this$reconnectHelper.countReconnectError();
+      if ((_this$reconnectHelper2 = _this.reconnectHelper) !== null && _this$reconnectHelper2 !== void 0 && _this$reconnectHelper2.isLikelyNetworkIssue()) {
+        var _this$analyticsHelper3;
+        (_this$analyticsHelper3 = _this.analyticsHelper) === null || _this$analyticsHelper3 === void 0 ? void 0 : _this$analyticsHelper3.sendErrorEvent(error, 'Likely network issue while reconnecting the channel');
+        _this.emit('error', {
+          message: 'Reconnection failed 8 times when browser was offline, likely there was a network issue.',
+          data: {
+            status: 400,
+            code: 'RECONNECTION_NETWORK_ISSUE'
+          }
+        });
+      }
+    });
     (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onConnect", function () {
+      var _this$analyticsHelper4;
       _this.connected = true;
       logger('Connected.', _this.socket.id);
-      var measure = (0, _performance.stopMeasure)(_performance.MEASURE_NAME.SOCKET_CONNECT);
-      (0, _analytics.triggerAnalyticsEvent)({
-        eventAction: _const.EVENT_ACTION.CONNECTION,
-        attributes: {
-          eventStatus: _const.EVENT_STATUS.SUCCESS,
-          latency: measure === null || measure === void 0 ? void 0 : measure.duration,
-          documentAri: _this.config.documentAri
-        }
-      }, _this.analyticsClient);
+      var measure = (0, _performance.stopMeasure)(_performance.MEASURE_NAME.SOCKET_CONNECT, _this.analyticsHelper);
+      (_this$analyticsHelper4 = _this.analyticsHelper) === null || _this$analyticsHelper4 === void 0 ? void 0 : _this$analyticsHelper4.sendActionEvent(_const.EVENT_ACTION.CONNECTION, _const.EVENT_STATUS.SUCCESS, {
+        latency: measure === null || measure === void 0 ? void 0 : measure.duration
+      });
       _this.emit('connected', {
         sid: _this.socket.id,
         initialized: _this.initialized
@@ -101,19 +102,16 @@ var Channel = /*#__PURE__*/function (_Emitter) {
       logger('Session ID is', _this.socket.id);
       if (data.type === 'initial') {
         if (!_this.initialized) {
-          var measure = (0, _performance.stopMeasure)(_performance.MEASURE_NAME.DOCUMENT_INIT);
-          _this.initExperience.success();
-          (0, _analytics.triggerAnalyticsEvent)({
-            eventAction: _const.EVENT_ACTION.DOCUMENT_INIT,
-            attributes: {
-              eventStatus: _const.EVENT_STATUS.SUCCESS,
-              // TODO: detect when document init fails and fire corresponding event for it
-              latency: measure === null || measure === void 0 ? void 0 : measure.duration,
-              documentAri: _this.config.documentAri,
-              requiredPageRecovery: data === null || data === void 0 ? void 0 : data.requiredPageRecovery,
-              ttlEnabled: data === null || data === void 0 ? void 0 : data.ttlEnabled
-            }
-          }, _this.analyticsClient);
+          var _this$initExperience, _this$analyticsHelper5;
+          var measure = (0, _performance.stopMeasure)(_performance.MEASURE_NAME.DOCUMENT_INIT, _this.analyticsHelper);
+          (_this$initExperience = _this.initExperience) === null || _this$initExperience === void 0 ? void 0 : _this$initExperience.success();
+          (_this$analyticsHelper5 = _this.analyticsHelper) === null || _this$analyticsHelper5 === void 0 ? void 0 : _this$analyticsHelper5.sendActionEvent(_const.EVENT_ACTION.DOCUMENT_INIT,
+          // TODO: detect when document init fails and fire corresponding event for it
+          _const.EVENT_STATUS.SUCCESS, {
+            latency: measure === null || measure === void 0 ? void 0 : measure.duration,
+            resetReason: data === null || data === void 0 ? void 0 : data.resetReason,
+            ttlEnabled: data === null || data === void 0 ? void 0 : data.ttlEnabled
+          });
           var doc = data.doc,
             version = data.version,
             userId = data.userId,
@@ -142,10 +140,17 @@ var Channel = /*#__PURE__*/function (_Emitter) {
         _this.emit('steps:added', data);
       }
     });
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onOnlineHandler", function () {
+      // Force an immediate reconnect, the socket must first be closed to reset reconnection delay logic
+      if (!_this.connected) {
+        var _this$socket2, _this$socket3;
+        (_this$socket2 = _this.socket) === null || _this$socket2 === void 0 ? void 0 : _this$socket2.close();
+        (_this$socket3 = _this.socket) === null || _this$socket3 === void 0 ? void 0 : _this$socket3.connect();
+      }
+    });
     _this.config = config;
-    if (config.analyticsClient) {
-      _this.analyticsClient = config.analyticsClient;
-    }
+    _this.analyticsHelper = analyticsHelper;
+    _this.initExperience = (0, _ufo.createDocInitExp)(_this.analyticsHelper);
     return _this;
   }
 
@@ -158,10 +163,11 @@ var Channel = /*#__PURE__*/function (_Emitter) {
      */
     function connect() {
       var _this2 = this;
-      (0, _performance.startMeasure)(_performance.MEASURE_NAME.SOCKET_CONNECT);
+      (0, _performance.startMeasure)(_performance.MEASURE_NAME.SOCKET_CONNECT, this.analyticsHelper);
       if (!this.initialized) {
-        (0, _performance.startMeasure)(_performance.MEASURE_NAME.DOCUMENT_INIT);
-        this.initExperience.start();
+        var _this$initExperience2;
+        (0, _performance.startMeasure)(_performance.MEASURE_NAME.DOCUMENT_INIT, this.analyticsHelper);
+        (_this$initExperience2 = this.initExperience) === null || _this$initExperience2 === void 0 ? void 0 : _this$initExperience2.start();
       }
       var _this$config = this.config,
         documentAri = _this$config.documentAri,
@@ -237,6 +243,7 @@ var Channel = /*#__PURE__*/function (_Emitter) {
       });
       this.socket.on('disconnect', /*#__PURE__*/function () {
         var _ref2 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee(reason) {
+          var _this2$analyticsHelpe;
           return _regenerator.default.wrap(function _callee$(_context) {
             while (1) {
               switch (_context.prev = _context.next) {
@@ -248,7 +255,18 @@ var Channel = /*#__PURE__*/function (_Emitter) {
                   });
                   if (reason === 'io server disconnect' && _this2.socket) {
                     // The disconnection was initiated by the server, we need to reconnect manually.
-                    _this2.socket.connect();
+                    try {
+                      _this2.socket.connect();
+                    } catch (error) {
+                      (_this2$analyticsHelpe = _this2.analyticsHelper) === null || _this2$analyticsHelpe === void 0 ? void 0 : _this2$analyticsHelpe.sendErrorEvent(error, 'Error while reconnecting the channel');
+                      _this2.emit('error', {
+                        message: 'Caught error during reconnection.',
+                        data: {
+                          status: 500,
+                          code: 'RECONNECTION_ERROR'
+                        }
+                      });
+                    }
                   }
                 case 4:
                 case "end":
@@ -262,14 +280,26 @@ var Channel = /*#__PURE__*/function (_Emitter) {
         };
       }());
 
-      // Socket error, including errors from `packetMiddleware`, `controllers` and `onconnect` and more. Paramter is a plain JSON object.
+      // Socket error, including errors from `packetMiddleware`, `controllers` and `onconnect` and more. Parameter is a plain JSON object.
       this.socket.on('error', function (error) {
         _this2.emit('error', error);
       });
 
-      // `connect_error`'s paramter type is `Error`.
+      // `connect_error`'s parameter type is `Error`.
       // Ensure the error emit to the provider has the same structure, so we can handle them unified.
       this.socket.on('connect_error', this.onConnectError);
+
+      // To trigger reconnection when browser comes back online
+      if (!this.network) {
+        this.network = new _network.default({
+          onlineCallback: this.onOnlineHandler
+        });
+      }
+
+      // Helper class to track reconnection issues, to emit an error if too many failed reconnection attempts happen
+      this.reconnectHelper = new _reconnectHelper.default();
+      // Fired upon a reconnection attempt error (from Socket.IO Manager)
+      this.socket.io.on('reconnect_error', this.onReconnectError);
     }
   }, {
     key: "fetchCatchup",
@@ -380,7 +410,7 @@ var Channel = /*#__PURE__*/function (_Emitter) {
                   }
                 };
                 this.emit('error', errorCatchup);
-                return _context2.abrupt("return", {});
+                throw _context2.t19;
               case 52:
               case "end":
                 return _context2.stop();
@@ -425,10 +455,15 @@ var Channel = /*#__PURE__*/function (_Emitter) {
   }, {
     key: "disconnect",
     value: function disconnect() {
+      var _this$network;
       this.unsubscribeAll();
+      (_this$network = this.network) === null || _this$network === void 0 ? void 0 : _this$network.destroy();
+      this.network = null;
       if (this.socket) {
+        var _this$reconnectHelper3;
         this.socket.close();
         this.socket = null;
+        (_this$reconnectHelper3 = this.reconnectHelper) === null || _this$reconnectHelper3 === void 0 ? void 0 : _this$reconnectHelper3.destroy();
       }
     }
   }]);

package/dist/cjs/connectivity/network.js

@@ -0,0 +1,53 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.NetworkStatus = void 0;
+var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
+var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var NetworkStatus;
+exports.NetworkStatus = NetworkStatus;
+(function (NetworkStatus) {
+  NetworkStatus["ONLINE"] = "ONLINE";
+  NetworkStatus["OFFLINE"] = "OFFLINE";
+})(NetworkStatus || (exports.NetworkStatus = NetworkStatus = {}));
+var Network = /*#__PURE__*/function () {
+  function Network(props) {
+    var _this = this;
+    (0, _classCallCheck2.default)(this, Network);
+    (0, _defineProperty2.default)(this, "offlineHandler", function () {
+      _this.status = NetworkStatus.OFFLINE;
+    });
+    (0, _defineProperty2.default)(this, "onlineHandler", function () {
+      _this.status = NetworkStatus.ONLINE;
+      if (_this.onlineCallback) {
+        _this.onlineCallback();
+      }
+    });
+    if (props !== null && props !== void 0 && props.initialStatus) {
+      this.status = props.initialStatus;
+    }
+    if (props !== null && props !== void 0 && props.onlineCallback) {
+      this.onlineCallback = props.onlineCallback;
+    }
+    window.addEventListener('offline', this.offlineHandler);
+    window.addEventListener('online', this.onlineHandler);
+  }
+  (0, _createClass2.default)(Network, [{
+    key: "getStatus",
+    value: function getStatus() {
+      return this.status || null;
+    }
+  }, {
+    key: "destroy",
+    value: function destroy() {
+      window.removeEventListener('offline', this.offlineHandler);
+      window.removeEventListener('online', this.onlineHandler);
+    }
+  }]);
+  return Network;
+}();
+exports.default = Network;

package/dist/cjs/connectivity/reconnect-helper.js

@@ -0,0 +1,48 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
+var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _network = require("./network");
+var _singleton = require("./singleton");
+// Calculation for max 8 offline reconnect attempts, with reconnection delay 200ms, randomization factor 0.5, reconnection delay max 128s
+// Min: 800ms, Avg: 51s, Max: 6m
+var FAILED_RECONNECTS_WHILE_OFFLINE_THRESHOLD = 8;
+var ReconnectHelper = /*#__PURE__*/function () {
+  function ReconnectHelper() {
+    var _this = this;
+    (0, _classCallCheck2.default)(this, ReconnectHelper);
+    (0, _defineProperty2.default)(this, "failedReconnectCount", 0);
+    (0, _defineProperty2.default)(this, "onlineHandler", function () {
+      _this.failedReconnectCount = 0;
+    });
+    window.addEventListener('online', this.onlineHandler);
+  }
+  (0, _createClass2.default)(ReconnectHelper, [{
+    key: "countReconnectError",
+    value: function countReconnectError() {
+      // Only count the reconnection attempts when offline
+      if (_singleton.network.getStatus() === _network.NetworkStatus.OFFLINE) {
+        this.failedReconnectCount++;
+      }
+    }
+  }, {
+    key: "isLikelyNetworkIssue",
+    value: function isLikelyNetworkIssue() {
+      var isLikelyNetworkIssue = this.failedReconnectCount >= FAILED_RECONNECTS_WHILE_OFFLINE_THRESHOLD;
+      return isLikelyNetworkIssue;
+    }
+  }, {
+    key: "destroy",
+    value: function destroy() {
+      window.removeEventListener('online', this.onlineHandler);
+    }
+  }]);
+  return ReconnectHelper;
+}();
+exports.default = ReconnectHelper;

package/dist/cjs/connectivity/singleton.js

@@ -0,0 +1,15 @@
+"use strict";
+
+var _typeof = require("@babel/runtime/helpers/typeof");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.network = void 0;
+var _network = _interopRequireWildcard(require("./network"));
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+// Assume the connection is established at first
+var network = new _network.default({
+  initialStatus: _network.NetworkStatus.ONLINE
+});
+exports.network = network;