@atlaskit/react-ufo 4.7.0 → 4.7.1

package/CHANGELOG.md

@@ -1,5 +1,12 @@
 # @atlaskit/ufo-interaction-ignore
 
+## 4.7.1
+
+### Patch Changes
+
+- [`8f8b18e77c187`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/8f8b18e77c187) -
+  Add more timings info into interaction-extra-metrics
+
 ## 4.7.0
 
 ### Minor Changes

package/dist/cjs/create-interaction-extra-metrics-payload/index.js

@@ -7,17 +7,28 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
 var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
 var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _coinflip = _interopRequireDefault(require("../coinflip"));
 var _config = require("../config");
-var _createPayload = require("../create-payload");
 var _utils = require("../create-payload/common/utils");
+var _getMoreAccuratePageVisibilityUpToTtai = require("../create-payload/utils/get-more-accurate-page-visibility-up-to-ttai");
 var _getPageVisibilityUpToTtai = _interopRequireDefault(require("../create-payload/utils/get-page-visibility-up-to-ttai"));
 var _getPayloadSize = _interopRequireDefault(require("../create-payload/utils/get-payload-size"));
 var _getReactUfoPayloadVersion = require("../create-payload/utils/get-react-ufo-payload-version");
 var _getTtai = _interopRequireDefault(require("../create-payload/utils/get-ttai"));
 var _getVcMetrics = _interopRequireDefault(require("../create-payload/utils/get-vc-metrics"));
+var _optimizeApdex = require("../create-payload/utils/optimize-apdex");
+var _optimizeCustomTimings = require("../create-payload/utils/optimize-custom-timings");
+var _optimizeHoldInfo = require("../create-payload/utils/optimize-hold-info");
+var _optimizeMarks = require("../create-payload/utils/optimize-marks");
+var _optimizeReactProfilerTimings = require("../create-payload/utils/optimize-react-profiler-timings");
+var _optimizeRequestInfo = require("../create-payload/utils/optimize-request-info");
+var _optimizeSpans = require("../create-payload/utils/optimize-spans");
+var _interactionMetrics = require("../interaction-metrics");
+var _excluded = ["labelStack"];
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 function createInteractionExtraLogPayload(_x, _x2) {
@@ -25,8 +36,8 @@ function createInteractionExtraLogPayload(_x, _x2) {
 }
 function _createInteractionExtraLogPayload() {
   _createInteractionExtraLogPayload = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee(interactionId, interaction) {
-    var _getTTAI, _interaction$hold3pIn, _window$location;
-    var config, end, start, ufoName, rate, type, abortReason, routeName, previousInteractionName, isPreviousInteractionAborted, abortedByInteractionName, knownSegments, sanitisedUfoName, configRate, pageVisibilityAtTTAI, isPageLoad, calculatePageVisibilityFromTheStartOfPageLoad, moreAccuratePageVisibilityAtTTAI, extraTTAI, newUFOName, finalVCMetrics, holdInfo, segments3p, segmentTree, payload;
+    var _getTTAI, _getMostRecentVCRevis, _window$location;
+    var config, end, start, ufoName, rate, type, abortReason, routeName, previousInteractionName, isPreviousInteractionAborted, abortedByInteractionName, knownSegments, sanitisedUfoName, configRate, pageVisibilityAtTTAI, isPageLoad, calculatePageVisibilityFromTheStartOfPageLoad, moreAccuratePageVisibilityAtTTAI, extraTTAI, newUFOName, mostRecentVCRevision, finalVCMetrics, isThirdParty, filteredData, getDetailedInteractionMetrics, segments3p, segmentTree, payload;
     return _regenerator.default.wrap(function _callee$(_context) {
       while (1) switch (_context.prev = _context.next) {
         case 0:
@@ -55,19 +66,71 @@ function _createInteractionExtraLogPayload() {
           return _context.abrupt("return", null);
         case 12:
           calculatePageVisibilityFromTheStartOfPageLoad = config.enableBetterPageVisibilityApi && isPageLoad;
-          moreAccuratePageVisibilityAtTTAI = calculatePageVisibilityFromTheStartOfPageLoad ? (0, _createPayload.getMoreAccuratePageVisibilityUpToTTAI)(interaction) : null;
+          moreAccuratePageVisibilityAtTTAI = calculatePageVisibilityFromTheStartOfPageLoad ? (0, _getMoreAccuratePageVisibilityUpToTtai.getMoreAccuratePageVisibilityUpToTTAI)(interaction) : null;
           extraTTAI = (_getTTAI = (0, _getTtai.default)(interaction)) !== null && _getTTAI !== void 0 ? _getTTAI : undefined;
           newUFOName = (0, _utils.sanitizeUfoName)(ufoName);
-          _context.next = 18;
+          mostRecentVCRevision = (_getMostRecentVCRevis = (0, _config.getMostRecentVCRevision)(newUFOName)) !== null && _getMostRecentVCRevis !== void 0 ? _getMostRecentVCRevis : _config.DEFAULT_TTVC_REVISION;
+          _context.next = 19;
           return (0, _getVcMetrics.default)(interaction, true);
-        case 18:
+        case 19:
           finalVCMetrics = _context.sent;
-          holdInfo = (0, _createPayload.optimizeHoldInfo)((_interaction$hold3pIn = interaction.hold3pInfo) !== null && _interaction$hold3pIn !== void 0 ? _interaction$hold3pIn : [], start, (0, _getReactUfoPayloadVersion.getReactUFOPayloadVersion)(interaction.type));
-          segments3p = !(0, _platformFeatureFlags.fg)('platform_ufo_remove_deprecated_config_fields') && config.killswitchNestedSegments ? [] : knownSegments.filter(function (knownSegment) {
-            return knownSegment.labelStack.some(function (entry) {
+          // Helper function to check if labelStack contains third-party type
+          isThirdParty = function isThirdParty(labelStack) {
+            var _labelStack$some;
+            return (_labelStack$some = labelStack === null || labelStack === void 0 ? void 0 : labelStack.some(function (entry) {
               return 'type' in entry && entry.type === 'third-party';
-            });
-          });
+            })) !== null && _labelStack$some !== void 0 ? _labelStack$some : false;
+          }; // Pre-filter 3p data
+          filteredData = {
+            errors: interaction.errors.filter(function (error) {
+              return isThirdParty(error.labelStack);
+            }),
+            spans: [].concat((0, _toConsumableArray2.default)(interaction.spans), (0, _toConsumableArray2.default)(_interactionMetrics.interactionSpans)).filter(function (span) {
+              return isThirdParty(span.labelStack);
+            }),
+            requestInfo: interaction.requestInfo.filter(function (req) {
+              return isThirdParty(req.labelStack);
+            }),
+            customTimings: interaction.customTimings.filter(function (timing) {
+              return isThirdParty(timing.labelStack);
+            }),
+            apdex: interaction.apdex.filter(function (apdex) {
+              return isThirdParty(apdex.labelStack);
+            }),
+            reactProfilerTimings: interaction.reactProfilerTimings.filter(function (timing) {
+              return isThirdParty(timing.labelStack);
+            }),
+            customData: interaction.customData.filter(function (data) {
+              return isThirdParty(data.labelStack);
+            }),
+            segments: knownSegments.filter(function (segment) {
+              return isThirdParty(segment.labelStack);
+            }),
+            marks: interaction.marks.filter(function (mark) {
+              return isThirdParty(mark.labelStack);
+            })
+          }; // Clear atlaskit spans after filtering
+          _interactionMetrics.interactionSpans.length = 0;
+
+          // Detailed payload
+          getDetailedInteractionMetrics = function getDetailedInteractionMetrics() {
+            var _interaction$hold3pIn;
+            return {
+              errors: filteredData.errors.map(function (_ref) {
+                var labelStack = _ref.labelStack,
+                  others = (0, _objectWithoutProperties2.default)(_ref, _excluded);
+                return _objectSpread(_objectSpread({}, others), {}, {
+                  labelStack: labelStack && (0, _utils.optimizeLabelStack)(labelStack, (0, _getReactUfoPayloadVersion.getReactUFOPayloadVersion)(interaction.type))
+                });
+              }),
+              holdActive: interaction.hold3pActive ? (0, _toConsumableArray2.default)(interaction.hold3pActive.values()) : [],
+              holdInfo: (0, _optimizeHoldInfo.optimizeHoldInfo)((_interaction$hold3pIn = interaction.hold3pInfo) !== null && _interaction$hold3pIn !== void 0 ? _interaction$hold3pIn : [], start, (0, _getReactUfoPayloadVersion.getReactUFOPayloadVersion)(interaction.type)),
+              spans: (0, _optimizeSpans.optimizeSpans)(filteredData.spans, start, (0, _getReactUfoPayloadVersion.getReactUFOPayloadVersion)(interaction.type)),
+              requestInfo: (0, _optimizeRequestInfo.optimizeRequestInfo)(filteredData.requestInfo, start, (0, _getReactUfoPayloadVersion.getReactUFOPayloadVersion)(interaction.type)),
+              customTimings: (0, _optimizeCustomTimings.optimizeCustomTimings)(filteredData.customTimings, start)
+            };
+          };
+          segments3p = !(0, _platformFeatureFlags.fg)('platform_ufo_remove_deprecated_config_fields') && config.killswitchNestedSegments ? [] : filteredData.segments;
           segmentTree = (0, _getReactUfoPayloadVersion.getReactUFOPayloadVersion)(interaction.type) === '2.0.0' ? (0, _utils.buildSegmentTree)(segments3p.map(function (segment) {
             return segment.labelStack;
           })) : {};
@@ -110,15 +173,19 @@ function _createInteractionExtraLogPayload() {
                   start: Math.round(start),
                   'metric:ttai:3p': extraTTAI
                 }, finalVCMetrics), {}, {
-                  holdInfo: holdInfo,
-                  segments: (0, _getReactUfoPayloadVersion.getReactUFOPayloadVersion)(interaction.type) === '2.0.0' ? segmentTree : (0, _utils.getOldSegmentsLabelStack)(segments3p, interaction.type)
-                })
+                  segments: (0, _getReactUfoPayloadVersion.getReactUFOPayloadVersion)(interaction.type) === '2.0.0' ? segmentTree : (0, _utils.getOldSegmentsLabelStack)(segments3p, interaction.type),
+                  marks: (0, _optimizeMarks.optimizeMarks)(filteredData.marks, (0, _getReactUfoPayloadVersion.getReactUFOPayloadVersion)(interaction.type)),
+                  apdex: (0, _optimizeApdex.optimizeApdex)(filteredData.apdex, (0, _getReactUfoPayloadVersion.getReactUFOPayloadVersion)(interaction.type)),
+                  reactProfilerTimings: (0, _optimizeReactProfilerTimings.optimizeReactProfilerTimings)(filteredData.reactProfilerTimings, start, (0, _getReactUfoPayloadVersion.getReactUFOPayloadVersion)(interaction.type)),
+                  customData: filteredData.customData
+                }, getDetailedInteractionMetrics()),
+                'vc:effective:revision': mostRecentVCRevision
               }
             }
           };
           payload.attributes.properties['event:sizeInKb'] = (0, _getPayloadSize.default)(payload.attributes.properties);
           return _context.abrupt("return", payload);
-        case 25:
+        case 29:
         case "end":
           return _context.stop();
       }

package/dist/cjs/create-payload/index.js

@@ -7,11 +7,9 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.createExperimentalMetricsPayload = createExperimentalMetricsPayload;
 exports.createPayloads = createPayloads;
-exports.getMoreAccuratePageVisibilityUpToTTAI = getMoreAccuratePageVisibilityUpToTTAI;
-exports.optimizeHoldInfo = optimizeHoldInfo;
 var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
-var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
 var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
@@ -38,6 +36,7 @@ var _criticalMetricsPayload = require("./critical-metrics-payload");
 var _addPerformanceMeasures = require("./utils/add-performance-measures");
 var _getBrowserMetadata = require("./utils/get-browser-metadata");
 var _getInteractionStatus = _interopRequireDefault(require("./utils/get-interaction-status"));
+var _getMoreAccuratePageVisibilityUpToTtai = require("./utils/get-more-accurate-page-visibility-up-to-ttai");
 var _getNavigationMetrics = require("./utils/get-navigation-metrics");
 var _getPageVisibilityUpToTtai = _interopRequireDefault(require("./utils/get-page-visibility-up-to-ttai"));
 var _getPaintMetrics = require("./utils/get-paint-metrics");
@@ -47,9 +46,15 @@ var _getSsrDoneTimeValue = _interopRequireDefault(require("./utils/get-ssr-done-
 var _getSsrSuccess = _interopRequireDefault(require("./utils/get-ssr-success"));
 var _getTtai = _interopRequireDefault(require("./utils/get-ttai"));
 var _getVcMetrics = _interopRequireDefault(require("./utils/get-vc-metrics"));
-var _excluded = ["labelStack", "time"],
-  _excluded2 = ["stopTime", "labelStack"],
-  _excluded3 = ["labelStack"];
+var _getVisibilityStateFromPerformance = require("./utils/get-visibility-state-from-performance");
+var _optimizeApdex = require("./utils/optimize-apdex");
+var _optimizeCustomTimings = require("./utils/optimize-custom-timings");
+var _optimizeHoldInfo = require("./utils/optimize-hold-info");
+var _optimizeMarks = require("./utils/optimize-marks");
+var _optimizeReactProfilerTimings = require("./utils/optimize-react-profiler-timings");
+var _optimizeRequestInfo = require("./utils/optimize-request-info");
+var _optimizeSpans = require("./utils/optimize-spans");
+var _excluded = ["labelStack"];
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; } // Import common utilities
@@ -99,53 +104,13 @@ function getPageVisibilityUpToTTI(interaction) {
   var bm3EndTimeOrInteractionEndTime = getBm3EndTimeOrFallbackValue(interaction);
   return (0, _hiddenTiming.getPageVisibilityState)(start, bm3EndTimeOrInteractionEndTime);
 }
-function getVisibilityStateFromPerformance(stop) {
-  try {
-    var results = performance.getEntriesByType('visibility-state');
-    if (!results || results.length === 0) {
-      return null;
-    }
-    return results.reduce(function () {
-      var acc = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null;
-      var _ref = arguments.length > 1 ? arguments[1] : undefined,
-        name = _ref.name,
-        startTime = _ref.startTime;
-      if (startTime > stop) {
-        return acc;
-      }
-      if (acc === null && name === null) {
-        return null;
-      }
-      if (acc === null) {
-        return name;
-      }
-      if (acc !== name) {
-        return 'mixed';
-      }
-      return acc;
-    }, null);
-  } catch (e) {
-    return null;
-  }
-}
 function getMoreAccuratePageVisibilityUpToTTI(interaction) {
   var old = getPageVisibilityUpToTTI(interaction);
   var tti = getEarliestLegacyStopTime(interaction, []);
   if (!tti) {
     return old;
   }
-  var buffered = getVisibilityStateFromPerformance(tti);
-  if (!buffered) {
-    return old;
-  }
-  if (buffered !== old) {
-    return 'mixed';
-  }
-  return old;
-}
-function getMoreAccuratePageVisibilityUpToTTAI(interaction) {
-  var old = (0, _getPageVisibilityUpToTtai.default)(interaction);
-  var buffered = getVisibilityStateFromPerformance(interaction.end);
+  var buffered = (0, _getVisibilityStateFromPerformance.getVisibilityStateFromPerformance)(tti);
   if (!buffered) {
     return old;
   }
@@ -256,10 +221,10 @@ function optimizeCustomData(interaction) {
   var customData = interaction.customData,
     cohortingCustomData = interaction.cohortingCustomData,
     legacyMetrics = interaction.legacyMetrics;
-  var customDataMap = customData.reduce(function (result, _ref2) {
+  var customDataMap = customData.reduce(function (result, _ref) {
     var _result$get$data, _result$get;
-    var labelStack = _ref2.labelStack,
-      data = _ref2.data;
+    var labelStack = _ref.labelStack,
+      data = _ref.data;
     var label = (0, _utils.stringifyLabelStackFully)(labelStack);
     var value = (_result$get$data = (_result$get = result.get(label)) === null || _result$get === void 0 ? void 0 : _result$get.data) !== null && _result$get$data !== void 0 ? _result$get$data : {};
     result.set(label, {
@@ -301,48 +266,6 @@ function optimizeCustomData(interaction) {
   }
   return (0, _toConsumableArray2.default)(customDataMap.values());
 }
-function optimizeReactProfilerTimings(reactProfilerTimings, interactionStart, reactUFOVersion) {
-  var reactProfilerTimingsMap = reactProfilerTimings.reduce(function (result, _ref3) {
-    var labelStack = _ref3.labelStack,
-      startTime = _ref3.startTime,
-      commitTime = _ref3.commitTime,
-      actualDuration = _ref3.actualDuration,
-      type = _ref3.type;
-    if (labelStack && startTime >= interactionStart) {
-      var label = (0, _utils.stringifyLabelStackFully)(labelStack);
-      var start = Math.round(startTime);
-      var end = Math.round(commitTime);
-      var timing = result.get(label) || {
-        labelStack: (0, _utils.optimizeLabelStack)(labelStack, reactUFOVersion),
-        startTime: start,
-        endTime: end,
-        mountCount: 0,
-        rerenderCount: 0,
-        renderDuration: 0
-      };
-      if (start < timing.startTime) {
-        timing.startTime = start;
-      }
-      if (end > timing.endTime) {
-        timing.endTime = end;
-      }
-      if (type === 'mount') {
-        timing.mountCount += 1;
-      }
-      if (type === 'update') {
-        timing.rerenderCount += 1;
-      }
-      if (_interactionMetrics.segmentUnmountCache.has(label) && (0, _platformFeatureFlags.fg)('platform_ufo_segment_unmount_count')) {
-        timing.unmountCount = _interactionMetrics.segmentUnmountCache.get(label) || 0;
-        _interactionMetrics.segmentUnmountCache.delete(label);
-      }
-      timing.renderDuration += Math.round(actualDuration);
-      result.set(label, timing);
-    }
-    return result;
-  }, new Map());
-  return (0, _toConsumableArray2.default)(reactProfilerTimingsMap.values());
-}
 function optimizeRedirects(redirects, interactionStart) {
   var lastRedirectTime = interactionStart;
   var updatedRedirects = redirects.sort(function (a, b) {
@@ -364,121 +287,6 @@ function optimizeRedirects(redirects, interactionStart) {
   }, []);
   return updatedRedirects;
 }
-function optimizeHoldInfo(holdInfo, interactionStart, reactUFOVersion) {
-  var holdInfoMap = holdInfo.reduce(function (result, hold) {
-    var labelStack = hold.labelStack,
-      name = hold.name,
-      start = hold.start,
-      end = hold.end,
-      ignoreOnSubmit = hold.ignoreOnSubmit;
-    if (labelStack && !ignoreOnSubmit && start >= interactionStart) {
-      var label = (0, _utils.stringifyLabelStackFully)([].concat((0, _toConsumableArray2.default)(labelStack), [{
-        name: name
-      }]));
-      var startTime = Math.round(start);
-      var endTime = Math.round(end);
-      var timing = result.get(label) || {
-        labelStack: (0, _utils.optimizeLabelStack)([].concat((0, _toConsumableArray2.default)(labelStack), [{
-          name: name
-        }]), reactUFOVersion),
-        startTime: startTime,
-        endTime: endTime
-      };
-      if (startTime < timing.startTime) {
-        timing.startTime = startTime;
-      }
-      if (endTime > timing.endTime) {
-        timing.endTime = endTime;
-      }
-      result.set(label, timing);
-    }
-    return result;
-  }, new Map());
-  return (0, _toConsumableArray2.default)(holdInfoMap.values());
-}
-function optimizeSpans(spans, interactionStart, reactUFOVersion) {
-  var updatedSpans = spans.reduce(function (result, span) {
-    var labelStack = span.labelStack,
-      type = span.type,
-      name = span.name,
-      start = span.start,
-      end = span.end;
-    if (labelStack && start >= interactionStart) {
-      result.push({
-        labelStack: (0, _utils.optimizeLabelStack)([].concat((0, _toConsumableArray2.default)(labelStack), [{
-          name: name
-        }]), reactUFOVersion),
-        startTime: Math.round(start),
-        endTime: Math.round(end),
-        type: type
-      });
-    }
-    return result;
-  }, []);
-  return updatedSpans;
-}
-function optimizeRequestInfo(requestInfo, interactionStart, reactUFOVersion) {
-  var updatedRequestInfo = requestInfo.reduce(function (result, reqInfo) {
-    var labelStack = reqInfo.labelStack,
-      name = reqInfo.name,
-      start = reqInfo.start,
-      end = reqInfo.end,
-      networkStart = reqInfo.networkStart,
-      networkComplete = reqInfo.networkComplete;
-    var startTime = networkStart !== null && networkStart !== void 0 ? networkStart : start;
-    var endTime = networkComplete !== null && networkComplete !== void 0 ? networkComplete : end;
-    if (labelStack && start >= interactionStart && endTime) {
-      result.push({
-        labelStack: (0, _utils.optimizeLabelStack)([].concat((0, _toConsumableArray2.default)(labelStack), [{
-          name: name
-        }]), reactUFOVersion),
-        startTime: Math.round(startTime),
-        endTime: Math.round(endTime)
-      });
-    }
-    return result;
-  }, []);
-  return updatedRequestInfo;
-}
-function optimizeCustomTimings(customTimings, interactionStart) {
-  return customTimings.reduce(function (result, item) {
-    Object.keys(item.data).forEach(function (key) {
-      if (item.data[key].startTime >= interactionStart) {
-        result.push({
-          labelStack: [{
-            n: key
-          }],
-          startTime: Math.round(item.data[key].startTime),
-          endTime: Math.round(item.data[key].endTime)
-        });
-      }
-    });
-    return result;
-  }, []);
-}
-function optimizeMarks(marks, reactUFOVersion) {
-  return marks.map(function (_ref4) {
-    var labelStack = _ref4.labelStack,
-      time = _ref4.time,
-      others = (0, _objectWithoutProperties2.default)(_ref4, _excluded);
-    return _objectSpread(_objectSpread({}, others), {}, {
-      labelStack: labelStack && (0, _utils.optimizeLabelStack)(labelStack, reactUFOVersion),
-      time: Math.round(time)
-    });
-  });
-}
-function optimizeApdex(apdex, reactUFOVersion) {
-  return apdex.map(function (_ref5) {
-    var stopTime = _ref5.stopTime,
-      labelStack = _ref5.labelStack,
-      others = (0, _objectWithoutProperties2.default)(_ref5, _excluded2);
-    return _objectSpread(_objectSpread({}, others), {}, {
-      stopTime: Math.round(stopTime)
-    }, labelStack ? {
-      labelStack: (0, _utils.optimizeLabelStack)(labelStack, reactUFOVersion)
-    } : {});
-  });
-}
 function objectToArray() {
   var obj = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
   return Object.keys(obj).reduce(function (result, key) {
@@ -611,7 +419,7 @@ function _createInteractionMetricsPayload() {
           isPageLoad = type === 'page_load';
           calculatePageVisibilityFromTheStartOfPageLoad = config.enableBetterPageVisibilityApi && isPageLoad;
           moreAccuratePageVisibilityAtTTI = calculatePageVisibilityFromTheStartOfPageLoad ? getMoreAccuratePageVisibilityUpToTTI(interaction) : null;
-          moreAccuratePageVisibilityAtTTAI = calculatePageVisibilityFromTheStartOfPageLoad ? getMoreAccuratePageVisibilityUpToTTAI(interaction) : null;
+          moreAccuratePageVisibilityAtTTAI = calculatePageVisibilityFromTheStartOfPageLoad ? (0, _getMoreAccuratePageVisibilityUpToTtai.getMoreAccuratePageVisibilityUpToTTAI)(interaction) : null;
           labelStack = interaction.labelStack ? {
             labelStack: (0, _utils.optimizeLabelStack)(interaction.labelStack, (0, _getReactUfoPayloadVersion.getReactUFOPayloadVersion)(interaction.type))
           } : {}; // Page Load
@@ -652,19 +460,19 @@ function _createInteractionMetricsPayload() {
             var spans = [].concat((0, _toConsumableArray2.default)(interaction.spans), (0, _toConsumableArray2.default)(_interactionMetrics.interactionSpans));
             _interactionMetrics.interactionSpans.length = 0;
             return {
-              errors: interaction.errors.map(function (_ref6) {
-                var labelStack = _ref6.labelStack,
-                  others = (0, _objectWithoutProperties2.default)(_ref6, _excluded3);
+              errors: interaction.errors.map(function (_ref2) {
+                var labelStack = _ref2.labelStack,
+                  others = (0, _objectWithoutProperties2.default)(_ref2, _excluded);
                 return _objectSpread(_objectSpread({}, others), {}, {
                   labelStack: labelStack && (0, _utils.optimizeLabelStack)(labelStack, (0, _getReactUfoPayloadVersion.getReactUFOPayloadVersion)(interaction.type))
                 });
               }),
               holdActive: (0, _toConsumableArray2.default)(interaction.holdActive.values()),
               redirects: optimizeRedirects(interaction.redirects, start),
-              holdInfo: optimizeHoldInfo(experimental ? interaction.holdExpInfo : interaction.holdInfo, start, (0, _getReactUfoPayloadVersion.getReactUFOPayloadVersion)(interaction.type)),
-              spans: optimizeSpans(spans, start, (0, _getReactUfoPayloadVersion.getReactUFOPayloadVersion)(interaction.type)),
-              requestInfo: optimizeRequestInfo(interaction.requestInfo, start, (0, _getReactUfoPayloadVersion.getReactUFOPayloadVersion)(interaction.type)),
-              customTimings: optimizeCustomTimings(interaction.customTimings, start),
+              holdInfo: (0, _optimizeHoldInfo.optimizeHoldInfo)(experimental ? interaction.holdExpInfo : interaction.holdInfo, start, (0, _getReactUfoPayloadVersion.getReactUFOPayloadVersion)(interaction.type)),
+              spans: (0, _optimizeSpans.optimizeSpans)(spans, start, (0, _getReactUfoPayloadVersion.getReactUFOPayloadVersion)(interaction.type)),
+              requestInfo: (0, _optimizeRequestInfo.optimizeRequestInfo)(interaction.requestInfo, start, (0, _getReactUfoPayloadVersion.getReactUFOPayloadVersion)(interaction.type)),
+              customTimings: (0, _optimizeCustomTimings.optimizeCustomTimings)(interaction.customTimings, start),
               bundleEvalTimings: objectToArray(getBundleEvalTimings(start)),
               resourceTimings: objectToArray(resourceTimings)
             };
@@ -766,13 +574,13 @@ function _createInteractionMetricsPayload() {
                   isPreviousInteractionAborted: isPreviousInteractionAborted,
                   abortedByInteractionName: abortedByInteractionName,
                   // performance
-                  apdex: optimizeApdex(interaction.apdex, (0, _getReactUfoPayloadVersion.getReactUFOPayloadVersion)(interaction.type)),
+                  apdex: (0, _optimizeApdex.optimizeApdex)(interaction.apdex, (0, _getReactUfoPayloadVersion.getReactUFOPayloadVersion)(interaction.type)),
                   end: Math.round(end),
                   start: Math.round(start),
                   segments: (0, _getReactUfoPayloadVersion.getReactUFOPayloadVersion)(interaction.type) === '2.0.0' ? segmentTree : (0, _utils.getOldSegmentsLabelStack)(segments, interaction.type),
-                  marks: optimizeMarks(interaction.marks, (0, _getReactUfoPayloadVersion.getReactUFOPayloadVersion)(interaction.type)),
+                  marks: (0, _optimizeMarks.optimizeMarks)(interaction.marks, (0, _getReactUfoPayloadVersion.getReactUFOPayloadVersion)(interaction.type)),
                   customData: optimizeCustomData(interaction),
-                  reactProfilerTimings: optimizeReactProfilerTimings(interaction.reactProfilerTimings, start, (0, _getReactUfoPayloadVersion.getReactUFOPayloadVersion)(interaction.type))
+                  reactProfilerTimings: (0, _optimizeReactProfilerTimings.optimizeReactProfilerTimings)(interaction.reactProfilerTimings, start, (0, _getReactUfoPayloadVersion.getReactUFOPayloadVersion)(interaction.type))
                 }, responsiveness ? {
                   responsiveness: responsiveness
                 } : {}), labelStack), pageLoadInteractionMetrics), getDetailedInteractionMetrics(resourceTimings)), getPageLoadDetailedInteractionMetrics()), getBm3TrackerTimings(interaction)), {}, {

package/dist/cjs/create-payload/utils/get-more-accurate-page-visibility-up-to-ttai.js

@@ -0,0 +1,20 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.getMoreAccuratePageVisibilityUpToTTAI = getMoreAccuratePageVisibilityUpToTTAI;
+var _getPageVisibilityUpToTtai = _interopRequireDefault(require("./get-page-visibility-up-to-ttai"));
+var _getVisibilityStateFromPerformance = require("./get-visibility-state-from-performance");
+function getMoreAccuratePageVisibilityUpToTTAI(interaction) {
+  var old = (0, _getPageVisibilityUpToTtai.default)(interaction);
+  var buffered = (0, _getVisibilityStateFromPerformance.getVisibilityStateFromPerformance)(interaction.end);
+  if (!buffered) {
+    return old;
+  }
+  if (buffered !== old) {
+    return 'mixed';
+  }
+  return old;
+}

package/dist/cjs/create-payload/utils/get-visibility-state-from-performance.js

@@ -0,0 +1,35 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.getVisibilityStateFromPerformance = getVisibilityStateFromPerformance;
+function getVisibilityStateFromPerformance(stop) {
+  try {
+    var results = performance.getEntriesByType('visibility-state');
+    if (!results || results.length === 0) {
+      return null;
+    }
+    return results.reduce(function () {
+      var acc = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null;
+      var _ref = arguments.length > 1 ? arguments[1] : undefined,
+        name = _ref.name,
+        startTime = _ref.startTime;
+      if (startTime > stop) {
+        return acc;
+      }
+      if (acc === null && name === null) {
+        return null;
+      }
+      if (acc === null) {
+        return name;
+      }
+      if (acc !== name) {
+        return 'mixed';
+      }
+      return acc;
+    }, null);
+  } catch (e) {
+    return null;
+  }
+}

package/dist/cjs/create-payload/utils/optimize-apdex.js

@@ -0,0 +1,25 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.optimizeApdex = optimizeApdex;
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+var _utils = require("../common/utils");
+var _excluded = ["stopTime", "labelStack"];
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function optimizeApdex(apdex, reactUFOVersion) {
+  return apdex.map(function (_ref) {
+    var stopTime = _ref.stopTime,
+      labelStack = _ref.labelStack,
+      others = (0, _objectWithoutProperties2.default)(_ref, _excluded);
+    return _objectSpread(_objectSpread({}, others), {}, {
+      stopTime: Math.round(stopTime)
+    }, labelStack ? {
+      labelStack: (0, _utils.optimizeLabelStack)(labelStack, reactUFOVersion)
+    } : {});
+  });
+}

package/dist/cjs/create-payload/utils/optimize-custom-timings.js

@@ -0,0 +1,22 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.optimizeCustomTimings = optimizeCustomTimings;
+function optimizeCustomTimings(customTimings, interactionStart) {
+  return customTimings.reduce(function (result, item) {
+    Object.keys(item.data).forEach(function (key) {
+      if (item.data[key].startTime >= interactionStart) {
+        result.push({
+          labelStack: [{
+            n: key
+          }],
+          startTime: Math.round(item.data[key].startTime),
+          endTime: Math.round(item.data[key].endTime)
+        });
+      }
+    });
+    return result;
+  }, []);
+}

package/dist/cjs/create-payload/utils/optimize-hold-info.js

@@ -0,0 +1,41 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.optimizeHoldInfo = optimizeHoldInfo;
+var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
+var _utils = require("../common/utils");
+function optimizeHoldInfo(holdInfo, interactionStart, reactUFOVersion) {
+  var holdInfoMap = holdInfo.reduce(function (result, hold) {
+    var labelStack = hold.labelStack,
+      name = hold.name,
+      start = hold.start,
+      end = hold.end,
+      ignoreOnSubmit = hold.ignoreOnSubmit;
+    if (labelStack && !ignoreOnSubmit && start >= interactionStart) {
+      var label = (0, _utils.stringifyLabelStackFully)([].concat((0, _toConsumableArray2.default)(labelStack), [{
+        name: name
+      }]));
+      var startTime = Math.round(start);
+      var endTime = Math.round(end);
+      var timing = result.get(label) || {
+        labelStack: (0, _utils.optimizeLabelStack)([].concat((0, _toConsumableArray2.default)(labelStack), [{
+          name: name
+        }]), reactUFOVersion),
+        startTime: startTime,
+        endTime: endTime
+      };
+      if (startTime < timing.startTime) {
+        timing.startTime = startTime;
+      }
+      if (endTime > timing.endTime) {
+        timing.endTime = endTime;
+      }
+      result.set(label, timing);
+    }
+    return result;
+  }, new Map());
+  return (0, _toConsumableArray2.default)(holdInfoMap.values());
+}