@atlaskit/insm 0.1.3 → 0.2.0

package/CHANGELOG.md

@@ -1,5 +1,16 @@
 # @atlaskit/insm
 
+## 0.2.0
+
+### Minor Changes
+
+- [`c6c113481c118`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/c6c113481c118) -
+  Updates limited mode to include lcm sizes in decision to engage.
+
+### Patch Changes
+
+- Updated dependencies
+
 ## 0.1.3
 
 ### Patch Changes

package/README.md

@@ -38,6 +38,9 @@ insm.session.startHeavyTask('paste-handler');
 insm.session.endHeavyTask('paste-handler');
 ```
 
+Note: For tracking page initialisation - if you use the special `PageLoad` key, the duration will be
+tracked on the resulting session event.
+
 ### Adding additional information to the session
 
 Additional session information can be added through the `addProperties` api.

package/dist/cjs/insm-period.js

@@ -8,10 +8,10 @@ exports.PeriodTracking = 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 _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 function _createForOfIteratorHelper(r, e) { var t = "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (!t) { if (Array.isArray(r) || (t = _unsupportedIterableToArray(r)) || e && r && "number" == typeof r.length) { t && (r = t); var _n = 0, F = function F() {}; return { s: F, n: function n() { return _n >= r.length ? { done: !0 } : { done: !1, value: r[_n++] }; }, e: function e(r) { throw r; }, 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 o, a = !0, u = !1; return { s: function s() { t = t.call(r); }, n: function n() { var r = t.next(); return a = r.done, r; }, e: function e(r) { u = !0, o = r; }, f: function f() { try { a || null == t.return || t.return(); } finally { if (u) throw o; } } }; }
 function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
-function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
-/* eslint-disable @repo/internal/dom-events/no-unsafe-event-listeners */
+function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; } /* eslint-disable @repo/internal/dom-events/no-unsafe-event-listeners */
 var PeriodTracking = exports.PeriodTracking = /*#__PURE__*/function () {
   function PeriodTracking(session) {
     (0, _classCallCheck2.default)(this, PeriodTracking);
@@ -157,6 +157,24 @@ var PeriodTracking = exports.PeriodTracking = /*#__PURE__*/function () {
     key: "endResults",
     get: function get() {
       this.changePeriodAndTrackLast(this.state);
+      if ((0, _platformFeatureFlags.fg)('cc_editor_insm_fix_attributes')) {
+        return {
+          active: {
+            features: Array.from(this.periodMeasurements.active.features),
+            heavyTasks: Array.from(this.periodMeasurements.active.heavyTasks),
+            measurements: this.periodMeasurements.active.measurements,
+            duration: this.periodMeasurements.active.duration,
+            count: this.periodMeasurements.active.count
+          },
+          inactive: {
+            features: Array.from(this.periodMeasurements.inactive.features),
+            heavyTasks: Array.from(this.periodMeasurements.inactive.heavyTasks),
+            measurements: this.periodMeasurements.inactive.measurements,
+            duration: this.periodMeasurements.inactive.duration,
+            count: this.periodMeasurements.inactive.count
+          }
+        };
+      }
       return this.periodMeasurements;
     }
   }, {

package/dist/cjs/insm-session.js

@@ -21,11 +21,14 @@ function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length)
  * Only intended for internal use.
  *
  * Exported for consumers who may require the type.
+ *
+ * Note: Events are not reliably fired from mobile browsers (ie. when a browser is closed when not in use)
  */
 var INSMSession = exports.INSMSession = /*#__PURE__*/function () {
   function INSMSession(experienceKey, experienceProperties, insm) {
     (0, _classCallCheck2.default)(this, INSMSession);
     (0, _defineProperty2.default)(this, "startedAt", performance.now());
+    (0, _defineProperty2.default)(this, "pageLoadTime", null);
     (0, _defineProperty2.default)(this, "running", true);
     (0, _defineProperty2.default)(this, "addedProperties", []);
     (0, _defineProperty2.default)(this, "runningFeatures", new Set());
@@ -39,12 +42,18 @@ var INSMSession = exports.INSMSession = /*#__PURE__*/function () {
       insmSession: this,
       reportingThreshold: 500
     });
-
-    /**
-     * Note: Events are not reliably fired from mobile browsers (ie. when a browser is closed when not in use)
-     */
   }
+
+  /**
+   * Completes the page load timing. This is called automatically when ending a heavy task
+   * with the key 'PageLoad'.
+   */
   return (0, _createClass2.default)(INSMSession, [{
+    key: "completePageLoad",
+    value: function completePageLoad() {
+      this.pageLoadTime = performance.now() - this.startedAt;
+    }
+  }, {
     key: "updateExperienceKey",
     value: function updateExperienceKey(experienceKey) {
       this.experienceKey = experienceKey;
@@ -144,7 +153,7 @@ var INSMSession = exports.INSMSession = /*#__PURE__*/function () {
   }, {
     key: "end",
     value: function end(endDetails) {
-      var _this$insm$analyticsW;
+      var _periodResults$active, _periodResults$active2, _periodResults$active3, _periodResults$active4, _this$insm$analyticsW;
       if (this.running === false) {
         // If an experience has already been ended -- don't repeat the ending
         return;
@@ -177,19 +186,27 @@ var INSMSession = exports.INSMSession = /*#__PURE__*/function () {
       var operationalEvent = {
         actionSubject: 'insm',
         action: 'measured',
-        attributes: _objectSpread(_objectSpread({}, evaluatedAddedProperties), {}, {
+        attributes: _objectSpread(_objectSpread(_objectSpread({}, evaluatedAddedProperties), {}, {
           experienceKey: this.experienceKey,
           initial: this.experienceProperties.initial,
           contentId: this.experienceProperties.contentId,
           timing: {
             startedAt: this.startedAt,
+            // Note: this will not match up with the periods sum of durations, as it includes
+            // time paused when heavy tasks were running, and/or the page is in the background.
             duration: duration
           },
           periods: periodResults,
-          endDetails: endDetails,
-          longAnimationFrames: this.longAnimationFrameMeasurer.current
+          endDetails: endDetails
+        }, (0, _expValEquals.expValEquals)('cc_editor_insm_outlier_events', 'cohort', 'test') ? {
+          longScripts: this.longAnimationFrameMeasurer.current,
+          pageLoadTime: this.pageLoadTime,
+          deviceDetails: getDeviceDetails()
+        } : {}), {}, {
+          // these health attributes drive our SLOs
+          healthAFPS: (_periodResults$active = periodResults.active.measurements.afps) !== null && _periodResults$active !== void 0 && _periodResults$active.average ? ((_periodResults$active2 = periodResults.active.measurements.afps) === null || _periodResults$active2 === void 0 ? void 0 : _periodResults$active2.average) >= 50 : undefined,
+          healthINP: (_periodResults$active3 = periodResults.active.measurements.inp) !== null && _periodResults$active3 !== void 0 && _periodResults$active3.average ? ((_periodResults$active4 = periodResults.active.measurements.inp) === null || _periodResults$active4 === void 0 ? void 0 : _periodResults$active4.average) >= 200 : undefined
         }),
-        deviceDetails: (0, _expValEquals.expValEquals)('cc_editor_interactivity_monitoring', 'isEnabled', true) ? getDeviceDetails() : undefined,
         highPriority: true,
         tags: ['editor'],
         source: 'unknown'

package/dist/cjs/insm.js

@@ -11,6 +11,7 @@ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/de
 var _insmSession = require("./insm-session");
 var _afps = require("./period-measurers/afps");
 var _inp = require("./inp-measurers/inp");
+var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
 var INSM = exports.INSM = /*#__PURE__*/function () {
   function INSM(options) {
     var _this = this;
@@ -53,15 +54,18 @@ var INSM = exports.INSM = /*#__PURE__*/function () {
    * Starts a heavy task in the currently running session.
    *
    * This also pauses measurement.
+   *
+   * For PageLoads using the key 'PageLoad' will mean the heavy task duration
+   * is added to the insm session event as pageLoadTime.
    */
   return (0, _createClass2.default)(INSM, [{
     key: "startHeavyTask",
     value: function startHeavyTask(heavyTaskName) {
-      var _this$runningSession2, _this$runningSession3, _this$session;
+      var _this$runningSession2, _this$runningSession3, _this$runningSession4;
       this.runningHeavyTasks.add(heavyTaskName);
       (_this$runningSession2 = this.runningSession) === null || _this$runningSession2 === void 0 || (_this$runningSession2 = _this$runningSession2.periodTracking) === null || _this$runningSession2 === void 0 || _this$runningSession2.startHeavyTask(heavyTaskName);
       (_this$runningSession3 = this.runningSession) === null || _this$runningSession3 === void 0 || _this$runningSession3.periodTracking.pause(heavyTaskName);
-      (_this$session = this.session) === null || _this$session === void 0 || _this$session.longAnimationFrameMeasurer.pause();
+      (_this$runningSession4 = this.runningSession) === null || _this$runningSession4 === void 0 || _this$runningSession4.longAnimationFrameMeasurer.pause();
     }
 
     /**
@@ -70,12 +74,18 @@ var INSM = exports.INSM = /*#__PURE__*/function () {
   }, {
     key: "endHeavyTask",
     value: function endHeavyTask(heavyTaskName) {
-      var _this$runningSession4;
+      var _this$runningSession5;
       this.runningHeavyTasks.delete(heavyTaskName);
-      (_this$runningSession4 = this.runningSession) === null || _this$runningSession4 === void 0 || _this$runningSession4.periodTracking.resume(heavyTaskName);
+      (_this$runningSession5 = this.runningSession) === null || _this$runningSession5 === void 0 || _this$runningSession5.periodTracking.resume(heavyTaskName);
       if (this.runningHeavyTasks.size === 0) {
-        var _this$session2;
-        (_this$session2 = this.session) === null || _this$session2 === void 0 || _this$session2.longAnimationFrameMeasurer.resume();
+        var _this$runningSession6;
+        (_this$runningSession6 = this.runningSession) === null || _this$runningSession6 === void 0 || _this$runningSession6.longAnimationFrameMeasurer.resume();
+      }
+      if ((0, _expValEquals.expValEquals)('cc_editor_insm_outlier_events', 'cohort', 'test')) {
+        if (heavyTaskName === 'PageLoad') {
+          var _this$runningSession7;
+          (_this$runningSession7 = this.runningSession) === null || _this$runningSession7 === void 0 || _this$runningSession7.completePageLoad();
+        }
       }
     }
 
@@ -83,15 +93,19 @@ var INSM = exports.INSM = /*#__PURE__*/function () {
      * Call this when starting a new experience.  This is expected to be wired to the product
      * routing solution.
      *
-     * It's expected this call will be paired with a `insm.session.startHeavyTask('page-load')` and subsequent `insm.session.endHeavyTask('page-load')`
-     * so that performance degradations linked to the page initialisation are excluded from the active interactivity monitoring.
+     * It's expected this call will be paired with a `insm.session.startHeavyTask('PageLoad')` and
+     * subsequent `insm.session.endHeavyTask('PageLoad')` so that performance degradations linked
+     * to the page initialisation are excluded from the active interactivity monitoring.
+     *
+     * Using the key 'PageLoad' is special and will result in the heavy task duration being added to the
+     * insm session event as pageLoadTime.
      *
      *
      * ```ts
      * insm.start('edit-page', { initial: true, contentId: '9001' })
-     * insm.session.startHeavyTask(''page-load')
+     * insm.session.startHeavyTask('PageLoad')
      * // ... heavy initialisation work
-     * insm.session.endHeavyTask(''page-load')
+     * insm.session.endHeavyTask('PageLoad')
      * ```
      */
   }, {
@@ -138,8 +152,8 @@ var INSM = exports.INSM = /*#__PURE__*/function () {
   }, {
     key: "stopEarly",
     value: function stopEarly(reasonKey, description) {
-      var _this$runningSession5;
-      (_this$runningSession5 = this.runningSession) === null || _this$runningSession5 === void 0 || _this$runningSession5.earlyStop(reasonKey, description);
+      var _this$runningSession8;
+      (_this$runningSession8 = this.runningSession) === null || _this$runningSession8 === void 0 || _this$runningSession8.earlyStop(reasonKey, description);
     }
 
     /**

package/dist/cjs/session-measurers/LongAnimationFrameMeasurer.js

@@ -8,11 +8,15 @@ exports.LongAnimationFrameMeasurer = 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"));
+function _createForOfIteratorHelper(r, e) { var t = "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (!t) { if (Array.isArray(r) || (t = _unsupportedIterableToArray(r)) || e && r && "number" == typeof r.length) { t && (r = t); var _n = 0, F = function F() {}; return { s: F, n: function n() { return _n >= r.length ? { done: !0 } : { done: !1, value: r[_n++] }; }, e: function e(r) { throw r; }, 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 o, a = !0, u = !1; return { s: function s() { t = t.call(r); }, n: function n() { var r = t.next(); return a = r.done, r; }, e: function e(r) { u = !0, o = r; }, f: function f() { try { a || null == t.return || t.return(); } finally { if (u) throw o; } } }; }
+function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
+function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
+// Script timing data we want to track
 var LongAnimationFrameMeasurer = exports.LongAnimationFrameMeasurer = /*#__PURE__*/function () {
   function LongAnimationFrameMeasurer(options) {
     var _this = this;
     (0, _classCallCheck2.default)(this, LongAnimationFrameMeasurer);
-    (0, _defineProperty2.default)(this, "longestAnimationFrames", []);
+    (0, _defineProperty2.default)(this, "longestScriptTimings", []);
     (0, _defineProperty2.default)(this, "minimumIndex", -1);
     (0, _defineProperty2.default)(this, "minimumDuration", Infinity);
     this.options = options;
@@ -33,48 +37,85 @@ var LongAnimationFrameMeasurer = exports.LongAnimationFrameMeasurer = /*#__PURE_
   return (0, _createClass2.default)(LongAnimationFrameMeasurer, [{
     key: "handleBatch",
     value: function handleBatch(batch) {
-      var len = this.longestAnimationFrames.length;
       for (var batchIndex = 0; batchIndex < batch.length; batchIndex++) {
-        if (batch[batchIndex].duration < this.options.reportingThreshold) {
-          // If the long frame entry had a duration less than the reporting
-          // threshold it's not eligible for tracking
+        var animationFrame = batch[batchIndex];
+
+        // Only process frames that exceed the reporting threshold
+        if (animationFrame.duration < this.options.reportingThreshold) {
           continue;
         }
-        var longAnimationFrameEntry = Object.assign(batch[batchIndex], {
-          runningFeatures: Array.from(this.options.insmSession.runningFeatures)
-        });
 
-        // Not yet at capacity: append and update min tracking incrementally
-        if (len < this.options.limit) {
-          this.longestAnimationFrames[len] = longAnimationFrameEntry;
-          if (len === 0 || longAnimationFrameEntry.duration < this.minimumDuration) {
-            this.minimumDuration = longAnimationFrameEntry.duration;
-            this.minimumIndex = len;
+        // Process all scripts in this long animation frame
+        if (animationFrame.scripts && animationFrame.scripts.length > 0) {
+          var _iterator = _createForOfIteratorHelper(animationFrame.scripts),
+            _step;
+          try {
+            for (_iterator.s(); !(_step = _iterator.n()).done;) {
+              var script = _step.value;
+              this.processScript(script, animationFrame);
+            }
+          } catch (err) {
+            _iterator.e(err);
+          } finally {
+            _iterator.f();
           }
-          len++;
-          continue;
         }
+      }
+    }
+  }, {
+    key: "createScriptTiming",
+    value: function createScriptTiming(script, animationFrame) {
+      return {
+        duration: script.duration,
+        forcedStyleAndLayoutDuration: script.forcedStyleAndLayoutDuration,
+        invoker: script.invoker,
+        invokerType: script.invokerType,
+        sourceCharPosition: script.sourceCharPosition,
+        sourceFunctionName: script.sourceFunctionName,
+        sourceURL: script.sourceURL,
+        features: Array.from(this.options.insmSession.runningFeatures),
+        afDuration: animationFrame.duration
+      };
+    }
+  }, {
+    key: "processScript",
+    value: function processScript(script, animationFrame) {
+      var scriptDuration = script.duration;
+      var len = this.longestScriptTimings.length;
 
-        // At capacity: only do work if we beat the current min
-        if (longAnimationFrameEntry.duration <= this.minimumDuration) {
-          continue;
+      // Not yet at capacity: append and update min tracking incrementally
+      if (len < this.options.limit) {
+        var _scriptTiming = this.createScriptTiming(script, animationFrame);
+        this.longestScriptTimings[len] = _scriptTiming;
+        if (len === 0 || scriptDuration < this.minimumDuration) {
+          this.minimumDuration = scriptDuration;
+          this.minimumIndex = len;
         }
+        return;
+      }
 
-        // Replace the current min
-        this.longestAnimationFrames[this.minimumIndex] = longAnimationFrameEntry;
-        var _possiblyNewMinimumIndex = 0;
-        var _possibleNewMinimumDuration = this.longestAnimationFrames[0].duration;
-        for (var i = 1; i < this.options.limit; i++) {
-          if (this.longestAnimationFrames[i].duration < _possibleNewMinimumDuration) {
-            _possiblyNewMinimumIndex = i;
-            _possibleNewMinimumDuration = this.longestAnimationFrames[i].duration;
-          }
-        }
+      // At capacity: only do work if we beat the current min
+      if (scriptDuration <= this.minimumDuration) {
+        return;
+      }
+      var scriptTiming = this.createScriptTiming(script, animationFrame);
 
-        // Update the min tracking
-        this.minimumIndex = _possiblyNewMinimumIndex;
-        this.minimumDuration = _possibleNewMinimumDuration;
+      // Replace the current min
+      this.longestScriptTimings[this.minimumIndex] = scriptTiming;
+
+      // Find new minimum
+      var newMinimumIndex = 0;
+      var newMinimumDuration = this.longestScriptTimings[0].duration;
+      for (var i = 1; i < this.options.limit; i++) {
+        if (this.longestScriptTimings[i].duration < newMinimumDuration) {
+          newMinimumIndex = i;
+          newMinimumDuration = this.longestScriptTimings[i].duration;
+        }
       }
+
+      // Update the min tracking
+      this.minimumIndex = newMinimumIndex;
+      this.minimumDuration = newMinimumDuration;
     }
 
     /**
@@ -96,12 +137,12 @@ var LongAnimationFrameMeasurer = exports.LongAnimationFrameMeasurer = /*#__PURE_
     }
 
     /**
-     * Returns the current tracked longest animation frames sorted by duration
+     * Returns the current tracked longest script timings sorted by duration
      */
   }, {
     key: "current",
     get: function get() {
-      var copy = this.longestAnimationFrames.slice();
+      var copy = this.longestScriptTimings.slice();
       copy.sort(function (a, b) {
         return b.duration - a.duration;
       });
@@ -119,4 +160,5 @@ var LongAnimationFrameMeasurer = exports.LongAnimationFrameMeasurer = /*#__PURE_
     }
   }]);
 }(); // Based on https://github.com/GoogleChrome/web-vitals/blob/1b872cf5f2159e8ace0e98d55d8eb54fb09adfbe/src/types.ts#L129
+// exported for use in test file
 // Based on https://github.com/GoogleChrome/web-vitals/blob/1b872cf5f2159e8ace0e98d55d8eb54fb09adfbe/src/types.ts#L129

package/dist/es2019/insm-period.js

@@ -1,6 +1,6 @@
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 /* eslint-disable @repo/internal/dom-events/no-unsafe-event-listeners */
-
+import { fg } from '@atlaskit/platform-feature-flags';
 export class PeriodTracking {
   constructor(session) {
     _defineProperty(this, "periodMeasurements", {
@@ -106,6 +106,24 @@ export class PeriodTracking {
   }
   get endResults() {
     this.changePeriodAndTrackLast(this.state);
+    if (fg('cc_editor_insm_fix_attributes')) {
+      return {
+        active: {
+          features: Array.from(this.periodMeasurements.active.features),
+          heavyTasks: Array.from(this.periodMeasurements.active.heavyTasks),
+          measurements: this.periodMeasurements.active.measurements,
+          duration: this.periodMeasurements.active.duration,
+          count: this.periodMeasurements.active.count
+        },
+        inactive: {
+          features: Array.from(this.periodMeasurements.inactive.features),
+          heavyTasks: Array.from(this.periodMeasurements.inactive.heavyTasks),
+          measurements: this.periodMeasurements.inactive.measurements,
+          duration: this.periodMeasurements.inactive.duration,
+          count: this.periodMeasurements.inactive.count
+        }
+      };
+    }
     return this.periodMeasurements;
   }
   setupActiveStartInteractionListeners() {

package/dist/es2019/insm-session.js

@@ -8,10 +8,13 @@ import { LongAnimationFrameMeasurer } from './session-measurers/LongAnimationFra
  * Only intended for internal use.
  *
  * Exported for consumers who may require the type.
+ *
+ * Note: Events are not reliably fired from mobile browsers (ie. when a browser is closed when not in use)
  */
 export class INSMSession {
   constructor(experienceKey, experienceProperties, insm) {
     _defineProperty(this, "startedAt", performance.now());
+    _defineProperty(this, "pageLoadTime", null);
     _defineProperty(this, "running", true);
     _defineProperty(this, "addedProperties", []);
     _defineProperty(this, "runningFeatures", new Set());
@@ -25,10 +28,14 @@ export class INSMSession {
       insmSession: this,
       reportingThreshold: 500
     });
+  }
 
-    /**
-     * Note: Events are not reliably fired from mobile browsers (ie. when a browser is closed when not in use)
-     */
+  /**
+   * Completes the page load timing. This is called automatically when ending a heavy task
+   * with the key 'PageLoad'.
+   */
+  completePageLoad() {
+    this.pageLoadTime = performance.now() - this.startedAt;
   }
   updateExperienceKey(experienceKey) {
     this.experienceKey = experienceKey;
@@ -116,7 +123,7 @@ export class INSMSession {
     });
   }
   end(endDetails) {
-    var _this$insm$analyticsW;
+    var _periodResults$active, _periodResults$active2, _periodResults$active3, _periodResults$active4, _this$insm$analyticsW;
     if (this.running === false) {
       // If an experience has already been ended -- don't repeat the ending
       return;
@@ -148,13 +155,21 @@ export class INSMSession {
         contentId: this.experienceProperties.contentId,
         timing: {
           startedAt: this.startedAt,
+          // Note: this will not match up with the periods sum of durations, as it includes
+          // time paused when heavy tasks were running, and/or the page is in the background.
           duration
         },
         periods: periodResults,
         endDetails: endDetails,
-        longAnimationFrames: this.longAnimationFrameMeasurer.current
+        ...(expValEquals('cc_editor_insm_outlier_events', 'cohort', 'test') ? {
+          longScripts: this.longAnimationFrameMeasurer.current,
+          pageLoadTime: this.pageLoadTime,
+          deviceDetails: getDeviceDetails()
+        } : {}),
+        // these health attributes drive our SLOs
+        healthAFPS: (_periodResults$active = periodResults.active.measurements.afps) !== null && _periodResults$active !== void 0 && _periodResults$active.average ? ((_periodResults$active2 = periodResults.active.measurements.afps) === null || _periodResults$active2 === void 0 ? void 0 : _periodResults$active2.average) >= 50 : undefined,
+        healthINP: (_periodResults$active3 = periodResults.active.measurements.inp) !== null && _periodResults$active3 !== void 0 && _periodResults$active3.average ? ((_periodResults$active4 = periodResults.active.measurements.inp) === null || _periodResults$active4 === void 0 ? void 0 : _periodResults$active4.average) >= 200 : undefined
       },
-      deviceDetails: expValEquals('cc_editor_interactivity_monitoring', 'isEnabled', true) ? getDeviceDetails() : undefined,
       highPriority: true,
       tags: ['editor'],
       source: 'unknown'

package/dist/es2019/insm.js

@@ -2,6 +2,7 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import { INSMSession } from './insm-session';
 import { AnimationFPSIM } from './period-measurers/afps';
 import { INPTracker } from './inp-measurers/inp';
+import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
 export class INSM {
   constructor(options) {
     /**
@@ -40,25 +41,34 @@ export class INSM {
    * Starts a heavy task in the currently running session.
    *
    * This also pauses measurement.
+   *
+   * For PageLoads using the key 'PageLoad' will mean the heavy task duration
+   * is added to the insm session event as pageLoadTime.
    */
   startHeavyTask(heavyTaskName) {
-    var _this$runningSession2, _this$runningSession3, _this$runningSession4, _this$session;
+    var _this$runningSession2, _this$runningSession3, _this$runningSession4, _this$runningSession5;
     this.runningHeavyTasks.add(heavyTaskName);
     (_this$runningSession2 = this.runningSession) === null || _this$runningSession2 === void 0 ? void 0 : (_this$runningSession3 = _this$runningSession2.periodTracking) === null || _this$runningSession3 === void 0 ? void 0 : _this$runningSession3.startHeavyTask(heavyTaskName);
     (_this$runningSession4 = this.runningSession) === null || _this$runningSession4 === void 0 ? void 0 : _this$runningSession4.periodTracking.pause(heavyTaskName);
-    (_this$session = this.session) === null || _this$session === void 0 ? void 0 : _this$session.longAnimationFrameMeasurer.pause();
+    (_this$runningSession5 = this.runningSession) === null || _this$runningSession5 === void 0 ? void 0 : _this$runningSession5.longAnimationFrameMeasurer.pause();
   }
 
   /**
    * Ends a heavy task in the currently running session
    */
   endHeavyTask(heavyTaskName) {
-    var _this$runningSession5;
+    var _this$runningSession6;
     this.runningHeavyTasks.delete(heavyTaskName);
-    (_this$runningSession5 = this.runningSession) === null || _this$runningSession5 === void 0 ? void 0 : _this$runningSession5.periodTracking.resume(heavyTaskName);
+    (_this$runningSession6 = this.runningSession) === null || _this$runningSession6 === void 0 ? void 0 : _this$runningSession6.periodTracking.resume(heavyTaskName);
     if (this.runningHeavyTasks.size === 0) {
-      var _this$session2;
-      (_this$session2 = this.session) === null || _this$session2 === void 0 ? void 0 : _this$session2.longAnimationFrameMeasurer.resume();
+      var _this$runningSession7;
+      (_this$runningSession7 = this.runningSession) === null || _this$runningSession7 === void 0 ? void 0 : _this$runningSession7.longAnimationFrameMeasurer.resume();
+    }
+    if (expValEquals('cc_editor_insm_outlier_events', 'cohort', 'test')) {
+      if (heavyTaskName === 'PageLoad') {
+        var _this$runningSession8;
+        (_this$runningSession8 = this.runningSession) === null || _this$runningSession8 === void 0 ? void 0 : _this$runningSession8.completePageLoad();
+      }
     }
   }
 
@@ -66,15 +76,19 @@ export class INSM {
    * Call this when starting a new experience.  This is expected to be wired to the product
    * routing solution.
    *
-   * It's expected this call will be paired with a `insm.session.startHeavyTask('page-load')` and subsequent `insm.session.endHeavyTask('page-load')`
-   * so that performance degradations linked to the page initialisation are excluded from the active interactivity monitoring.
+   * It's expected this call will be paired with a `insm.session.startHeavyTask('PageLoad')` and
+   * subsequent `insm.session.endHeavyTask('PageLoad')` so that performance degradations linked
+   * to the page initialisation are excluded from the active interactivity monitoring.
+   *
+   * Using the key 'PageLoad' is special and will result in the heavy task duration being added to the
+   * insm session event as pageLoadTime.
    *
    *
    * ```ts
    * insm.start('edit-page', { initial: true, contentId: '9001' })
-   * insm.session.startHeavyTask(''page-load')
+   * insm.session.startHeavyTask('PageLoad')
    * // ... heavy initialisation work
-   * insm.session.endHeavyTask(''page-load')
+   * insm.session.endHeavyTask('PageLoad')
    * ```
    */
   start(experienceKey, experienceProperties) {
@@ -114,8 +128,8 @@ export class INSM {
    * scenarios such as when error boundaries are hit.
    */
   stopEarly(reasonKey, description) {
-    var _this$runningSession6;
-    (_this$runningSession6 = this.runningSession) === null || _this$runningSession6 === void 0 ? void 0 : _this$runningSession6.earlyStop(reasonKey, description);
+    var _this$runningSession9;
+    (_this$runningSession9 = this.runningSession) === null || _this$runningSession9 === void 0 ? void 0 : _this$runningSession9.earlyStop(reasonKey, description);
   }
 
   /**