@atlaskit/react-ufo 3.4.2 → 3.4.3

package/CHANGELOG.md

@@ -1,5 +1,13 @@
 # @atlaskit/ufo-interaction-ignore
 
+## 3.4.3
+
+### Patch Changes
+
+- [#127288](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/127288)
+  [`ee26211b6cd7a`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/ee26211b6cd7a) -
+  Optimisation for VC v3
+
 ## 3.4.2
 
 ### Patch Changes

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

@@ -183,7 +183,7 @@ var getLCP = function getLCP(end) {
       }
     });
     observer.observe({
-      type: "largest-contentful-paint",
+      type: 'largest-contentful-paint',
       buffered: true
     });
   });

package/dist/cjs/vc/index.js

@@ -13,6 +13,7 @@ var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/cl
 var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
 var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _config = require("../config");
+var _noOpVcObserver = require("./no-op-vc-observer");
 var _vcObserver = require("./vc-observer");
 var _vcObserverNew = _interopRequireDefault(require("./vc-observer-new"));
 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; }
@@ -22,7 +23,6 @@ var VCObserverWrapper = /*#__PURE__*/function () {
     var _getConfig;
     var opts = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
     (0, _classCallCheck2.default)(this, VCObserverWrapper);
-    this.oldVCObserver = new _vcObserver.VCObserver(opts);
     this.newVCObserver = null;
     var isNewVCObserverEnabled = (0, _platformFeatureFlags.fg)('platform_ufo_vc_observer_new') || ((_getConfig = (0, _config.getConfig)()) === null || _getConfig === void 0 || (_getConfig = _getConfig.vc) === null || _getConfig === void 0 ? void 0 : _getConfig.enableVCObserverNew);
     if (isNewVCObserverEnabled) {
@@ -30,6 +30,7 @@ var VCObserverWrapper = /*#__PURE__*/function () {
         selectorConfig: opts.selectorConfig
       });
     }
+    this.oldVCObserver = new _vcObserver.VCObserver(opts);
   }
   return (0, _createClass2.default)(VCObserverWrapper, [{
     key: "start",
@@ -113,10 +114,29 @@ var VCObserverWrapper = /*#__PURE__*/function () {
     }
   }]);
 }();
+var isReactSSR = Boolean(process.env.REACT_SSR);
+var isServer = Boolean(globalThis === null || globalThis === void 0 ? void 0 : globalThis.__SERVER__);
+function isEnvironmentSupported() {
+  // SSR environment aren't supported
+  if (isReactSSR || isServer) {
+    return false;
+  }
+
+  // Legacy browsers that doesn't support WeakRef
+  // aren't valid
+  if (typeof (globalThis === null || globalThis === void 0 ? void 0 : globalThis.WeakRef) !== 'function') {
+    return false;
+  }
+  if (typeof (globalThis === null || globalThis === void 0 ? void 0 : globalThis.MutationObserver) !== 'function' || typeof (globalThis === null || globalThis === void 0 ? void 0 : globalThis.IntersectionObserver) !== 'function' || typeof (globalThis === null || globalThis === void 0 ? void 0 : globalThis.PerformanceObserver) !== 'function') {
+    return false;
+  }
+  return true;
+}
 var getVCObserver = exports.getVCObserver = function getVCObserver() {
   var opts = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
   if (!globalThis.__vcObserver) {
-    globalThis.__vcObserver = new VCObserverWrapper(opts);
+    var shouldMockVCObserver = !isEnvironmentSupported();
+    globalThis.__vcObserver = shouldMockVCObserver ? new _noOpVcObserver.VCObserverNOOP() : new VCObserverWrapper(opts);
   }
   return globalThis.__vcObserver;
 };

package/dist/cjs/vc/no-op-vc-observer.js

@@ -0,0 +1,44 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.VCObserverNOOP = void 0;
+var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
+var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
+// This class should be used on scenarios where VC can not be calculate
+// such as: SSR environment and legacy browsers
+var VCObserverNOOP = exports.VCObserverNOOP = /*#__PURE__*/function () {
+  function VCObserverNOOP() {
+    (0, _classCallCheck2.default)(this, VCObserverNOOP);
+  }
+  return (0, _createClass2.default)(VCObserverNOOP, [{
+    key: "start",
+    value: function start(startArg) {}
+  }, {
+    key: "stop",
+    value: function stop() {}
+  }, {
+    key: "getVCRawData",
+    value: function getVCRawData() {
+      return null;
+    }
+  }, {
+    key: "getVCResult",
+    value: function getVCResult(param) {
+      return Promise.resolve({
+        'ufo:vc:noop': true
+      });
+    }
+  }, {
+    key: "setSSRElement",
+    value: function setSSRElement(element) {}
+  }, {
+    key: "setReactRootRenderStart",
+    value: function setReactRootRenderStart(startTime) {}
+  }, {
+    key: "setReactRootRenderStop",
+    value: function setReactRootRenderStop(stopTime) {}
+  }]);
+}();

package/dist/cjs/vc/vc-observer/index.js

@@ -14,6 +14,7 @@ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/de
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
+var _hiddenTiming = require("../../hidden-timing");
 var _attachAbortListeners = require("./attachAbortListeners");
 var _getViewport = require("./getViewport");
 var _heatmap = require("./heatmap/heatmap");
@@ -103,7 +104,7 @@ var VCObserver = exports.VCObserver = /*#__PURE__*/function () {
     });
     (0, _defineProperty2.default)(this, "getVCResult", /*#__PURE__*/function () {
       var _ref4 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee(_ref3) {
-        var start, stop, tti, prefix, ssr, vc, isEventAborted, startTime, fullPrefix, rawData, abortReason, abortReasonInfo, heatmap, heatmapNext, outOfBoundaryInfo, totalTime, componentsLog, viewport, devToolsEnabled, ratios, multiHeatmap, _VCObserver$calculate, VC, VCBox, VCEntries, totalPainted, _componentsLog, vcNext, outOfBoundary, stopTime, isVCClean, isMultiHeatmapEnabled, revisionsData, isCalcSpeedIndexEnabled, speedIndex;
+        var start, stop, tti, prefix, ssr, vc, isEventAborted, startTime, fullPrefix, rawData, abortReason, abortReasonInfo, heatmap, heatmapNext, outOfBoundaryInfo, totalTime, componentsLog, viewport, devToolsEnabled, ratios, multiHeatmap, _VCObserver$calculate, VC, VCBox, VCEntries, totalPainted, _componentsLog, vcNext, outOfBoundary, stopTime, isVCClean, isMultiHeatmapEnabled, pageVisibilityUpToTTAI, shouldHaveVCmetric, revisionsData, isCalcSpeedIndexEnabled, speedIndex;
         return _regenerator.default.wrap(function _callee$(_context) {
           while (1) switch (_context.prev = _context.next) {
             case 0:
@@ -242,28 +243,30 @@ var VCObserver = exports.VCObserver = /*#__PURE__*/function () {
               }
               isVCClean = !abortReasonInfo;
               isMultiHeatmapEnabled = !(0, _platformFeatureFlags.fg)('platform_ufo_multiheatmap_killswitch');
+              pageVisibilityUpToTTAI = (0, _hiddenTiming.getPageVisibilityState)(start, stop);
+              shouldHaveVCmetric = isVCClean && !isEventAborted && pageVisibilityUpToTTAI;
               revisionsData = isMultiHeatmapEnabled ? (0, _platformFeatureFlags.fg)('platform_ufo_vc_observer_new') ? (0, _defineProperty2.default)({}, "".concat(fullPrefix, "vc:rev"), [{
                 revision: 'fy25.01',
                 clean: isVCClean,
-                'metric:vc90': VC['90'],
-                vcDetails: Object.fromEntries(VCObserver.VCParts.map(function (key) {
+                'metric:vc90': shouldHaveVCmetric ? VC['90'] : null,
+                vcDetails: shouldHaveVCmetric ? Object.fromEntries(VCObserver.VCParts.map(function (key) {
                   var _VCBox$key;
                   return [key, {
                     t: VC[key],
                     e: (_VCBox$key = VCBox[key]) !== null && _VCBox$key !== void 0 ? _VCBox$key : []
                   }];
-                }))
+                })) : []
               }, {
                 revision: 'fy25.02',
                 clean: isVCClean,
-                'metric:vc90': vcNext.VC['90'],
-                vcDetails: Object.fromEntries(VCObserver.VCParts.map(function (key) {
+                'metric:vc90': shouldHaveVCmetric ? VC['90'] : null,
+                vcDetails: shouldHaveVCmetric ? Object.fromEntries(VCObserver.VCParts.map(function (key) {
                   var _vcNext$VCBox$key;
                   return [key, {
                     t: vcNext.VC[key],
                     e: (_vcNext$VCBox$key = vcNext.VCBox[key]) !== null && _vcNext$VCBox$key !== void 0 ? _vcNext$VCBox$key : []
                   }];
-                }))
+                })) : []
               }]) : multiHeatmap !== null ? (0, _defineProperty2.default)({}, "".concat(fullPrefix, "vc:rev"), multiHeatmap === null || multiHeatmap === void 0 ? void 0 : multiHeatmap.getPayloadShapedData({
                 VCParts: VCObserver.VCParts.map(function (v) {
                   return parseInt(v);
@@ -287,7 +290,7 @@ var VCObserver = exports.VCObserver = /*#__PURE__*/function () {
               return _context.abrupt("return", _objectSpread(_objectSpread(_objectSpread((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)({
                 'metrics:vc': VC
               }, "".concat(fullPrefix, "vc:state"), true), "".concat(fullPrefix, "vc:clean"), isVCClean), "".concat(fullPrefix, "vc:dom"), VCBox), "".concat(fullPrefix, "vc:updates"), VCEntries.rel.slice(0, 50)), "".concat(fullPrefix, "vc:size"), viewport), "".concat(fullPrefix, "vc:time"), Math.round(totalTime + (stopTime - startTime))), "".concat(fullPrefix, "vc:total"), totalPainted), "".concat(fullPrefix, "vc:ratios"), ratios), outOfBoundary), {}, (0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)({}, "".concat(fullPrefix, "vc:next"), vcNext.VC), "".concat(fullPrefix, "vc:next:updates"), vcNext.VCEntries.rel.slice(0, 50)), "".concat(fullPrefix, "vc:next:dom"), vcNext.VCBox), "".concat(fullPrefix, "vc:ignored"), _this.getIgnoredElements(componentsLog)), revisionsData), isCalcSpeedIndexEnabled ? speedIndex : {}));
-            case 25:
+            case 27:
             case "end":
               return _context.stop();
           }

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

@@ -155,7 +155,7 @@ const getLCP = end => {
       }
     });
     observer.observe({
-      type: "largest-contentful-paint",
+      type: 'largest-contentful-paint',
       buffered: true
     });
   });

package/dist/es2019/vc/index.js

@@ -1,11 +1,11 @@
 import { fg } from '@atlaskit/platform-feature-flags';
 import { getConfig } from '../config';
+import { VCObserverNOOP } from './no-op-vc-observer';
 import { VCObserver } from './vc-observer';
 import VCObserverNew from './vc-observer-new';
 class VCObserverWrapper {
   constructor(opts = {}) {
     var _getConfig, _getConfig$vc;
-    this.oldVCObserver = new VCObserver(opts);
     this.newVCObserver = null;
     const isNewVCObserverEnabled = fg('platform_ufo_vc_observer_new') || ((_getConfig = getConfig()) === null || _getConfig === void 0 ? void 0 : (_getConfig$vc = _getConfig.vc) === null || _getConfig$vc === void 0 ? void 0 : _getConfig$vc.enableVCObserverNew);
     if (isNewVCObserverEnabled) {
@@ -13,6 +13,7 @@ class VCObserverWrapper {
         selectorConfig: opts.selectorConfig
       });
     }
+    this.oldVCObserver = new VCObserver(opts);
   }
   start(startArg) {
     var _this$oldVCObserver, _this$newVCObserver;
@@ -58,9 +59,28 @@ class VCObserverWrapper {
     (_this$oldVCObserver7 = this.oldVCObserver) === null || _this$oldVCObserver7 === void 0 ? void 0 : _this$oldVCObserver7.setReactRootRenderStop(stopTime || performance.now());
   }
 }
+const isReactSSR = Boolean(process.env.REACT_SSR);
+const isServer = Boolean(globalThis === null || globalThis === void 0 ? void 0 : globalThis.__SERVER__);
+function isEnvironmentSupported() {
+  // SSR environment aren't supported
+  if (isReactSSR || isServer) {
+    return false;
+  }
+
+  // Legacy browsers that doesn't support WeakRef
+  // aren't valid
+  if (typeof (globalThis === null || globalThis === void 0 ? void 0 : globalThis.WeakRef) !== 'function') {
+    return false;
+  }
+  if (typeof (globalThis === null || globalThis === void 0 ? void 0 : globalThis.MutationObserver) !== 'function' || typeof (globalThis === null || globalThis === void 0 ? void 0 : globalThis.IntersectionObserver) !== 'function' || typeof (globalThis === null || globalThis === void 0 ? void 0 : globalThis.PerformanceObserver) !== 'function') {
+    return false;
+  }
+  return true;
+}
 export const getVCObserver = (opts = {}) => {
   if (!globalThis.__vcObserver) {
-    globalThis.__vcObserver = new VCObserverWrapper(opts);
+    const shouldMockVCObserver = !isEnvironmentSupported();
+    globalThis.__vcObserver = shouldMockVCObserver ? new VCObserverNOOP() : new VCObserverWrapper(opts);
   }
   return globalThis.__vcObserver;
 };

package/dist/es2019/vc/no-op-vc-observer.js

@@ -0,0 +1,17 @@
+// This class should be used on scenarios where VC can not be calculate
+// such as: SSR environment and legacy browsers
+export class VCObserverNOOP {
+  start(startArg) {}
+  stop() {}
+  getVCRawData() {
+    return null;
+  }
+  getVCResult(param) {
+    return Promise.resolve({
+      'ufo:vc:noop': true
+    });
+  }
+  setSSRElement(element) {}
+  setReactRootRenderStart(startTime) {}
+  setReactRootRenderStop(stopTime) {}
+}

package/dist/es2019/vc/vc-observer/index.js

@@ -1,5 +1,6 @@
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import { fg } from '@atlaskit/platform-feature-flags';
+import { getPageVisibilityState } from '../../hidden-timing';
 import { attachAbortListeners } from './attachAbortListeners';
 import { getViewportHeight, getViewportWidth } from './getViewport';
 import { MultiRevisionHeatmap } from './heatmap/heatmap';
@@ -252,29 +253,31 @@ export class VCObserver {
       }
       const isVCClean = !abortReasonInfo;
       const isMultiHeatmapEnabled = !fg('platform_ufo_multiheatmap_killswitch');
+      const pageVisibilityUpToTTAI = getPageVisibilityState(start, stop);
+      const shouldHaveVCmetric = isVCClean && !isEventAborted && pageVisibilityUpToTTAI;
       const revisionsData = isMultiHeatmapEnabled ? fg('platform_ufo_vc_observer_new') ? {
         [`${fullPrefix}vc:rev`]: [{
           revision: 'fy25.01',
           clean: isVCClean,
-          'metric:vc90': VC['90'],
-          vcDetails: Object.fromEntries(VCObserver.VCParts.map(key => {
+          'metric:vc90': shouldHaveVCmetric ? VC['90'] : null,
+          vcDetails: shouldHaveVCmetric ? Object.fromEntries(VCObserver.VCParts.map(key => {
             var _VCBox$key;
             return [key, {
               t: VC[key],
               e: (_VCBox$key = VCBox[key]) !== null && _VCBox$key !== void 0 ? _VCBox$key : []
             }];
-          }))
+          })) : []
         }, {
           revision: 'fy25.02',
           clean: isVCClean,
-          'metric:vc90': vcNext.VC['90'],
-          vcDetails: Object.fromEntries(VCObserver.VCParts.map(key => {
+          'metric:vc90': shouldHaveVCmetric ? VC['90'] : null,
+          vcDetails: shouldHaveVCmetric ? Object.fromEntries(VCObserver.VCParts.map(key => {
             var _vcNext$VCBox$key;
             return [key, {
               t: vcNext.VC[key],
               e: (_vcNext$VCBox$key = vcNext.VCBox[key]) !== null && _vcNext$VCBox$key !== void 0 ? _vcNext$VCBox$key : []
             }];
-          }))
+          })) : []
         }]
       } : multiHeatmap !== null ? {
         [`${fullPrefix}vc:rev`]: multiHeatmap === null || multiHeatmap === void 0 ? void 0 : multiHeatmap.getPayloadShapedData({

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

@@ -172,7 +172,7 @@ var getLCP = function getLCP(end) {
       }
     });
     observer.observe({
-      type: "largest-contentful-paint",
+      type: 'largest-contentful-paint',
       buffered: true
     });
   });

package/dist/esm/vc/index.js

@@ -8,6 +8,7 @@ function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbol
 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 } from '../config';
+import { VCObserverNOOP } from './no-op-vc-observer';
 import { VCObserver } from './vc-observer';
 import VCObserverNew from './vc-observer-new';
 var VCObserverWrapper = /*#__PURE__*/function () {
@@ -15,7 +16,6 @@ var VCObserverWrapper = /*#__PURE__*/function () {
     var _getConfig;
     var opts = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
     _classCallCheck(this, VCObserverWrapper);
-    this.oldVCObserver = new VCObserver(opts);
     this.newVCObserver = null;
     var isNewVCObserverEnabled = fg('platform_ufo_vc_observer_new') || ((_getConfig = getConfig()) === null || _getConfig === void 0 || (_getConfig = _getConfig.vc) === null || _getConfig === void 0 ? void 0 : _getConfig.enableVCObserverNew);
     if (isNewVCObserverEnabled) {
@@ -23,6 +23,7 @@ var VCObserverWrapper = /*#__PURE__*/function () {
         selectorConfig: opts.selectorConfig
       });
     }
+    this.oldVCObserver = new VCObserver(opts);
   }
   return _createClass(VCObserverWrapper, [{
     key: "start",
@@ -106,10 +107,29 @@ var VCObserverWrapper = /*#__PURE__*/function () {
     }
   }]);
 }();
+var isReactSSR = Boolean(process.env.REACT_SSR);
+var isServer = Boolean(globalThis === null || globalThis === void 0 ? void 0 : globalThis.__SERVER__);
+function isEnvironmentSupported() {
+  // SSR environment aren't supported
+  if (isReactSSR || isServer) {
+    return false;
+  }
+
+  // Legacy browsers that doesn't support WeakRef
+  // aren't valid
+  if (typeof (globalThis === null || globalThis === void 0 ? void 0 : globalThis.WeakRef) !== 'function') {
+    return false;
+  }
+  if (typeof (globalThis === null || globalThis === void 0 ? void 0 : globalThis.MutationObserver) !== 'function' || typeof (globalThis === null || globalThis === void 0 ? void 0 : globalThis.IntersectionObserver) !== 'function' || typeof (globalThis === null || globalThis === void 0 ? void 0 : globalThis.PerformanceObserver) !== 'function') {
+    return false;
+  }
+  return true;
+}
 export var getVCObserver = function getVCObserver() {
   var opts = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
   if (!globalThis.__vcObserver) {
-    globalThis.__vcObserver = new VCObserverWrapper(opts);
+    var shouldMockVCObserver = !isEnvironmentSupported();
+    globalThis.__vcObserver = shouldMockVCObserver ? new VCObserverNOOP() : new VCObserverWrapper(opts);
   }
   return globalThis.__vcObserver;
 };

package/dist/esm/vc/no-op-vc-observer.js

@@ -0,0 +1,37 @@
+import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
+import _createClass from "@babel/runtime/helpers/createClass";
+// This class should be used on scenarios where VC can not be calculate
+// such as: SSR environment and legacy browsers
+export var VCObserverNOOP = /*#__PURE__*/function () {
+  function VCObserverNOOP() {
+    _classCallCheck(this, VCObserverNOOP);
+  }
+  return _createClass(VCObserverNOOP, [{
+    key: "start",
+    value: function start(startArg) {}
+  }, {
+    key: "stop",
+    value: function stop() {}
+  }, {
+    key: "getVCRawData",
+    value: function getVCRawData() {
+      return null;
+    }
+  }, {
+    key: "getVCResult",
+    value: function getVCResult(param) {
+      return Promise.resolve({
+        'ufo:vc:noop': true
+      });
+    }
+  }, {
+    key: "setSSRElement",
+    value: function setSSRElement(element) {}
+  }, {
+    key: "setReactRootRenderStart",
+    value: function setReactRootRenderStart(startTime) {}
+  }, {
+    key: "setReactRootRenderStop",
+    value: function setReactRootRenderStop(stopTime) {}
+  }]);
+}();

package/dist/esm/vc/vc-observer/index.js

@@ -10,6 +10,7 @@ import _regeneratorRuntime from "@babel/runtime/regenerator";
 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 { getPageVisibilityState } from '../../hidden-timing';
 import { attachAbortListeners } from './attachAbortListeners';
 import { getViewportHeight, getViewportWidth } from './getViewport';
 import { MultiRevisionHeatmap } from './heatmap/heatmap';
@@ -96,7 +97,7 @@ export var VCObserver = /*#__PURE__*/function () {
     });
     _defineProperty(this, "getVCResult", /*#__PURE__*/function () {
       var _ref4 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(_ref3) {
-        var start, stop, tti, prefix, ssr, vc, isEventAborted, startTime, fullPrefix, rawData, abortReason, abortReasonInfo, heatmap, heatmapNext, outOfBoundaryInfo, totalTime, componentsLog, viewport, devToolsEnabled, ratios, multiHeatmap, _VCObserver$calculate, VC, VCBox, VCEntries, totalPainted, _componentsLog, vcNext, outOfBoundary, stopTime, isVCClean, isMultiHeatmapEnabled, revisionsData, isCalcSpeedIndexEnabled, speedIndex;
+        var start, stop, tti, prefix, ssr, vc, isEventAborted, startTime, fullPrefix, rawData, abortReason, abortReasonInfo, heatmap, heatmapNext, outOfBoundaryInfo, totalTime, componentsLog, viewport, devToolsEnabled, ratios, multiHeatmap, _VCObserver$calculate, VC, VCBox, VCEntries, totalPainted, _componentsLog, vcNext, outOfBoundary, stopTime, isVCClean, isMultiHeatmapEnabled, pageVisibilityUpToTTAI, shouldHaveVCmetric, revisionsData, isCalcSpeedIndexEnabled, speedIndex;
         return _regeneratorRuntime.wrap(function _callee$(_context) {
           while (1) switch (_context.prev = _context.next) {
             case 0:
@@ -235,28 +236,30 @@ export var VCObserver = /*#__PURE__*/function () {
               }
               isVCClean = !abortReasonInfo;
               isMultiHeatmapEnabled = !fg('platform_ufo_multiheatmap_killswitch');
+              pageVisibilityUpToTTAI = getPageVisibilityState(start, stop);
+              shouldHaveVCmetric = isVCClean && !isEventAborted && pageVisibilityUpToTTAI;
               revisionsData = isMultiHeatmapEnabled ? fg('platform_ufo_vc_observer_new') ? _defineProperty({}, "".concat(fullPrefix, "vc:rev"), [{
                 revision: 'fy25.01',
                 clean: isVCClean,
-                'metric:vc90': VC['90'],
-                vcDetails: Object.fromEntries(VCObserver.VCParts.map(function (key) {
+                'metric:vc90': shouldHaveVCmetric ? VC['90'] : null,
+                vcDetails: shouldHaveVCmetric ? Object.fromEntries(VCObserver.VCParts.map(function (key) {
                   var _VCBox$key;
                   return [key, {
                     t: VC[key],
                     e: (_VCBox$key = VCBox[key]) !== null && _VCBox$key !== void 0 ? _VCBox$key : []
                   }];
-                }))
+                })) : []
               }, {
                 revision: 'fy25.02',
                 clean: isVCClean,
-                'metric:vc90': vcNext.VC['90'],
-                vcDetails: Object.fromEntries(VCObserver.VCParts.map(function (key) {
+                'metric:vc90': shouldHaveVCmetric ? VC['90'] : null,
+                vcDetails: shouldHaveVCmetric ? Object.fromEntries(VCObserver.VCParts.map(function (key) {
                   var _vcNext$VCBox$key;
                   return [key, {
                     t: vcNext.VC[key],
                     e: (_vcNext$VCBox$key = vcNext.VCBox[key]) !== null && _vcNext$VCBox$key !== void 0 ? _vcNext$VCBox$key : []
                   }];
-                }))
+                })) : []
               }]) : multiHeatmap !== null ? _defineProperty({}, "".concat(fullPrefix, "vc:rev"), multiHeatmap === null || multiHeatmap === void 0 ? void 0 : multiHeatmap.getPayloadShapedData({
                 VCParts: VCObserver.VCParts.map(function (v) {
                   return parseInt(v);
@@ -280,7 +283,7 @@ export var VCObserver = /*#__PURE__*/function () {
               return _context.abrupt("return", _objectSpread(_objectSpread(_objectSpread(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({
                 'metrics:vc': VC
               }, "".concat(fullPrefix, "vc:state"), true), "".concat(fullPrefix, "vc:clean"), isVCClean), "".concat(fullPrefix, "vc:dom"), VCBox), "".concat(fullPrefix, "vc:updates"), VCEntries.rel.slice(0, 50)), "".concat(fullPrefix, "vc:size"), viewport), "".concat(fullPrefix, "vc:time"), Math.round(totalTime + (stopTime - startTime))), "".concat(fullPrefix, "vc:total"), totalPainted), "".concat(fullPrefix, "vc:ratios"), ratios), outOfBoundary), {}, _defineProperty(_defineProperty(_defineProperty(_defineProperty({}, "".concat(fullPrefix, "vc:next"), vcNext.VC), "".concat(fullPrefix, "vc:next:updates"), vcNext.VCEntries.rel.slice(0, 50)), "".concat(fullPrefix, "vc:next:dom"), vcNext.VCBox), "".concat(fullPrefix, "vc:ignored"), _this.getIgnoredElements(componentsLog)), revisionsData), isCalcSpeedIndexEnabled ? speedIndex : {}));
-            case 25:
+            case 27:
             case "end":
               return _context.stop();
           }

package/dist/types/vc/no-op-vc-observer.d.ts

@@ -0,0 +1,13 @@
+import { VCResult } from '../common/vc/types';
+import type { GetVCResultType, VCObserverInterface } from './types';
+export declare class VCObserverNOOP implements VCObserverInterface {
+    start(startArg: {
+        startTime: number;
+    }): void;
+    stop(): void;
+    getVCRawData(): null;
+    getVCResult(param: GetVCResultType): Promise<VCResult>;
+    setSSRElement(element: HTMLElement): void;
+    setReactRootRenderStart(startTime: number): void;
+    setReactRootRenderStop(stopTime: number): void;
+}

package/dist/types-ts4.5/vc/no-op-vc-observer.d.ts

@@ -0,0 +1,13 @@
+import { VCResult } from '../common/vc/types';
+import type { GetVCResultType, VCObserverInterface } from './types';
+export declare class VCObserverNOOP implements VCObserverInterface {
+    start(startArg: {
+        startTime: number;
+    }): void;
+    stop(): void;
+    getVCRawData(): null;
+    getVCResult(param: GetVCResultType): Promise<VCResult>;
+    setSSRElement(element: HTMLElement): void;
+    setReactRootRenderStart(startTime: number): void;
+    setReactRootRenderStop(stopTime: number): void;
+}

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/react-ufo",
-	"version": "3.4.2",
+	"version": "3.4.3",
 	"description": "Parts of React UFO that are publicly available",
 	"author": "Atlassian Pty Ltd",
 	"license": "Apache-2.0",