@atlaskit/react-ufo 3.13.20 → 3.13.22

package/CHANGELOG.md

@@ -1,5 +1,21 @@
 # @atlaskit/ufo-interaction-ignore
 
+## 3.13.22
+
+### Patch Changes
+
+- [#169345](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/169345)
+  [`6fab3e0da9d68`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/6fab3e0da9d68) -
+  Added API to disable checks for size and position of SSR placeholders
+
+## 3.13.21
+
+### Patch Changes
+
+- [#169263](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/169263)
+  [`42bff795e359c`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/42bff795e359c) -
+  Add vc to interactions
+
 ## 3.13.20
 
 ### Patch Changes

package/dist/cjs/create-payload/utils/get-vc-metrics.js

@@ -34,30 +34,43 @@ function _getVCMetrics() {
           }
           return _context.abrupt("return", {});
         case 3:
+          if (!(0, _platformFeatureFlags.fg)('platform_ufo_enable_interactions_vc')) {
+            _context.next = 8;
+            break;
+          }
+          if (!(interaction.type !== 'page_load' && interaction.type !== 'transition' && interaction.type !== 'press')) {
+            _context.next = 6;
+            break;
+          }
+          return _context.abrupt("return", {});
+        case 6:
+          _context.next = 10;
+          break;
+        case 8:
           if (!(interaction.type !== 'page_load' && interaction.type !== 'transition')) {
-            _context.next = 5;
+            _context.next = 10;
             break;
           }
           return _context.abrupt("return", {});
-        case 5:
+        case 10:
           interactionStatus = (0, _getInteractionStatus.default)(interaction);
           pageVisibilityUpToTTAI = (0, _getPageVisibilityUpToTtai.default)(interaction);
           shouldReportVCMetrics = interactionStatus.originalInteractionStatus === 'SUCCEEDED' && pageVisibilityUpToTTAI === 'visible';
           if (!(!shouldReportVCMetrics && (0, _platformFeatureFlags.fg)('platform_ufo_no_vc_on_aborted'))) {
-            _context.next = 11;
+            _context.next = 16;
             break;
           }
           (0, _vc.getVCObserver)().stop(interaction.ufoName);
           return _context.abrupt("return", {});
-        case 11:
-          isSSREnabled = (config === null || config === void 0 ? void 0 : config.ssr) || (config === null || config === void 0 || (_config$vc$ssrWhiteli = config.vc.ssrWhitelist) === null || _config$vc$ssrWhiteli === void 0 ? void 0 : _config$vc$ssrWhiteli.includes(interaction.ufoName));
+        case 16:
+          isSSREnabled = interaction.type === 'page_load' && ((config === null || config === void 0 ? void 0 : config.ssr) || (config === null || config === void 0 || (_config$vc$ssrWhiteli = config.vc.ssrWhitelist) === null || _config$vc$ssrWhiteli === void 0 ? void 0 : _config$vc$ssrWhiteli.includes(interaction.ufoName)));
           ssr = interaction.type === 'page_load' && isSSREnabled ? {
             ssr: (0, _getSsrDoneTimeValue.default)(config)
           } : null;
           _interactionMetrics.postInteractionLog.setVCObserverSSRConfig(ssr);
           tti = (_interaction$apdex = interaction.apdex) === null || _interaction$apdex === void 0 || (_interaction$apdex = _interaction$apdex[0]) === null || _interaction$apdex === void 0 ? void 0 : _interaction$apdex.stopTime;
           prefix = 'ufo';
-          _context.next = 18;
+          _context.next = 23;
           return (0, _vc.getVCObserver)().getVCResult(_objectSpread({
             start: interaction.start,
             stop: interaction.end,
@@ -70,7 +83,7 @@ function _getVCMetrics() {
             interactionId: interaction.id,
             includeSSRRatio: (_config$vc3 = config.vc) === null || _config$vc3 === void 0 ? void 0 : _config$vc3.includeSSRRatio
           }, ssr));
-        case 18:
+        case 23:
           result = _context.sent;
           if ((_config$experimentalI = config.experimentalInteractionMetrics) !== null && _config$experimentalI !== void 0 && _config$experimentalI.enabled) {
             (0, _vc.getVCObserver)().stop(interaction.ufoName);
@@ -82,15 +95,15 @@ function _getVCMetrics() {
             return revision === mostRecentVCRevision;
           });
           if (!(!shouldReportVCMetrics || !(mostRecentVCRevisionPayload !== null && mostRecentVCRevisionPayload !== void 0 && mostRecentVCRevisionPayload.clean))) {
-            _context.next = 25;
+            _context.next = 30;
             break;
           }
           return _context.abrupt("return", result);
-        case 25:
+        case 30:
           return _context.abrupt("return", _objectSpread(_objectSpread({}, result), {}, {
             'metric:vc90': mostRecentVCRevisionPayload['metric:vc90']
           }));
-        case 26:
+        case 31:
         case "end":
           return _context.stop();
       }

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

@@ -856,6 +856,21 @@ function addNewInteraction(interactionId, ufoName, type, startTime, rate, labelS
       });
     }
   }
+  if (type === 'press' && (0, _platformFeatureFlags.fg)('platform_ufo_enable_interactions_vc')) {
+    var _getConfig13;
+    (0, _vc.getVCObserver)().start({
+      startTime: startTime,
+      experienceKey: ufoName
+    });
+    postInteractionLog.startVCObserver({
+      startTime: startTime
+    });
+    if ((_getConfig13 = (0, _config.getConfig)()) !== null && _getConfig13 !== void 0 && (_getConfig13 = _getConfig13.experimentalInteractionMetrics) !== null && _getConfig13 !== void 0 && _getConfig13.enabled) {
+      _createExperimentalInteractionMetricsPayload.experimentalVC.start({
+        startTime: startTime
+      });
+    }
+  }
 }
 function addBrowserMetricEvent(event) {
   var interaction = getActiveInteraction();

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

@@ -95,7 +95,8 @@ function init(analyticsWebClientAsync, config) {
       oldDomUpdates: config.vc.oldDomUpdates,
       devToolsEnabled: config.vc.devToolsEnabled,
       selectorConfig: config.vc.selectorConfig,
-      ssrEnablePageLayoutPlaceholder: config.vc.ssrEnablePageLayoutPlaceholder
+      ssrEnablePageLayoutPlaceholder: config.vc.ssrEnablePageLayoutPlaceholder,
+      disableSizeAndPositionCheck: config.vc.disableSizeAndPositionCheck
     };
     (0, _vc.getVCObserver)(vcOptions).start({
       startTime: 0

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

@@ -454,7 +454,8 @@ var VCObserver = exports.VCObserver = /*#__PURE__*/function () {
     this.arraySize = options.heatmapSize || 200;
     this.devToolsEnabled = options.devToolsEnabled || false;
     this.oldDomUpdatesEnabled = options.oldDomUpdates || false;
-    var ssrEnablePageLayoutPlaceholder = options.ssrEnablePageLayoutPlaceholder;
+    var ssrEnablePageLayoutPlaceholder = options.ssrEnablePageLayoutPlaceholder,
+      disableSizeAndPositionCheck = options.disableSizeAndPositionCheck;
     this.observers = new _observers.Observers({
       selectorConfig: options.selectorConfig || {
         id: false,
@@ -464,7 +465,8 @@ var VCObserver = exports.VCObserver = /*#__PURE__*/function () {
         dataVC: true
       },
       SSRConfig: {
-        enablePageLayoutPlaceholder: ssrEnablePageLayoutPlaceholder || false
+        enablePageLayoutPlaceholder: ssrEnablePageLayoutPlaceholder || false,
+        disableSizeAndPositionCheck: disableSizeAndPositionCheck
       }
     });
     this.heatmap = !(0, _config.isVCRevisionEnabled)('fy25.01') ? [] : this.getCleanHeatmap();

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

@@ -33,7 +33,8 @@ function isElementVisible(target) {
 var Observers = exports.Observers = /*#__PURE__*/function () {
   function Observers(opts) {
     var _this = this,
-      _opts$SSRConfig;
+      _opts$SSRConfig,
+      _opts$SSRConfig2;
     (0, _classCallCheck2.default)(this, Observers);
     (0, _defineProperty2.default)(this, "observedMutations", new WeakMap());
     (0, _defineProperty2.default)(this, "elementsInView", new Set());
@@ -73,7 +74,10 @@ var Observers = exports.Observers = /*#__PURE__*/function () {
     this.selectorConfig = _objectSpread(_objectSpread({}, this.selectorConfig), opts.selectorConfig);
     this.intersectionObserver = this.getIntersectionObserver();
     this.mutationObserver = this.getMutationObserver();
-    this.ssrPlaceholderHandler = new _ssrPlaceholders.SSRPlaceholderHandlers((_opts$SSRConfig = opts.SSRConfig) === null || _opts$SSRConfig === void 0 ? void 0 : _opts$SSRConfig.enablePageLayoutPlaceholder);
+    this.ssrPlaceholderHandler = new _ssrPlaceholders.SSRPlaceholderHandlers({
+      enablePageLayoutPlaceholder: (_opts$SSRConfig = opts.SSRConfig) === null || _opts$SSRConfig === void 0 ? void 0 : _opts$SSRConfig.enablePageLayoutPlaceholder,
+      disableSizeAndPositionCheck: (_opts$SSRConfig2 = opts.SSRConfig) === null || _opts$SSRConfig2 === void 0 ? void 0 : _opts$SSRConfig2.disableSizeAndPositionCheck
+    });
   }
   return (0, _createClass2.default)(Observers, [{
     key: "isBrowserSupported",

package/dist/cjs/vc/vc-observer/observers/ssr-placeholders/index.js

@@ -11,9 +11,15 @@ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/de
 var ANCESTOR_LOOKUP_LIMIT = 10;
 var PAGE_LAYOUT_ID = 'page-layout.root';
 var SSRPlaceholderHandlers = exports.SSRPlaceholderHandlers = /*#__PURE__*/function () {
-  function SSRPlaceholderHandlers() {
+  function SSRPlaceholderHandlers(_ref) {
     var _this = this;
-    var enablePageLayoutPlaceholder = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
+    var _ref$enablePageLayout = _ref.enablePageLayoutPlaceholder,
+      enablePageLayoutPlaceholder = _ref$enablePageLayout === void 0 ? false : _ref$enablePageLayout,
+      _ref$disableSizeAndPo = _ref.disableSizeAndPositionCheck,
+      disableSizeAndPositionCheck = _ref$disableSizeAndPo === void 0 ? {
+        v: false,
+        h: false
+      } : _ref$disableSizeAndPo;
     (0, _classCallCheck2.default)(this, SSRPlaceholderHandlers);
     (0, _defineProperty2.default)(this, "staticPlaceholders", new Map());
     (0, _defineProperty2.default)(this, "callbacks", new Map());
@@ -42,10 +48,10 @@ var SSRPlaceholderHandlers = exports.SSRPlaceholderHandlers = /*#__PURE__*/funct
       }
       return '';
     });
-    (0, _defineProperty2.default)(this, "intersectionObserverCallback", function (_ref) {
+    (0, _defineProperty2.default)(this, "intersectionObserverCallback", function (_ref2) {
       var _this$intersectionObs;
-      var target = _ref.target,
-        boundingClientRect = _ref.boundingClientRect;
+      var target = _ref2.target,
+        boundingClientRect = _ref2.boundingClientRect;
       (_this$intersectionObs = _this.intersectionObserver) === null || _this$intersectionObs === void 0 || _this$intersectionObs.unobserve(target);
       if (!(target instanceof HTMLElement)) {
         // impossible case - keep typescript healthy
@@ -102,6 +108,7 @@ var SSRPlaceholderHandlers = exports.SSRPlaceholderHandlers = /*#__PURE__*/funct
       });
     }
     this.enablePageLayoutPlaceholder = enablePageLayoutPlaceholder;
+    this.disableSizeAndPositionCheck = disableSizeAndPositionCheck;
     if (window.document) {
       try {
         var selector = this.enablePageLayoutPlaceholder ? '[data-ssr-placeholder],[data-testid="page-layout.root"]' : '[data-ssr-placeholder]';
@@ -223,7 +230,16 @@ var SSRPlaceholderHandlers = exports.SSRPlaceholderHandlers = /*#__PURE__*/funct
   }, {
     key: "hasSameSizePosition",
     value: function hasSameSizePosition(rect, boundingClientRect) {
-      return rect && Math.abs(rect.x - boundingClientRect.x) < this.EQUALITY_THRESHOLD && Math.abs(rect.y - boundingClientRect.y) < this.EQUALITY_THRESHOLD && Math.abs(rect.width - boundingClientRect.width) < this.EQUALITY_THRESHOLD && Math.abs(rect.height - boundingClientRect.height) < this.EQUALITY_THRESHOLD || false;
+      var _this$disableSizeAndP, _this$disableSizeAndP2;
+      if ((_this$disableSizeAndP = this.disableSizeAndPositionCheck) !== null && _this$disableSizeAndP !== void 0 && _this$disableSizeAndP.v && (_this$disableSizeAndP2 = this.disableSizeAndPositionCheck) !== null && _this$disableSizeAndP2 !== void 0 && _this$disableSizeAndP2.h) {
+        return true;
+      }
+      if (!rect) {
+        return false;
+      }
+      var horizontalCheck = this.disableSizeAndPositionCheck.h ? true : Math.abs(rect.x - boundingClientRect.x) < this.EQUALITY_THRESHOLD && Math.abs(rect.width - boundingClientRect.width) < this.EQUALITY_THRESHOLD;
+      var verticalCheck = this.disableSizeAndPositionCheck.v ? true : Math.abs(rect.y - boundingClientRect.y) < this.EQUALITY_THRESHOLD && Math.abs(rect.height - boundingClientRect.height) < this.EQUALITY_THRESHOLD;
+      return horizontalCheck && verticalCheck || false;
     }
   }, {
     key: "isDummyRect",

package/dist/es2019/create-payload/utils/get-vc-metrics.js

@@ -11,8 +11,14 @@ async function getVCMetrics(interaction) {
   if (!(config !== null && config !== void 0 && (_config$vc = config.vc) !== null && _config$vc !== void 0 && _config$vc.enabled)) {
     return {};
   }
-  if (interaction.type !== 'page_load' && interaction.type !== 'transition') {
-    return {};
+  if (fg('platform_ufo_enable_interactions_vc')) {
+    if (interaction.type !== 'page_load' && interaction.type !== 'transition' && interaction.type !== 'press') {
+      return {};
+    }
+  } else {
+    if (interaction.type !== 'page_load' && interaction.type !== 'transition') {
+      return {};
+    }
   }
   const interactionStatus = getInteractionStatus(interaction);
   const pageVisibilityUpToTTAI = getPageVisibilityUpToTTAI(interaction);
@@ -21,7 +27,7 @@ async function getVCMetrics(interaction) {
     getVCObserver().stop(interaction.ufoName);
     return {};
   }
-  const isSSREnabled = (config === null || config === void 0 ? void 0 : config.ssr) || (config === null || config === void 0 ? void 0 : (_config$vc$ssrWhiteli = config.vc.ssrWhitelist) === null || _config$vc$ssrWhiteli === void 0 ? void 0 : _config$vc$ssrWhiteli.includes(interaction.ufoName));
+  const isSSREnabled = interaction.type === 'page_load' && ((config === null || config === void 0 ? void 0 : config.ssr) || (config === null || config === void 0 ? void 0 : (_config$vc$ssrWhiteli = config.vc.ssrWhitelist) === null || _config$vc$ssrWhiteli === void 0 ? void 0 : _config$vc$ssrWhiteli.includes(interaction.ufoName)));
   const ssr = interaction.type === 'page_load' && isSSREnabled ? {
     ssr: getSSRDoneTimeValue(config)
   } : null;

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

@@ -732,6 +732,21 @@ export function addNewInteraction(interactionId, ufoName, type, startTime, rate,
       });
     }
   }
+  if (type === 'press' && fg('platform_ufo_enable_interactions_vc')) {
+    var _getConfig13, _getConfig13$experime;
+    getVCObserver().start({
+      startTime,
+      experienceKey: ufoName
+    });
+    postInteractionLog.startVCObserver({
+      startTime
+    });
+    if ((_getConfig13 = getConfig()) !== null && _getConfig13 !== void 0 && (_getConfig13$experime = _getConfig13.experimentalInteractionMetrics) !== null && _getConfig13$experime !== void 0 && _getConfig13$experime.enabled) {
+      experimentalVC.start({
+        startTime
+      });
+    }
+  }
 }
 export function addBrowserMetricEvent(event) {
   const interaction = getActiveInteraction();

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

@@ -85,7 +85,8 @@ export function init(analyticsWebClientAsync, config) {
       oldDomUpdates: config.vc.oldDomUpdates,
       devToolsEnabled: config.vc.devToolsEnabled,
       selectorConfig: config.vc.selectorConfig,
-      ssrEnablePageLayoutPlaceholder: config.vc.ssrEnablePageLayoutPlaceholder
+      ssrEnablePageLayoutPlaceholder: config.vc.ssrEnablePageLayoutPlaceholder,
+      disableSizeAndPositionCheck: config.vc.disableSizeAndPositionCheck
     };
     getVCObserver(vcOptions).start({
       startTime: 0

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

@@ -494,7 +494,8 @@ export class VCObserver {
     this.devToolsEnabled = options.devToolsEnabled || false;
     this.oldDomUpdatesEnabled = options.oldDomUpdates || false;
     const {
-      ssrEnablePageLayoutPlaceholder
+      ssrEnablePageLayoutPlaceholder,
+      disableSizeAndPositionCheck
     } = options;
     this.observers = new Observers({
       selectorConfig: options.selectorConfig || {
@@ -505,7 +506,8 @@ export class VCObserver {
         dataVC: true
       },
       SSRConfig: {
-        enablePageLayoutPlaceholder: ssrEnablePageLayoutPlaceholder || false
+        enablePageLayoutPlaceholder: ssrEnablePageLayoutPlaceholder || false,
+        disableSizeAndPositionCheck: disableSizeAndPositionCheck
       }
     });
     this.heatmap = !isVCRevisionEnabled('fy25.01') ? [] : this.getCleanHeatmap();

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

@@ -21,7 +21,7 @@ function isElementVisible(target) {
 }
 export class Observers {
   constructor(opts) {
-    var _opts$SSRConfig;
+    var _opts$SSRConfig, _opts$SSRConfig2;
     _defineProperty(this, "observedMutations", new WeakMap());
     _defineProperty(this, "elementsInView", new Set());
     _defineProperty(this, "callbacks", new Set());
@@ -61,7 +61,10 @@ export class Observers {
     };
     this.intersectionObserver = this.getIntersectionObserver();
     this.mutationObserver = this.getMutationObserver();
-    this.ssrPlaceholderHandler = new SSRPlaceholderHandlers((_opts$SSRConfig = opts.SSRConfig) === null || _opts$SSRConfig === void 0 ? void 0 : _opts$SSRConfig.enablePageLayoutPlaceholder);
+    this.ssrPlaceholderHandler = new SSRPlaceholderHandlers({
+      enablePageLayoutPlaceholder: (_opts$SSRConfig = opts.SSRConfig) === null || _opts$SSRConfig === void 0 ? void 0 : _opts$SSRConfig.enablePageLayoutPlaceholder,
+      disableSizeAndPositionCheck: (_opts$SSRConfig2 = opts.SSRConfig) === null || _opts$SSRConfig2 === void 0 ? void 0 : _opts$SSRConfig2.disableSizeAndPositionCheck
+    });
   }
   isBrowserSupported() {
     return typeof window.IntersectionObserver === 'function' && typeof window.MutationObserver === 'function';

package/dist/es2019/vc/vc-observer/observers/ssr-placeholders/index.js

@@ -2,7 +2,13 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
 const ANCESTOR_LOOKUP_LIMIT = 10;
 const PAGE_LAYOUT_ID = 'page-layout.root';
 export class SSRPlaceholderHandlers {
-  constructor(enablePageLayoutPlaceholder = false) {
+  constructor({
+    enablePageLayoutPlaceholder = false,
+    disableSizeAndPositionCheck = {
+      v: false,
+      h: false
+    }
+  }) {
     _defineProperty(this, "staticPlaceholders", new Map());
     _defineProperty(this, "callbacks", new Map());
     _defineProperty(this, "getSizeCallbacks", new Map());
@@ -87,6 +93,7 @@ export class SSRPlaceholderHandlers {
       this.intersectionObserver = new IntersectionObserver(entries => entries.filter(entry => entry.intersectionRatio > 0).forEach(this.intersectionObserverCallback));
     }
     this.enablePageLayoutPlaceholder = enablePageLayoutPlaceholder;
+    this.disableSizeAndPositionCheck = disableSizeAndPositionCheck;
     if (window.document) {
       try {
         const selector = this.enablePageLayoutPlaceholder ? '[data-ssr-placeholder],[data-testid="page-layout.root"]' : '[data-ssr-placeholder]';
@@ -187,7 +194,16 @@ export class SSRPlaceholderHandlers {
     });
   }
   hasSameSizePosition(rect, boundingClientRect) {
-    return rect && Math.abs(rect.x - boundingClientRect.x) < this.EQUALITY_THRESHOLD && Math.abs(rect.y - boundingClientRect.y) < this.EQUALITY_THRESHOLD && Math.abs(rect.width - boundingClientRect.width) < this.EQUALITY_THRESHOLD && Math.abs(rect.height - boundingClientRect.height) < this.EQUALITY_THRESHOLD || false;
+    var _this$disableSizeAndP, _this$disableSizeAndP2;
+    if ((_this$disableSizeAndP = this.disableSizeAndPositionCheck) !== null && _this$disableSizeAndP !== void 0 && _this$disableSizeAndP.v && (_this$disableSizeAndP2 = this.disableSizeAndPositionCheck) !== null && _this$disableSizeAndP2 !== void 0 && _this$disableSizeAndP2.h) {
+      return true;
+    }
+    if (!rect) {
+      return false;
+    }
+    const horizontalCheck = this.disableSizeAndPositionCheck.h ? true : Math.abs(rect.x - boundingClientRect.x) < this.EQUALITY_THRESHOLD && Math.abs(rect.width - boundingClientRect.width) < this.EQUALITY_THRESHOLD;
+    const verticalCheck = this.disableSizeAndPositionCheck.v ? true : Math.abs(rect.y - boundingClientRect.y) < this.EQUALITY_THRESHOLD && Math.abs(rect.height - boundingClientRect.height) < this.EQUALITY_THRESHOLD;
+    return horizontalCheck && verticalCheck || false;
   }
   isDummyRect(rect) {
     return rect && rect.width < 0 && rect.height < 0 || false;

package/dist/esm/create-payload/utils/get-vc-metrics.js

@@ -27,30 +27,43 @@ function _getVCMetrics() {
           }
           return _context.abrupt("return", {});
         case 3:
+          if (!fg('platform_ufo_enable_interactions_vc')) {
+            _context.next = 8;
+            break;
+          }
+          if (!(interaction.type !== 'page_load' && interaction.type !== 'transition' && interaction.type !== 'press')) {
+            _context.next = 6;
+            break;
+          }
+          return _context.abrupt("return", {});
+        case 6:
+          _context.next = 10;
+          break;
+        case 8:
           if (!(interaction.type !== 'page_load' && interaction.type !== 'transition')) {
-            _context.next = 5;
+            _context.next = 10;
             break;
           }
           return _context.abrupt("return", {});
-        case 5:
+        case 10:
           interactionStatus = getInteractionStatus(interaction);
           pageVisibilityUpToTTAI = getPageVisibilityUpToTTAI(interaction);
           shouldReportVCMetrics = interactionStatus.originalInteractionStatus === 'SUCCEEDED' && pageVisibilityUpToTTAI === 'visible';
           if (!(!shouldReportVCMetrics && fg('platform_ufo_no_vc_on_aborted'))) {
-            _context.next = 11;
+            _context.next = 16;
             break;
           }
           getVCObserver().stop(interaction.ufoName);
           return _context.abrupt("return", {});
-        case 11:
-          isSSREnabled = (config === null || config === void 0 ? void 0 : config.ssr) || (config === null || config === void 0 || (_config$vc$ssrWhiteli = config.vc.ssrWhitelist) === null || _config$vc$ssrWhiteli === void 0 ? void 0 : _config$vc$ssrWhiteli.includes(interaction.ufoName));
+        case 16:
+          isSSREnabled = interaction.type === 'page_load' && ((config === null || config === void 0 ? void 0 : config.ssr) || (config === null || config === void 0 || (_config$vc$ssrWhiteli = config.vc.ssrWhitelist) === null || _config$vc$ssrWhiteli === void 0 ? void 0 : _config$vc$ssrWhiteli.includes(interaction.ufoName)));
           ssr = interaction.type === 'page_load' && isSSREnabled ? {
             ssr: getSSRDoneTimeValue(config)
           } : null;
           postInteractionLog.setVCObserverSSRConfig(ssr);
           tti = (_interaction$apdex = interaction.apdex) === null || _interaction$apdex === void 0 || (_interaction$apdex = _interaction$apdex[0]) === null || _interaction$apdex === void 0 ? void 0 : _interaction$apdex.stopTime;
           prefix = 'ufo';
-          _context.next = 18;
+          _context.next = 23;
           return getVCObserver().getVCResult(_objectSpread({
             start: interaction.start,
             stop: interaction.end,
@@ -63,7 +76,7 @@ function _getVCMetrics() {
             interactionId: interaction.id,
             includeSSRRatio: (_config$vc3 = config.vc) === null || _config$vc3 === void 0 ? void 0 : _config$vc3.includeSSRRatio
           }, ssr));
-        case 18:
+        case 23:
           result = _context.sent;
           if ((_config$experimentalI = config.experimentalInteractionMetrics) !== null && _config$experimentalI !== void 0 && _config$experimentalI.enabled) {
             getVCObserver().stop(interaction.ufoName);
@@ -75,15 +88,15 @@ function _getVCMetrics() {
             return revision === mostRecentVCRevision;
           });
           if (!(!shouldReportVCMetrics || !(mostRecentVCRevisionPayload !== null && mostRecentVCRevisionPayload !== void 0 && mostRecentVCRevisionPayload.clean))) {
-            _context.next = 25;
+            _context.next = 30;
             break;
           }
           return _context.abrupt("return", result);
-        case 25:
+        case 30:
           return _context.abrupt("return", _objectSpread(_objectSpread({}, result), {}, {
             'metric:vc90': mostRecentVCRevisionPayload['metric:vc90']
           }));
-        case 26:
+        case 31:
         case "end":
           return _context.stop();
       }

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

@@ -811,6 +811,21 @@ export function addNewInteraction(interactionId, ufoName, type, startTime, rate,
       });
     }
   }
+  if (type === 'press' && fg('platform_ufo_enable_interactions_vc')) {
+    var _getConfig13;
+    getVCObserver().start({
+      startTime: startTime,
+      experienceKey: ufoName
+    });
+    postInteractionLog.startVCObserver({
+      startTime: startTime
+    });
+    if ((_getConfig13 = getConfig()) !== null && _getConfig13 !== void 0 && (_getConfig13 = _getConfig13.experimentalInteractionMetrics) !== null && _getConfig13 !== void 0 && _getConfig13.enabled) {
+      experimentalVC.start({
+        startTime: startTime
+      });
+    }
+  }
 }
 export function addBrowserMetricEvent(event) {
   var interaction = getActiveInteraction();

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

@@ -86,7 +86,8 @@ export function init(analyticsWebClientAsync, config) {
       oldDomUpdates: config.vc.oldDomUpdates,
       devToolsEnabled: config.vc.devToolsEnabled,
       selectorConfig: config.vc.selectorConfig,
-      ssrEnablePageLayoutPlaceholder: config.vc.ssrEnablePageLayoutPlaceholder
+      ssrEnablePageLayoutPlaceholder: config.vc.ssrEnablePageLayoutPlaceholder,
+      disableSizeAndPositionCheck: config.vc.disableSizeAndPositionCheck
     };
     getVCObserver(vcOptions).start({
       startTime: 0

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

@@ -447,7 +447,8 @@ export var VCObserver = /*#__PURE__*/function () {
     this.arraySize = options.heatmapSize || 200;
     this.devToolsEnabled = options.devToolsEnabled || false;
     this.oldDomUpdatesEnabled = options.oldDomUpdates || false;
-    var ssrEnablePageLayoutPlaceholder = options.ssrEnablePageLayoutPlaceholder;
+    var ssrEnablePageLayoutPlaceholder = options.ssrEnablePageLayoutPlaceholder,
+      disableSizeAndPositionCheck = options.disableSizeAndPositionCheck;
     this.observers = new Observers({
       selectorConfig: options.selectorConfig || {
         id: false,
@@ -457,7 +458,8 @@ export var VCObserver = /*#__PURE__*/function () {
         dataVC: true
       },
       SSRConfig: {
-        enablePageLayoutPlaceholder: ssrEnablePageLayoutPlaceholder || false
+        enablePageLayoutPlaceholder: ssrEnablePageLayoutPlaceholder || false,
+        disableSizeAndPositionCheck: disableSizeAndPositionCheck
       }
     });
     this.heatmap = !isVCRevisionEnabled('fy25.01') ? [] : this.getCleanHeatmap();

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

@@ -26,7 +26,8 @@ function isElementVisible(target) {
 export var Observers = /*#__PURE__*/function () {
   function Observers(opts) {
     var _this = this,
-      _opts$SSRConfig;
+      _opts$SSRConfig,
+      _opts$SSRConfig2;
     _classCallCheck(this, Observers);
     _defineProperty(this, "observedMutations", new WeakMap());
     _defineProperty(this, "elementsInView", new Set());
@@ -66,7 +67,10 @@ export var Observers = /*#__PURE__*/function () {
     this.selectorConfig = _objectSpread(_objectSpread({}, this.selectorConfig), opts.selectorConfig);
     this.intersectionObserver = this.getIntersectionObserver();
     this.mutationObserver = this.getMutationObserver();
-    this.ssrPlaceholderHandler = new SSRPlaceholderHandlers((_opts$SSRConfig = opts.SSRConfig) === null || _opts$SSRConfig === void 0 ? void 0 : _opts$SSRConfig.enablePageLayoutPlaceholder);
+    this.ssrPlaceholderHandler = new SSRPlaceholderHandlers({
+      enablePageLayoutPlaceholder: (_opts$SSRConfig = opts.SSRConfig) === null || _opts$SSRConfig === void 0 ? void 0 : _opts$SSRConfig.enablePageLayoutPlaceholder,
+      disableSizeAndPositionCheck: (_opts$SSRConfig2 = opts.SSRConfig) === null || _opts$SSRConfig2 === void 0 ? void 0 : _opts$SSRConfig2.disableSizeAndPositionCheck
+    });
   }
   return _createClass(Observers, [{
     key: "isBrowserSupported",

package/dist/esm/vc/vc-observer/observers/ssr-placeholders/index.js

@@ -4,9 +4,15 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
 var ANCESTOR_LOOKUP_LIMIT = 10;
 var PAGE_LAYOUT_ID = 'page-layout.root';
 export var SSRPlaceholderHandlers = /*#__PURE__*/function () {
-  function SSRPlaceholderHandlers() {
+  function SSRPlaceholderHandlers(_ref) {
     var _this = this;
-    var enablePageLayoutPlaceholder = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
+    var _ref$enablePageLayout = _ref.enablePageLayoutPlaceholder,
+      enablePageLayoutPlaceholder = _ref$enablePageLayout === void 0 ? false : _ref$enablePageLayout,
+      _ref$disableSizeAndPo = _ref.disableSizeAndPositionCheck,
+      disableSizeAndPositionCheck = _ref$disableSizeAndPo === void 0 ? {
+        v: false,
+        h: false
+      } : _ref$disableSizeAndPo;
     _classCallCheck(this, SSRPlaceholderHandlers);
     _defineProperty(this, "staticPlaceholders", new Map());
     _defineProperty(this, "callbacks", new Map());
@@ -35,10 +41,10 @@ export var SSRPlaceholderHandlers = /*#__PURE__*/function () {
       }
       return '';
     });
-    _defineProperty(this, "intersectionObserverCallback", function (_ref) {
+    _defineProperty(this, "intersectionObserverCallback", function (_ref2) {
       var _this$intersectionObs;
-      var target = _ref.target,
-        boundingClientRect = _ref.boundingClientRect;
+      var target = _ref2.target,
+        boundingClientRect = _ref2.boundingClientRect;
       (_this$intersectionObs = _this.intersectionObserver) === null || _this$intersectionObs === void 0 || _this$intersectionObs.unobserve(target);
       if (!(target instanceof HTMLElement)) {
         // impossible case - keep typescript healthy
@@ -95,6 +101,7 @@ export var SSRPlaceholderHandlers = /*#__PURE__*/function () {
       });
     }
     this.enablePageLayoutPlaceholder = enablePageLayoutPlaceholder;
+    this.disableSizeAndPositionCheck = disableSizeAndPositionCheck;
     if (window.document) {
       try {
         var selector = this.enablePageLayoutPlaceholder ? '[data-ssr-placeholder],[data-testid="page-layout.root"]' : '[data-ssr-placeholder]';
@@ -216,7 +223,16 @@ export var SSRPlaceholderHandlers = /*#__PURE__*/function () {
   }, {
     key: "hasSameSizePosition",
     value: function hasSameSizePosition(rect, boundingClientRect) {
-      return rect && Math.abs(rect.x - boundingClientRect.x) < this.EQUALITY_THRESHOLD && Math.abs(rect.y - boundingClientRect.y) < this.EQUALITY_THRESHOLD && Math.abs(rect.width - boundingClientRect.width) < this.EQUALITY_THRESHOLD && Math.abs(rect.height - boundingClientRect.height) < this.EQUALITY_THRESHOLD || false;
+      var _this$disableSizeAndP, _this$disableSizeAndP2;
+      if ((_this$disableSizeAndP = this.disableSizeAndPositionCheck) !== null && _this$disableSizeAndP !== void 0 && _this$disableSizeAndP.v && (_this$disableSizeAndP2 = this.disableSizeAndPositionCheck) !== null && _this$disableSizeAndP2 !== void 0 && _this$disableSizeAndP2.h) {
+        return true;
+      }
+      if (!rect) {
+        return false;
+      }
+      var horizontalCheck = this.disableSizeAndPositionCheck.h ? true : Math.abs(rect.x - boundingClientRect.x) < this.EQUALITY_THRESHOLD && Math.abs(rect.width - boundingClientRect.width) < this.EQUALITY_THRESHOLD;
+      var verticalCheck = this.disableSizeAndPositionCheck.v ? true : Math.abs(rect.y - boundingClientRect.y) < this.EQUALITY_THRESHOLD && Math.abs(rect.height - boundingClientRect.height) < this.EQUALITY_THRESHOLD;
+      return horizontalCheck && verticalCheck || false;
     }
   }, {
     key: "isDummyRect",

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

@@ -74,6 +74,10 @@ export type Config = {
         readonly ssr?: boolean;
         readonly ssrWhitelist?: string[];
         readonly ssrEnablePageLayoutPlaceholder?: boolean;
+        readonly disableSizeAndPositionCheck?: {
+            v: boolean;
+            h: boolean;
+        };
         readonly includeSSRInV3?: boolean;
         readonly stopVCAtInteractionFinish?: boolean;
         readonly includeSSRRatio?: boolean;

package/dist/types/vc/types.d.ts

@@ -26,6 +26,10 @@ export type VCObserverOptions = {
     selectorConfig?: SelectorConfig | undefined;
     isPostInteraction?: boolean;
     ssrEnablePageLayoutPlaceholder?: boolean;
+    disableSizeAndPositionCheck?: {
+        v: boolean;
+        h: boolean;
+    };
 };
 export interface VCObserverInterface {
     start(startArg: {

package/dist/types/vc/vc-observer/observers/index.d.ts

@@ -11,6 +11,10 @@ type ConstructorOptions = {
     selectorConfig: SelectorConfig;
     SSRConfig?: {
         enablePageLayoutPlaceholder: boolean;
+        disableSizeAndPositionCheck?: {
+            v: boolean;
+            h: boolean;
+        };
     };
 };
 export declare class Observers implements BrowserObservers {

package/dist/types/vc/vc-observer/observers/ssr-placeholders/index.d.ts

@@ -4,6 +4,14 @@ type Rect = {
     width: number;
     height: number;
 };
+type DisableSizeAndPositionCheckType = {
+    v: boolean;
+    h: boolean;
+};
+type SSRPlaceholderHandlersConfig = {
+    enablePageLayoutPlaceholder?: boolean;
+    disableSizeAndPositionCheck?: DisableSizeAndPositionCheckType;
+};
 export declare class SSRPlaceholderHandlers {
     private staticPlaceholders;
     private callbacks;
@@ -12,7 +20,8 @@ export declare class SSRPlaceholderHandlers {
     private intersectionObserver;
     private EQUALITY_THRESHOLD;
     private enablePageLayoutPlaceholder;
-    constructor(enablePageLayoutPlaceholder?: boolean);
+    private disableSizeAndPositionCheck;
+    constructor({ enablePageLayoutPlaceholder, disableSizeAndPositionCheck }: SSRPlaceholderHandlersConfig);
     private getPlaceholderId;
     private getPlaceholderReplacementId;
     clear(): void;

package/dist/types-ts4.5/config/index.d.ts

@@ -74,6 +74,10 @@ export type Config = {
         readonly ssr?: boolean;
         readonly ssrWhitelist?: string[];
         readonly ssrEnablePageLayoutPlaceholder?: boolean;
+        readonly disableSizeAndPositionCheck?: {
+            v: boolean;
+            h: boolean;
+        };
         readonly includeSSRInV3?: boolean;
         readonly stopVCAtInteractionFinish?: boolean;
         readonly includeSSRRatio?: boolean;

package/dist/types-ts4.5/vc/types.d.ts

@@ -26,6 +26,10 @@ export type VCObserverOptions = {
     selectorConfig?: SelectorConfig | undefined;
     isPostInteraction?: boolean;
     ssrEnablePageLayoutPlaceholder?: boolean;
+    disableSizeAndPositionCheck?: {
+        v: boolean;
+        h: boolean;
+    };
 };
 export interface VCObserverInterface {
     start(startArg: {

package/dist/types-ts4.5/vc/vc-observer/observers/index.d.ts

@@ -11,6 +11,10 @@ type ConstructorOptions = {
     selectorConfig: SelectorConfig;
     SSRConfig?: {
         enablePageLayoutPlaceholder: boolean;
+        disableSizeAndPositionCheck?: {
+            v: boolean;
+            h: boolean;
+        };
     };
 };
 export declare class Observers implements BrowserObservers {

package/dist/types-ts4.5/vc/vc-observer/observers/ssr-placeholders/index.d.ts

@@ -4,6 +4,14 @@ type Rect = {
     width: number;
     height: number;
 };
+type DisableSizeAndPositionCheckType = {
+    v: boolean;
+    h: boolean;
+};
+type SSRPlaceholderHandlersConfig = {
+    enablePageLayoutPlaceholder?: boolean;
+    disableSizeAndPositionCheck?: DisableSizeAndPositionCheckType;
+};
 export declare class SSRPlaceholderHandlers {
     private staticPlaceholders;
     private callbacks;
@@ -12,7 +20,8 @@ export declare class SSRPlaceholderHandlers {
     private intersectionObserver;
     private EQUALITY_THRESHOLD;
     private enablePageLayoutPlaceholder;
-    constructor(enablePageLayoutPlaceholder?: boolean);
+    private disableSizeAndPositionCheck;
+    constructor({ enablePageLayoutPlaceholder, disableSizeAndPositionCheck }: SSRPlaceholderHandlersConfig);
     private getPlaceholderId;
     private getPlaceholderReplacementId;
     clear(): void;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/react-ufo",
-	"version": "3.13.20",
+	"version": "3.13.22",
 	"description": "Parts of React UFO that are publicly available",
 	"author": "Atlassian Pty Ltd",
 	"license": "Apache-2.0",
@@ -171,6 +171,9 @@
 		},
 		"platform_ufo_timeout_simplification": {
 			"type": "boolean"
+		},
+		"platform_ufo_enable_interactions_vc": {
+			"type": "boolean"
 		}
 	}
 }