@atlaskit/react-ufo 4.2.6 → 4.3.1

package/dist/esm/config/index.js

@@ -68,17 +68,31 @@ export function getMostRecentVCRevision() {
   var enabledVCRevisions = getEnabledVCRevisions(experienceKey);
   return enabledVCRevisions[enabledVCRevisions.length - 1];
 }
+export function getReactHydrationStats() {
+  if (!config) {
+    return undefined;
+  }
+  try {
+    var _config, _config$getReactHydra;
+    var stats = (_config = config) === null || _config === void 0 || (_config$getReactHydra = _config.getReactHydrationStats) === null || _config$getReactHydra === void 0 ? void 0 : _config$getReactHydra.call(_config);
+    return stats !== null && stats !== void 0 ? stats : undefined;
+  } catch (e) {
+    // eslint-disable-next-line no-console
+    console.error('getReactHydrationStats threw an error: ', e);
+    return undefined;
+  }
+}
 export function getInteractionRate(name, interactionKind) {
   try {
     if (!config) {
       return 0;
     }
-    var _config = config,
-      killswitch = _config.killswitch,
-      rates = _config.rates,
-      rules = _config.rules,
-      kind = _config.kind,
-      autoGeneratedRate = _config.autoGeneratedRate;
+    var _config2 = config,
+      killswitch = _config2.killswitch,
+      rates = _config2.rates,
+      rules = _config2.rules,
+      kind = _config2.kind,
+      autoGeneratedRate = _config2.autoGeneratedRate;
     if (killswitch != null) {
       // Specifically kill certain events
       if (killswitch.includes(name)) {
@@ -128,8 +142,8 @@ export function getExperimentalInteractionRate(name, interactionType) {
     if (!config) {
       return 0;
     }
-    var _config2 = config,
-      experimentalInteractionMetrics = _config2.experimentalInteractionMetrics;
+    var _config3 = config,
+      experimentalInteractionMetrics = _config3.experimentalInteractionMetrics;
     if (!(experimentalInteractionMetrics !== null && experimentalInteractionMetrics !== void 0 && experimentalInteractionMetrics.enabled)) {
       return 0;
     }
@@ -149,8 +163,8 @@ export function getPostInteractionRate(name, interactionType) {
     if (!config) {
       return 0;
     }
-    var _config3 = config,
-      postInteractionLog = _config3.postInteractionLog;
+    var _config4 = config,
+      postInteractionLog = _config4.postInteractionLog;
     if (!(postInteractionLog !== null && postInteractionLog !== void 0 && postInteractionLog.enabled)) {
       return 0;
     }
@@ -176,8 +190,8 @@ export function getCapabilityRate(capability) {
     if (!config) {
       return 0;
     }
-    var _config4 = config,
-      capabilityRate = _config4.capability;
+    var _config5 = config,
+      capabilityRate = _config5.capability;
     if (capabilityRate != null) {
       var rate = capabilityRate[capability];
       if (rate != null) {
@@ -196,8 +210,8 @@ export function getTypingPerformanceTracingMethod() {
     if (!config) {
       return defaultMethod;
     }
-    var _config5 = config,
-      typingMethod = _config5.typingMethod;
+    var _config6 = config,
+      typingMethod = _config6.typingMethod;
     if (typingMethod != null && validTypingMethods.find(function (m) {
       return m === typingMethod;
     })) {
@@ -216,8 +230,8 @@ export function getAwaitBM3TTIList() {
     if (!config) {
       return [];
     }
-    var _config6 = config,
-      awaitBM3TTI = _config6.awaitBM3TTI;
+    var _config7 = config,
+      awaitBM3TTI = _config7.awaitBM3TTI;
     if (awaitBM3TTI != null) {
       return awaitBM3TTI;
     } else {
@@ -237,8 +251,8 @@ export function getUfoNameOverrides() {
     if (!config) {
       return undefined;
     }
-    var _config7 = config,
-      ufoNameOverrides = _config7.ufoNameOverrides;
+    var _config8 = config,
+      ufoNameOverrides = _config8.ufoNameOverrides;
     if (ufoNameOverrides != null) {
       return ufoNameOverrides;
     }
@@ -254,8 +268,8 @@ export function getDoNotAbortActivePressInteraction() {
     if (!config) {
       return undefined;
     }
-    var _config8 = config,
-      doNotAbortActivePressInteraction = _config8.doNotAbortActivePressInteraction;
+    var _config9 = config,
+      doNotAbortActivePressInteraction = _config9.doNotAbortActivePressInteraction;
     return doNotAbortActivePressInteraction;
   } catch (e) {
     return undefined;
@@ -268,8 +282,8 @@ export function getDoNotAbortActivePressInteractionOnTransition() {
     if (!config) {
       return undefined;
     }
-    var _config9 = config,
-      doNotAbortActivePressInteractionOnTransition = _config9.doNotAbortActivePressInteractionOnTransition;
+    var _config0 = config,
+      doNotAbortActivePressInteractionOnTransition = _config0.doNotAbortActivePressInteractionOnTransition;
     return doNotAbortActivePressInteractionOnTransition;
   } catch (e) {
     return undefined;
@@ -281,8 +295,8 @@ export function getInteractionTimeout(ufoName) {
     if (!config) {
       return CLEANUP_TIMEOUT;
     }
-    var _config0 = config,
-      interactionTimeout = _config0.interactionTimeout;
+    var _config1 = config,
+      interactionTimeout = _config1.interactionTimeout;
     if (interactionTimeout != null && interactionTimeout[ufoName] != null) {
       return interactionTimeout[ufoName];
     }

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

@@ -575,7 +575,7 @@ function createInteractionMetricsPayload(_x, _x2, _x3, _x4, _x5) {
 function _createInteractionMetricsPayload() {
   _createInteractionMetricsPayload = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(interaction, interactionId, experimental, criticalPayloadCount, vcMetrics) {
     var _window$location, _config$additionalPay;
-    var interactionPayloadStart, config, end, start, ufoName, knownSegments, rate, type, abortReason, routeName, featureFlags, previousInteractionName, isPreviousInteractionAborted, abortedByInteractionName, responsiveness, unknownElementName, unknownElementHierarchy, pageVisibilityAtTTI, pageVisibilityAtTTAI, segments, segmentTree, isDetailedPayload, isPageLoad, calculatePageVisibilityFromTheStartOfPageLoad, moreAccuratePageVisibilityAtTTI, moreAccuratePageVisibilityAtTTAI, labelStack, getInitialPageLoadSSRMetrics, pageLoadInteractionMetrics, getDetailedInteractionMetrics, getPageLoadDetailedInteractionMetrics, newUFOName, resourceTimings, _yield$Promise$all, _yield$Promise$all2, finalVCMetrics, experimentalMetrics, paintMetrics, payload;
+    var interactionPayloadStart, config, end, start, ufoName, knownSegments, rate, type, abortReason, routeName, featureFlags, previousInteractionName, isPreviousInteractionAborted, abortedByInteractionName, responsiveness, unknownElementName, unknownElementHierarchy, hydration, pageVisibilityAtTTI, pageVisibilityAtTTAI, segments, segmentTree, isDetailedPayload, isPageLoad, calculatePageVisibilityFromTheStartOfPageLoad, moreAccuratePageVisibilityAtTTI, moreAccuratePageVisibilityAtTTAI, labelStack, getInitialPageLoadSSRMetrics, pageLoadInteractionMetrics, getDetailedInteractionMetrics, getPageLoadDetailedInteractionMetrics, newUFOName, resourceTimings, _yield$Promise$all, _yield$Promise$all2, finalVCMetrics, experimentalMetrics, paintMetrics, getReactHydrationStats, payload;
     return _regeneratorRuntime.wrap(function _callee$(_context) {
       while (1) switch (_context.prev = _context.next) {
         case 0:
@@ -587,7 +587,7 @@ function _createInteractionMetricsPayload() {
           }
           throw Error('UFO Configuration not provided');
         case 4:
-          end = interaction.end, start = interaction.start, ufoName = interaction.ufoName, knownSegments = interaction.knownSegments, rate = interaction.rate, type = interaction.type, abortReason = interaction.abortReason, routeName = interaction.routeName, featureFlags = interaction.featureFlags, previousInteractionName = interaction.previousInteractionName, isPreviousInteractionAborted = interaction.isPreviousInteractionAborted, abortedByInteractionName = interaction.abortedByInteractionName, responsiveness = interaction.responsiveness, unknownElementName = interaction.unknownElementName, unknownElementHierarchy = interaction.unknownElementHierarchy;
+          end = interaction.end, start = interaction.start, ufoName = interaction.ufoName, knownSegments = interaction.knownSegments, rate = interaction.rate, type = interaction.type, abortReason = interaction.abortReason, routeName = interaction.routeName, featureFlags = interaction.featureFlags, previousInteractionName = interaction.previousInteractionName, isPreviousInteractionAborted = interaction.isPreviousInteractionAborted, abortedByInteractionName = interaction.abortedByInteractionName, responsiveness = interaction.responsiveness, unknownElementName = interaction.unknownElementName, unknownElementHierarchy = interaction.unknownElementHierarchy, hydration = interaction.hydration;
           pageVisibilityAtTTI = getPageVisibilityUpToTTI(interaction);
           pageVisibilityAtTTAI = getPageVisibilityUpToTTAI(interaction);
           segments = !fg('platform_ufo_remove_deprecated_config_fields') && config.killswitchNestedSegments ? [] : knownSegments;
@@ -700,6 +700,14 @@ function _createInteractionMetricsPayload() {
           if (!experimental) {
             fg('ufo_chrome_devtools_uplift') && addPerformanceMeasures(interaction.start, _toConsumableArray((finalVCMetrics === null || finalVCMetrics === void 0 ? void 0 : finalVCMetrics['ufo:vc:rev']) || []));
           }
+          getReactHydrationStats = function getReactHydrationStats() {
+            if (!isPageLoad || !hydration) {
+              return {};
+            }
+            return {
+              hydration: hydration
+            };
+          };
           payload = {
             actionSubject: 'experience',
             action: 'measured',
@@ -707,7 +715,7 @@ function _createInteractionMetricsPayload() {
             source: 'measured',
             tags: ['observability'],
             attributes: {
-              properties: _objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread({
+              properties: _objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread({
                 // basic
                 'event:hostname': ((_window$location = window.location) === null || _window$location === void 0 ? void 0 : _window$location.hostname) || 'unknown',
                 'event:product': config.product,
@@ -726,7 +734,7 @@ function _createInteractionMetricsPayload() {
               }, criticalPayloadCount !== undefined ? {
                 'ufo:multipayload': true,
                 'ufo:criticalPayloadCount': criticalPayloadCount
-              } : {}), getBrowserMetadataToLegacyFormat()), getSSRProperties(type)), getAssetsMetrics(interaction, pageLoadInteractionMetrics === null || pageLoadInteractionMetrics === void 0 ? void 0 : pageLoadInteractionMetrics.SSRDoneTime)), getPPSMetrics(interaction)), paintMetrics), getNavigationMetricsToLegacyFormat(type)), finalVCMetrics), experimentalMetrics), (_config$additionalPay = config.additionalPayloadData) === null || _config$additionalPay === void 0 ? void 0 : _config$additionalPay.call(config, interaction)), getTracingContextData(interaction)), getStylesheetMetrics()), getErrorCounts(interaction)), {}, {
+              } : {}), getBrowserMetadataToLegacyFormat()), getSSRProperties(type)), getAssetsMetrics(interaction, pageLoadInteractionMetrics === null || pageLoadInteractionMetrics === void 0 ? void 0 : pageLoadInteractionMetrics.SSRDoneTime)), getPPSMetrics(interaction)), paintMetrics), getNavigationMetricsToLegacyFormat(type)), finalVCMetrics), experimentalMetrics), (_config$additionalPay = config.additionalPayloadData) === null || _config$additionalPay === void 0 ? void 0 : _config$additionalPay.call(config, interaction)), getTracingContextData(interaction)), getStylesheetMetrics()), getErrorCounts(interaction)), getReactHydrationStats()), {}, {
                 interactionMetrics: _objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread({
                   namePrefix: config.namePrefix || '',
                   segmentPrefix: config.segmentPrefix || '',
@@ -772,7 +780,7 @@ function _createInteractionMetricsPayload() {
           }
           payload.attributes.properties['event:sizeInKb'] = getPayloadSize(payload.attributes.properties);
           return _context.abrupt("return", payload);
-        case 44:
+        case 45:
         case "end":
           return _context.stop();
       }

package/dist/esm/interaction-metrics/index.js

@@ -11,7 +11,7 @@ function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length)
 import { v4 as createUUID } from 'uuid';
 import { fg } from '@atlaskit/platform-feature-flags';
 import coinflip from '../coinflip';
-import { getAwaitBM3TTIList, getCapabilityRate, getConfig, getExperimentalInteractionRate, getInteractionTimeout, getPostInteractionRate } from '../config';
+import { getAwaitBM3TTIList, getCapabilityRate, getConfig, getExperimentalInteractionRate, getInteractionTimeout, getPostInteractionRate, getReactHydrationStats } from '../config';
 import { experimentalVC, getExperimentalVCMetrics, onExperimentalInteractionComplete } from '../create-experimental-interaction-metrics-payload';
 import { sanitizeUfoName } from '../create-payload/common/utils';
 import { clearActiveTrace } from '../experience-trace-id-context';
@@ -617,6 +617,7 @@ function finishInteraction(id, data) {
       data.vc = observer.getVCRawData();
     }
   }
+  data.hydration = getReactHydrationStats();
 
   // By this time, stop the post interaction log observer if coinflip rate is 0
   if (fg('platform_ufo_post_interaction_check_name')) {

package/dist/esm/resource-timing/main.js

@@ -1,7 +1,6 @@
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 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) { _defineProperty(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 { fg } from '@atlaskit/platform-feature-flags';
 import { getConfig as getConfigUFO } from '../config';
 import { roundEpsilon } from '../round-number';
 import { getConfig } from './common/utils/config';
@@ -95,7 +94,7 @@ function getNetworkData(item, eventStart) {
     ttfb: ttfb,
     serverTime: serverTime,
     networkTime: networkTime,
-    requestStart: fg('ufo_return_relative_request_start') ? requestStartRelative : requestStart
+    requestStart: requestStartRelative
   }, getSizeObject(transferSize));
 }
 export function getResourceTimings(interactionStart, interactionEnd) {

package/dist/esm/vc/vc-observer-new/metric-calculator/abstract-base-vc-calculator.js

@@ -10,6 +10,7 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
 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; }
+import { fg } from '@atlaskit/platform-feature-flags';
 import { calculateTTVCPercentilesWithDebugInfo } from './percentile-calc';
 import getViewportHeight from './utils/get-viewport-height';
 import getViewportWidth from './utils/get-viewport-width';
@@ -84,8 +85,11 @@ var AbstractVCCalculatorBase = /*#__PURE__*/function () {
           while (1) switch (_context.prev = _context.next) {
             case 0:
               percentiles = [25, 50, 75, 80, 85, 90, 95, 98, 99];
+              if (fg('platform_ufo_send_vc_100')) {
+                percentiles.push(100);
+              }
               viewportEntries = this.filterViewportEntries(filteredEntries);
-              _context.next = 4;
+              _context.next = 5;
               return calculateTTVCPercentilesWithDebugInfo({
                 viewport: {
                   width: getViewportWidth(),
@@ -95,31 +99,31 @@ var AbstractVCCalculatorBase = /*#__PURE__*/function () {
                 stopTime: stopTime,
                 orderedEntries: viewportEntries
               });
-            case 4:
+            case 5:
               vcLogs = _context.sent;
               vcDetails = {};
               percentileIndex = 0;
               entryDataBuffer = new Set();
               if (!vcLogs) {
-                _context.next = 28;
+                _context.next = 29;
                 break;
               }
               _iterator3 = _createForOfIteratorHelper(vcLogs);
-              _context.prev = 10;
+              _context.prev = 11;
               _iterator3.s();
-            case 12:
+            case 13:
               if ((_step3 = _iterator3.n()).done) {
-                _context.next = 20;
+                _context.next = 21;
                 break;
               }
               _entry2 = _step3.value;
               time = _entry2.time, viewportPercentage = _entry2.viewportPercentage, entries = _entry2.entries; // Only process entries if we haven't reached all percentiles
               if (!(percentileIndex >= percentiles.length)) {
-                _context.next = 17;
+                _context.next = 18;
                 break;
               }
-              return _context.abrupt("break", 20);
-            case 17:
+              return _context.abrupt("break", 21);
+            case 18:
               // Check if this entry matches any checkpoint percentiles
               if (viewportPercentage >= percentiles[percentileIndex]) {
                 elementNames = entries.map(function (e) {
@@ -141,21 +145,21 @@ var AbstractVCCalculatorBase = /*#__PURE__*/function () {
                   return entryDataBuffer.add(e);
                 });
               }
-            case 18:
-              _context.next = 12;
+            case 19:
+              _context.next = 13;
               break;
-            case 20:
-              _context.next = 25;
+            case 21:
+              _context.next = 26;
               break;
-            case 22:
-              _context.prev = 22;
-              _context.t0 = _context["catch"](10);
+            case 23:
+              _context.prev = 23;
+              _context.t0 = _context["catch"](11);
               _iterator3.e(_context.t0);
-            case 25:
-              _context.prev = 25;
+            case 26:
+              _context.prev = 26;
               _iterator3.f();
-              return _context.finish(25);
-            case 28:
+              return _context.finish(26);
+            case 29:
               // Fill in any missing percentiles with the last known values
               previousResult = {
                 t: 0,
@@ -294,11 +298,11 @@ var AbstractVCCalculatorBase = /*#__PURE__*/function () {
                 }
               }
               return _context.abrupt("return", vcDetails);
-            case 38:
+            case 39:
             case "end":
               return _context.stop();
           }
-        }, _callee, this, [[10, 22, 25, 28]]);
+        }, _callee, this, [[11, 23, 26, 29]]);
       }));
       function calculateWithDebugInfo(_x, _x2, _x3, _x4, _x5, _x6, _x7, _x8) {
         return _calculateWithDebugInfo.apply(this, arguments);

package/dist/types/common/common/types.d.ts

@@ -1,3 +1,4 @@
+import type { ReactHydrationStats } from '../../config';
 import type { TraceIdContext } from '../../experience-trace-id-context';
 import type { LabelStack, UFOInteractionContextType } from '../../interaction-context';
 import type { VCObserverInterface } from '../../vc/types';
@@ -162,6 +163,7 @@ export interface InteractionMetrics {
     vcObserver?: VCObserverInterface;
     experimentalVCObserver?: VCObserverInterface;
     vc?: VCRawDataType | null;
+    hydration?: ReactHydrationStats;
     experimentalTTAI?: number;
     experimentalVC90?: number;
     unknownElementName?: string;

package/dist/types/config/index.d.ts

@@ -32,6 +32,24 @@ type Rates = {
 };
 export type TTVCRevision = 'fy25.01' | 'fy25.02' | 'fy25.03';
 export declare const DEFAULT_TTVC_REVISION = "fy25.03";
+export type ReactHydrationStats = {
+    /**
+     * Indicates if hydration of SSR content failed, so React switching to client-side rendering and re-rendered from scratch.
+     */
+    successful: boolean;
+    /**
+     * The total number of hydration errors reported from {@code hydrateRoot#onRecoverableError}.
+     */
+    warningCount?: number;
+    /**
+     * The depth in the React component tree of the shallowest warning.
+     */
+    minWarningComponentDepth?: number;
+    /**
+     * The depth in the React component tree of the deepest warning.
+     */
+    maxWarningComponentDepth?: number;
+};
 export type Config = {
     readonly enabled?: boolean;
     readonly interactionTimeout?: Record<string, number>;
@@ -115,12 +133,18 @@ export type Config = {
     readonly shouldCalculateLighthouseMetricsFromTTAI?: boolean;
     readonly timeWindowForLateMutationsInMilliseconds?: number;
     readonly manuallyTrackReactProfilerMounts?: boolean;
+    /**
+     * Callback for consumers to provide React hydration stats after React has finished.
+     * Return {@code null} if hydration was not attempted or if we do not want to report any stats.
+     */
+    readonly getReactHydrationStats?: (() => ReactHydrationStats | undefined) | undefined;
 };
 export declare function setUFOConfig(newConfig: Config): void;
 export declare function getConfig(): Config | undefined;
 export declare function getEnabledVCRevisions(experienceKey?: string): readonly TTVCRevision[];
 export declare function isVCRevisionEnabled(revision: TTVCRevision, experienceKey?: string): boolean;
 export declare function getMostRecentVCRevision(experienceKey?: string): TTVCRevision;
+export declare function getReactHydrationStats(): ReactHydrationStats | undefined;
 export declare function getInteractionRate(name: string, interactionKind: InteractionKind): number;
 export declare function getExperimentalInteractionRate(name: string, interactionType: InteractionType): number;
 export declare function getPostInteractionRate(name: string, interactionType: InteractionType): number;