@atlaskit/react-ufo 4.3.2 → 4.4.0

package/CHANGELOG.md

@@ -1,5 +1,19 @@
 # @atlaskit/ufo-interaction-ignore
 
+## 4.4.0
+
+### Minor Changes
+
+- [`0bd8e0b53dd60`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/0bd8e0b53dd60) -
+  Adds Grammarly data attribute to exclusions list
+
+## 4.3.3
+
+### Patch Changes
+
+- [`c25a6c65bfd6d`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/c25a6c65bfd6d) -
+  Add unmount count to segment
+
 ## 4.3.2
 
 ### Patch Changes

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

@@ -330,6 +330,10 @@ function optimizeReactProfilerTimings(reactProfilerTimings, interactionStart, re
       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);
     }

package/dist/cjs/create-post-interaction-log-payload/index.js

@@ -7,11 +7,13 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _coinflip = _interopRequireDefault(require("../coinflip"));
 var _config = require("../config");
 var _utils = require("../create-payload/common/utils");
 var _getReactUfoPayloadVersion = require("../create-payload/utils/get-react-ufo-payload-version");
 var _hiddenTiming = require("../hidden-timing");
+var _interactionMetrics = require("../interaction-metrics");
 var _getLateMutations = _interopRequireDefault(require("./get-late-mutations"));
 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; }
@@ -86,6 +88,7 @@ function transformReactProfilerTimings(reactProfilerTimings) {
       }).join('/');
       var start = Math.round(startTime);
       var end = Math.round(commitTime);
+      var cacheKey = (0, _utils.stringifyLabelStackFully)(labelStack);
       var timing = result.get(label) || {
         labelStack: label,
         startTime: start,
@@ -106,6 +109,10 @@ function transformReactProfilerTimings(reactProfilerTimings) {
       if (type === 'update') {
         timing.rerenderCount += 1;
       }
+      if (_interactionMetrics.segmentUnmountCache.has(cacheKey) && (0, _platformFeatureFlags.fg)('platform_ufo_segment_unmount_count')) {
+        timing.unmountCount = _interactionMetrics.segmentUnmountCache.get(cacheKey) || 0;
+        _interactionMetrics.segmentUnmountCache.delete(cacheKey);
+      }
       timing.renderDuration += Math.round(actualDuration);
       result.set(label, timing);
     }

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

@@ -39,7 +39,7 @@ exports.postInteractionLog = exports.interactionSpans = exports.getPerformanceOb
 exports.remove = remove;
 exports.removeHoldByID = removeHoldByID;
 exports.removeSegment = removeSegment;
-exports.setInteractionPerformanceEvent = void 0;
+exports.setInteractionPerformanceEvent = exports.segmentUnmountCache = void 0;
 exports.sinkInteractionHandler = sinkInteractionHandler;
 exports.sinkPostInteractionLogHandler = sinkPostInteractionLogHandler;
 exports.tryComplete = tryComplete;
@@ -73,6 +73,7 @@ var PreviousInteractionLog = {
 var postInteractionLog = exports.postInteractionLog = new _postInteractionLog.default();
 var interactionQueue = [];
 var segmentCache = new Map();
+var segmentUnmountCache = exports.segmentUnmountCache = new Map(); // Temporarily store segment unmount counts
 var CLEANUP_TIMEOUT = 60 * 1000;
 var segmentObservers = [];
 function getActiveInteraction() {
@@ -1185,6 +1186,10 @@ function removeSegment(labelStack) {
   var segmentInfo = segmentCache.get(key);
   if (segmentInfo) {
     segmentCache.delete(JSON.stringify(labelStack));
+    if ((0, _platformFeatureFlags.fg)('platform_ufo_segment_unmount_count')) {
+      var cacheKey = (0, _utils.stringifyLabelStackFully)(labelStack);
+      segmentUnmountCache.set(cacheKey, (segmentUnmountCache.get(cacheKey) || 0) + 1);
+    }
     segmentObservers.forEach(function (observer) {
       observer.onRemove(segmentInfo);
     });

package/dist/cjs/vc/vc-observer-new/metric-calculator/fy25_03/index.js

@@ -56,7 +56,7 @@ var VCCalculator_FY25_03 = exports.default = /*#__PURE__*/function (_AbstractVCC
         if (!attributeName || KNOWN_ATTRIBUTES_THAT_DOES_NOT_CAUSE_LAYOUT_SHIFTS.includes(attributeName)) {
           return false;
         }
-        if (attributeName.startsWith('data-test') || attributeName === 'data-aui-version' || attributeName === 'data-testid' || attributeName === 'data-vc' || attributeName === 'data-ssr-placeholder' || attributeName === 'data-ssr-placeholder-replace' || attributeName === 'data-vc-nvs' || attributeName === 'data-media-vc-wrapper' || attributeName === 'data-renderer-start-pos' || attributeName === 'data-table-local-id' || attributeName === 'spellcheck' || attributeName === 'data-auto-scrollable' || attributeName === 'id' || attributeName === 'tabindex' || attributeName === 'data-is-ttvc-ready' || NON_VISUAL_ARIA_ATTRIBUTES.includes(attributeName)) {
+        if (attributeName.startsWith('data-test') || attributeName === 'data-aui-version' || attributeName === 'data-testid' || attributeName === 'data-vc' || attributeName === 'data-ssr-placeholder' || attributeName === 'data-ssr-placeholder-replace' || attributeName === 'data-vc-nvs' || attributeName === 'data-media-vc-wrapper' || attributeName === 'data-renderer-start-pos' || attributeName === 'data-table-local-id' || attributeName === 'spellcheck' || attributeName === 'data-auto-scrollable' || attributeName === 'id' || attributeName === 'tabindex' || attributeName === 'data-is-ttvc-ready' || attributeName === 'data-new-gr-c-c-s-loaded' || NON_VISUAL_ARIA_ATTRIBUTES.includes(attributeName)) {
           return false;
         }
         return true;

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

@@ -13,7 +13,7 @@ import { getBm3Timings } from '../custom-timings';
 import { getGlobalErrorCount } from '../global-error-handler';
 import { getPageVisibilityState } from '../hidden-timing';
 import * as initialPageLoadExtraTiming from '../initial-page-load-extra-timing';
-import { interactionSpans as atlaskitInteractionSpans } from '../interaction-metrics';
+import { interactionSpans as atlaskitInteractionSpans, segmentUnmountCache } from '../interaction-metrics';
 import { createMemoryStateReport, createPressureStateReport } from '../machine-utilisation';
 import * as resourceTiming from '../resource-timing';
 import { filterResourceTimings } from '../resource-timing/common/utils/resource-timing-buffer';
@@ -323,6 +323,10 @@ function optimizeReactProfilerTimings(reactProfilerTimings, interactionStart, re
       if (type === 'update') {
         timing.rerenderCount += 1;
       }
+      if (segmentUnmountCache.has(label) && fg('platform_ufo_segment_unmount_count')) {
+        timing.unmountCount = segmentUnmountCache.get(label) || 0;
+        segmentUnmountCache.delete(label);
+      }
       timing.renderDuration += Math.round(actualDuration);
       result.set(label, timing);
     }

package/dist/es2019/create-post-interaction-log-payload/index.js

@@ -1,8 +1,10 @@
+import { fg } from '@atlaskit/platform-feature-flags';
 import coinflip from '../coinflip';
 import { DEFAULT_TTVC_REVISION, getConfig, getMostRecentVCRevision, getPostInteractionRate } from '../config';
-import { isSegmentLabel, sanitizeUfoName } from '../create-payload/common/utils';
+import { isSegmentLabel, sanitizeUfoName, stringifyLabelStackFully } from '../create-payload/common/utils';
 import { getReactUFOPayloadVersion } from '../create-payload/utils/get-react-ufo-payload-version';
 import { getPageVisibilityState } from '../hidden-timing';
+import { segmentUnmountCache } from '../interaction-metrics';
 import getLateMutations from './get-late-mutations';
 function getParentStack(labelStack) {
   if (!labelStack || labelStack.length <= 1) {
@@ -72,6 +74,7 @@ function transformReactProfilerTimings(reactProfilerTimings) {
       const label = labelStack.map(ls => ls.name).join('/');
       const start = Math.round(startTime);
       const end = Math.round(commitTime);
+      const cacheKey = stringifyLabelStackFully(labelStack);
       const timing = result.get(label) || {
         labelStack: label,
         startTime: start,
@@ -92,6 +95,10 @@ function transformReactProfilerTimings(reactProfilerTimings) {
       if (type === 'update') {
         timing.rerenderCount += 1;
       }
+      if (segmentUnmountCache.has(cacheKey) && fg('platform_ufo_segment_unmount_count')) {
+        timing.unmountCount = segmentUnmountCache.get(cacheKey) || 0;
+        segmentUnmountCache.delete(cacheKey);
+      }
       timing.renderDuration += Math.round(actualDuration);
       result.set(label, timing);
     }

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

@@ -3,7 +3,7 @@ import { fg } from '@atlaskit/platform-feature-flags';
 import coinflip from '../coinflip';
 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 { sanitizeUfoName, stringifyLabelStackFully } from '../create-payload/common/utils';
 import { clearActiveTrace } from '../experience-trace-id-context';
 import { allFeatureFlagsAccessed, currentFeatureFlagsAccessed } from '../feature-flags-accessed';
 import { getInteractionId } from '../interaction-id-context';
@@ -17,6 +17,7 @@ const PreviousInteractionLog = {
 export const postInteractionLog = new PostInteractionLog();
 const interactionQueue = [];
 const segmentCache = new Map();
+export const segmentUnmountCache = new Map(); // Temporarily store segment unmount counts
 const CLEANUP_TIMEOUT = 60 * 1000;
 const segmentObservers = [];
 export function getActiveInteraction() {
@@ -1061,6 +1062,10 @@ export function removeSegment(labelStack) {
   const segmentInfo = segmentCache.get(key);
   if (segmentInfo) {
     segmentCache.delete(JSON.stringify(labelStack));
+    if (fg('platform_ufo_segment_unmount_count')) {
+      const cacheKey = stringifyLabelStackFully(labelStack);
+      segmentUnmountCache.set(cacheKey, (segmentUnmountCache.get(cacheKey) || 0) + 1);
+    }
     segmentObservers.forEach(observer => {
       observer.onRemove(segmentInfo);
     });

package/dist/es2019/vc/vc-observer-new/metric-calculator/fy25_03/index.js

@@ -38,7 +38,7 @@ export default class VCCalculator_FY25_03 extends AbstractVCCalculatorBase {
       if (!attributeName || KNOWN_ATTRIBUTES_THAT_DOES_NOT_CAUSE_LAYOUT_SHIFTS.includes(attributeName)) {
         return false;
       }
-      if (attributeName.startsWith('data-test') || attributeName === 'data-aui-version' || attributeName === 'data-testid' || attributeName === 'data-vc' || attributeName === 'data-ssr-placeholder' || attributeName === 'data-ssr-placeholder-replace' || attributeName === 'data-vc-nvs' || attributeName === 'data-media-vc-wrapper' || attributeName === 'data-renderer-start-pos' || attributeName === 'data-table-local-id' || attributeName === 'spellcheck' || attributeName === 'data-auto-scrollable' || attributeName === 'id' || attributeName === 'tabindex' || attributeName === 'data-is-ttvc-ready' || NON_VISUAL_ARIA_ATTRIBUTES.includes(attributeName)) {
+      if (attributeName.startsWith('data-test') || attributeName === 'data-aui-version' || attributeName === 'data-testid' || attributeName === 'data-vc' || attributeName === 'data-ssr-placeholder' || attributeName === 'data-ssr-placeholder-replace' || attributeName === 'data-vc-nvs' || attributeName === 'data-media-vc-wrapper' || attributeName === 'data-renderer-start-pos' || attributeName === 'data-table-local-id' || attributeName === 'spellcheck' || attributeName === 'data-auto-scrollable' || attributeName === 'id' || attributeName === 'tabindex' || attributeName === 'data-is-ttvc-ready' || attributeName === 'data-new-gr-c-c-s-loaded' || NON_VISUAL_ARIA_ATTRIBUTES.includes(attributeName)) {
         return false;
       }
       return true;

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

@@ -24,7 +24,7 @@ import { getBm3Timings } from '../custom-timings';
 import { getGlobalErrorCount } from '../global-error-handler';
 import { getPageVisibilityState } from '../hidden-timing';
 import * as initialPageLoadExtraTiming from '../initial-page-load-extra-timing';
-import { interactionSpans as atlaskitInteractionSpans } from '../interaction-metrics';
+import { interactionSpans as atlaskitInteractionSpans, segmentUnmountCache } from '../interaction-metrics';
 import { createMemoryStateReport, createPressureStateReport } from '../machine-utilisation';
 import * as resourceTiming from '../resource-timing';
 import { filterResourceTimings } from '../resource-timing/common/utils/resource-timing-buffer';
@@ -323,6 +323,10 @@ function optimizeReactProfilerTimings(reactProfilerTimings, interactionStart, re
       if (type === 'update') {
         timing.rerenderCount += 1;
       }
+      if (segmentUnmountCache.has(label) && fg('platform_ufo_segment_unmount_count')) {
+        timing.unmountCount = segmentUnmountCache.get(label) || 0;
+        segmentUnmountCache.delete(label);
+      }
       timing.renderDuration += Math.round(actualDuration);
       result.set(label, timing);
     }

package/dist/esm/create-post-interaction-log-payload/index.js

@@ -2,11 +2,13 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
 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 coinflip from '../coinflip';
 import { DEFAULT_TTVC_REVISION, getConfig, getMostRecentVCRevision, getPostInteractionRate } from '../config';
-import { isSegmentLabel, sanitizeUfoName } from '../create-payload/common/utils';
+import { isSegmentLabel, sanitizeUfoName, stringifyLabelStackFully } from '../create-payload/common/utils';
 import { getReactUFOPayloadVersion } from '../create-payload/utils/get-react-ufo-payload-version';
 import { getPageVisibilityState } from '../hidden-timing';
+import { segmentUnmountCache } from '../interaction-metrics';
 import getLateMutations from './get-late-mutations';
 function getParentStack(labelStack) {
   if (!labelStack || labelStack.length <= 1) {
@@ -79,6 +81,7 @@ function transformReactProfilerTimings(reactProfilerTimings) {
       }).join('/');
       var start = Math.round(startTime);
       var end = Math.round(commitTime);
+      var cacheKey = stringifyLabelStackFully(labelStack);
       var timing = result.get(label) || {
         labelStack: label,
         startTime: start,
@@ -99,6 +102,10 @@ function transformReactProfilerTimings(reactProfilerTimings) {
       if (type === 'update') {
         timing.rerenderCount += 1;
       }
+      if (segmentUnmountCache.has(cacheKey) && fg('platform_ufo_segment_unmount_count')) {
+        timing.unmountCount = segmentUnmountCache.get(cacheKey) || 0;
+        segmentUnmountCache.delete(cacheKey);
+      }
       timing.renderDuration += Math.round(actualDuration);
       result.set(label, timing);
     }

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

@@ -13,7 +13,7 @@ import { fg } from '@atlaskit/platform-feature-flags';
 import coinflip from '../coinflip';
 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 { sanitizeUfoName, stringifyLabelStackFully } from '../create-payload/common/utils';
 import { clearActiveTrace } from '../experience-trace-id-context';
 import { allFeatureFlagsAccessed, currentFeatureFlagsAccessed } from '../feature-flags-accessed';
 import { getInteractionId } from '../interaction-id-context';
@@ -27,6 +27,7 @@ var PreviousInteractionLog = {
 export var postInteractionLog = new PostInteractionLog();
 var interactionQueue = [];
 var segmentCache = new Map();
+export var segmentUnmountCache = new Map(); // Temporarily store segment unmount counts
 var CLEANUP_TIMEOUT = 60 * 1000;
 var segmentObservers = [];
 export function getActiveInteraction() {
@@ -1139,6 +1140,10 @@ export function removeSegment(labelStack) {
   var segmentInfo = segmentCache.get(key);
   if (segmentInfo) {
     segmentCache.delete(JSON.stringify(labelStack));
+    if (fg('platform_ufo_segment_unmount_count')) {
+      var cacheKey = stringifyLabelStackFully(labelStack);
+      segmentUnmountCache.set(cacheKey, (segmentUnmountCache.get(cacheKey) || 0) + 1);
+    }
     segmentObservers.forEach(function (observer) {
       observer.onRemove(segmentInfo);
     });

package/dist/esm/vc/vc-observer-new/metric-calculator/fy25_03/index.js

@@ -49,7 +49,7 @@ var VCCalculator_FY25_03 = /*#__PURE__*/function (_AbstractVCCalculator) {
         if (!attributeName || KNOWN_ATTRIBUTES_THAT_DOES_NOT_CAUSE_LAYOUT_SHIFTS.includes(attributeName)) {
           return false;
         }
-        if (attributeName.startsWith('data-test') || attributeName === 'data-aui-version' || attributeName === 'data-testid' || attributeName === 'data-vc' || attributeName === 'data-ssr-placeholder' || attributeName === 'data-ssr-placeholder-replace' || attributeName === 'data-vc-nvs' || attributeName === 'data-media-vc-wrapper' || attributeName === 'data-renderer-start-pos' || attributeName === 'data-table-local-id' || attributeName === 'spellcheck' || attributeName === 'data-auto-scrollable' || attributeName === 'id' || attributeName === 'tabindex' || attributeName === 'data-is-ttvc-ready' || NON_VISUAL_ARIA_ATTRIBUTES.includes(attributeName)) {
+        if (attributeName.startsWith('data-test') || attributeName === 'data-aui-version' || attributeName === 'data-testid' || attributeName === 'data-vc' || attributeName === 'data-ssr-placeholder' || attributeName === 'data-ssr-placeholder-replace' || attributeName === 'data-vc-nvs' || attributeName === 'data-media-vc-wrapper' || attributeName === 'data-renderer-start-pos' || attributeName === 'data-table-local-id' || attributeName === 'spellcheck' || attributeName === 'data-auto-scrollable' || attributeName === 'id' || attributeName === 'tabindex' || attributeName === 'data-is-ttvc-ready' || attributeName === 'data-new-gr-c-c-s-loaded' || NON_VISUAL_ARIA_ATTRIBUTES.includes(attributeName)) {
           return false;
         }
         return true;

package/dist/types/common/react-ufo-payload-schema.d.ts

@@ -30,6 +30,7 @@ export type ReactProfilerTiming = {
     mountCount: number;
     rerenderCount: number;
     renderDuration: number;
+    unmountCount?: number;
 };
 export type HoldInfo = {
     labelStack: LabelStack;

package/dist/types/interaction-metrics/index.d.ts

@@ -5,6 +5,7 @@ import type { LabelStack } from '../interaction-context';
 import PostInteractionLog from './post-interaction-log';
 export type { InteractionMetrics, LifecycleMarkType, Span, Mark, MarkType, InteractionType, AbortReasonType, ReactProfilerTiming, RequestInfo, ApdexType, CustomData, CustomTiming, InteractionError, };
 export declare const postInteractionLog: PostInteractionLog;
+export declare const segmentUnmountCache: Map<string, number>;
 export declare function getActiveInteraction(): InteractionMetrics | undefined;
 export declare const getPerformanceObserver: () => PerformanceObserver;
 export declare const setInteractionPerformanceEvent: (entry: PerformanceEventTiming) => void;

package/dist/types-ts4.5/common/react-ufo-payload-schema.d.ts

@@ -30,6 +30,7 @@ export type ReactProfilerTiming = {
     mountCount: number;
     rerenderCount: number;
     renderDuration: number;
+    unmountCount?: number;
 };
 export type HoldInfo = {
     labelStack: LabelStack;

package/dist/types-ts4.5/interaction-metrics/index.d.ts

@@ -5,6 +5,7 @@ import type { LabelStack } from '../interaction-context';
 import PostInteractionLog from './post-interaction-log';
 export type { InteractionMetrics, LifecycleMarkType, Span, Mark, MarkType, InteractionType, AbortReasonType, ReactProfilerTiming, RequestInfo, ApdexType, CustomData, CustomTiming, InteractionError, };
 export declare const postInteractionLog: PostInteractionLog;
+export declare const segmentUnmountCache: Map<string, number>;
 export declare function getActiveInteraction(): InteractionMetrics | undefined;
 export declare const getPerformanceObserver: () => PerformanceObserver;
 export declare const setInteractionPerformanceEvent: (entry: PerformanceEventTiming) => void;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/react-ufo",
-	"version": "4.3.2",
+	"version": "4.4.0",
 	"description": "Parts of React UFO that are publicly available",
 	"author": "Atlassian Pty Ltd",
 	"license": "Apache-2.0",
@@ -200,6 +200,9 @@
 		},
 		"platform_ufo_display_content_resolution_ttvc_v3": {
 			"type": "boolean"
+		},
+		"platform_ufo_segment_unmount_count": {
+			"type": "boolean"
 		}
 	}
 }