@atlaskit/react-ufo 4.4.2 → 4.4.4

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

@@ -20,12 +20,14 @@ import { allFeatureFlagsAccessed, currentFeatureFlagsAccessed } from '../feature
 import { getInteractionId } from '../interaction-id-context';
 import { newVCObserver } from '../vc';
 import { interactions } from './common/constants';
+import InteractionExtraMetrics from './interaction-extra-metrics';
 import PostInteractionLog from './post-interaction-log';
 var PreviousInteractionLog = {
   name: undefined,
   isAborted: undefined
 };
 export var postInteractionLog = new PostInteractionLog();
+export var interactionExtraMetrics = new InteractionExtraMetrics();
 var interactionQueue = [];
 var segmentCache = new Map();
 export var segmentUnmountCache = new Map(); // Temporarily store segment unmount counts
@@ -192,23 +194,16 @@ export function addCustomTiming(interactionId, labelStack, data) {
           endTime = timingData.endTime;
         try {
           // for Firefox 102 and older
-          if (fg('ufo_chrome_devtools_uplift')) {
-            performance.measure("\uD83D\uDEF8 ".concat(labelStackToString(labelStack, key), " [custom_timing]"), {
-              start: startTime,
-              end: endTime,
-              detail: {
-                devtools: {
-                  track: '🛸 reactUFO detailed timings',
-                  color: 'tertiary-light'
-                }
+          performance.measure("\uD83D\uDEF8 ".concat(labelStackToString(labelStack, key), " [custom_timing]"), {
+            start: startTime,
+            end: endTime,
+            detail: {
+              devtools: {
+                track: '🛸 reactUFO detailed timings',
+                color: 'tertiary-light'
               }
-            });
-          } else {
-            performance.measure("\uD83D\uDEF8 ".concat(labelStackToString(labelStack, key), " [custom_timing]"), {
-              start: startTime,
-              end: endTime
-            });
-          }
+            }
+          });
         } catch (e) {
           // do nothing
         }
@@ -265,23 +260,16 @@ export function addSpan(interactionId, type, name, labelStack, start) {
     if (isPerformanceTracingEnabled()) {
       try {
         // for Firefox 102 and older
-        if (fg('ufo_chrome_devtools_uplift')) {
-          performance.measure("\uD83D\uDEF8 ".concat(labelStackToString(labelStack, name), " [").concat(type, "]"), {
-            start: start,
-            end: end,
-            detail: {
-              devtools: {
-                track: '🛸 reactUFO detailed timings',
-                color: 'secondary'
-              }
+        performance.measure("\uD83D\uDEF8 ".concat(labelStackToString(labelStack, name), " [").concat(type, "]"), {
+          start: start,
+          end: end,
+          detail: {
+            devtools: {
+              track: '🛸 reactUFO detailed timings',
+              color: 'secondary'
             }
-          });
-        } else {
-          performance.measure("\uD83D\uDEF8 ".concat(labelStackToString(labelStack, name), " [").concat(type, "]"), {
-            start: start,
-            end: end
-          });
-        }
+          }
+        });
       } catch (e) {
         // do nothing
       }
@@ -304,23 +292,16 @@ export function addSpanToAll(type, name, labelStack, start) {
   if (isPerformanceTracingEnabled()) {
     try {
       // for Firefox 102 and older
-      if (fg('ufo_chrome_devtools_uplift')) {
-        performance.measure("\uD83D\uDEF8 ".concat(labelStackToString(labelStack, name), " [").concat(type, "]"), {
-          start: start,
-          end: end,
-          detail: {
-            devtools: {
-              track: '🛸 reactUFO detailed timings',
-              color: 'secondary'
-            }
+      performance.measure("\uD83D\uDEF8 ".concat(labelStackToString(labelStack, name), " [").concat(type, "]"), {
+        start: start,
+        end: end,
+        detail: {
+          devtools: {
+            track: '🛸 reactUFO detailed timings',
+            color: 'secondary'
           }
-        });
-      } else {
-        performance.measure("\uD83D\uDEF8 ".concat(labelStackToString(labelStack, name), " [").concat(type, "]"), {
-          start: start,
-          end: end
-        });
-      }
+        }
+      });
     } catch (e) {
       // do nothing
     }
@@ -358,46 +339,58 @@ export function addHold(interactionId, labelStack, name, experimental) {
   var interaction = interactions.get(interactionId);
   var id = createUUID();
   if (interaction != null) {
-    var _getConfig2;
     var start = performance.now();
     var holdActive = {
       labelStack: labelStack,
       name: name,
       start: start
     };
-    if ((_getConfig2 = getConfig()) !== null && _getConfig2 !== void 0 && (_getConfig2 = _getConfig2.experimentalInteractionMetrics) !== null && _getConfig2 !== void 0 && _getConfig2.enabled && experimental) {
-      interaction.holdExpActive.set(id, _objectSpread(_objectSpread({}, holdActive), {}, {
-        start: start
-      }));
-    }
-    if (!experimental) {
-      interaction.holdActive.set(id, _objectSpread(_objectSpread({}, holdActive), {}, {
-        start: start
-      }));
+    if (fg('platform_ufo_enable_ttai_with_3p')) {
+      var is3pHold = labelStack.some(function (l) {
+        return 'type' in l && l.type === 'third-party';
+      });
+      if (is3pHold) {
+        if (!interaction.hold3pActive) {
+          interaction.hold3pActive = new Map();
+        }
+        interaction.hold3pActive.set(id, _objectSpread(_objectSpread({}, holdActive), {}, {
+          start: start
+        }));
+      } else {
+        interaction.holdActive.set(id, _objectSpread(_objectSpread({}, holdActive), {}, {
+          start: start
+        }));
+        addHoldCriterion(id, labelStack, name, start);
+      }
+    } else {
+      var _getConfig2;
+      if ((_getConfig2 = getConfig()) !== null && _getConfig2 !== void 0 && (_getConfig2 = _getConfig2.experimentalInteractionMetrics) !== null && _getConfig2 !== void 0 && _getConfig2.enabled && experimental) {
+        interaction.holdExpActive.set(id, _objectSpread(_objectSpread({}, holdActive), {}, {
+          start: start
+        }));
+      }
+      if (!experimental) {
+        interaction.holdActive.set(id, _objectSpread(_objectSpread({}, holdActive), {}, {
+          start: start
+        }));
+      }
+      addHoldCriterion(id, labelStack, name, start);
     }
-    addHoldCriterion(id, labelStack, name, start);
     return function () {
       var end = performance.now();
       if (isPerformanceTracingEnabled()) {
         try {
           // for Firefox 102 and older
-          if (fg('ufo_chrome_devtools_uplift')) {
-            performance.measure("\uD83D\uDEF8 ".concat(labelStackToString(labelStack, name), " [hold]"), {
-              start: start,
-              end: end,
-              detail: {
-                devtools: {
-                  track: '🛸 reactUFO detailed timings',
-                  color: 'secondary-light'
-                }
+          performance.measure("\uD83D\uDEF8 ".concat(labelStackToString(labelStack, name), " [hold]"), {
+            start: start,
+            end: end,
+            detail: {
+              devtools: {
+                track: '🛸 reactUFO detailed timings',
+                color: 'secondary-light'
               }
-            });
-          } else {
-            performance.measure("\uD83D\uDEF8 ".concat(labelStackToString(labelStack, name), " [hold]"), {
-              start: start,
-              end: end
-            });
-          }
+            }
+          });
         } catch (e) {
           // do nothing
         }
@@ -419,6 +412,20 @@ export function addHold(interactionId, labelStack, name, experimental) {
           }));
           interaction.holdExpActive.delete(id);
         }
+        if (fg('platform_ufo_enable_ttai_with_3p')) {
+          if (interaction.hold3pActive) {
+            var current3pHold = interaction.hold3pActive.get(id);
+            if (current3pHold != null) {
+              if (!currentInteraction.hold3pInfo) {
+                currentInteraction.hold3pInfo = [];
+              }
+              currentInteraction.hold3pInfo.push(_objectSpread(_objectSpread({}, current3pHold), {}, {
+                end: end
+              }));
+              interaction.hold3pActive.delete(id);
+            }
+          }
+        }
       }
     };
   }
@@ -428,13 +435,38 @@ export function addHoldByID(interactionId, labelStack, name, id, ignoreOnSubmit)
   var interaction = interactions.get(interactionId);
   if (interaction != null) {
     var start = performance.now();
-    interaction.holdActive.set(id, {
-      labelStack: labelStack,
-      name: name,
-      start: start,
-      ignoreOnSubmit: ignoreOnSubmit
-    });
-    addHoldCriterion(id, labelStack, name, start);
+    if (fg('platform_ufo_enable_ttai_with_3p')) {
+      var is3pHold = labelStack.some(function (l) {
+        return 'type' in l && l.type === 'third-party';
+      });
+      if (is3pHold) {
+        if (!interaction.hold3pActive) {
+          interaction.hold3pActive = new Map();
+        }
+        interaction.hold3pActive.set(id, {
+          labelStack: labelStack,
+          name: name,
+          start: start,
+          ignoreOnSubmit: ignoreOnSubmit
+        });
+      } else {
+        interaction.holdActive.set(id, {
+          labelStack: labelStack,
+          name: name,
+          start: start,
+          ignoreOnSubmit: ignoreOnSubmit
+        });
+        addHoldCriterion(id, labelStack, name, start);
+      }
+    } else {
+      interaction.holdActive.set(id, {
+        labelStack: labelStack,
+        name: name,
+        start: start,
+        ignoreOnSubmit: ignoreOnSubmit
+      });
+      addHoldCriterion(id, labelStack, name, start);
+    }
   }
   return function () {};
 }
@@ -451,6 +483,20 @@ export function removeHoldByID(interactionId, id) {
       interaction.holdActive.delete(id);
       removeHoldCriterion(id);
     }
+    if (fg('platform_ufo_enable_ttai_with_3p')) {
+      if (interaction.hold3pActive) {
+        var current3pHold = interaction.hold3pActive.get(id);
+        if (currentInteraction != null && current3pHold != null) {
+          if (!currentInteraction.hold3pInfo) {
+            currentInteraction.hold3pInfo = [];
+          }
+          currentInteraction.hold3pInfo.push(_objectSpread(_objectSpread({}, current3pHold), {}, {
+            end: end
+          }));
+          interaction.hold3pActive.delete(id);
+        }
+      }
+    }
   }
 }
 export function getCurrentInteractionType(interactionId) {
@@ -524,23 +570,16 @@ export function addProfilerTimings(interactionId, labelStack, type, actualDurati
   if (isPerformanceTracingEnabled()) {
     try {
       // for Firefox 102 and older
-      if (fg('ufo_chrome_devtools_uplift')) {
-        performance.measure("\uD83D\uDEF8 ".concat(labelStackToString(labelStack), " [react-profiler] ").concat(type), {
-          start: startTime,
-          duration: actualDuration,
-          detail: {
-            devtools: {
-              track: '🛸 reactUFO detailed timings',
-              color: 'secondary-dark'
-            }
+      performance.measure("\uD83D\uDEF8 ".concat(labelStackToString(labelStack), " [react-profiler] ").concat(type), {
+        start: startTime,
+        duration: actualDuration,
+        detail: {
+          devtools: {
+            track: '🛸 reactUFO detailed timings',
+            color: 'secondary-dark'
           }
-        });
-      } else {
-        performance.measure("\uD83D\uDEF8 ".concat(labelStackToString(labelStack), " [react-profiler] ").concat(type), {
-          start: startTime,
-          duration: actualDuration
-        });
-      }
+        }
+      });
     } catch (e) {
       // do nothing
     }
@@ -572,38 +611,30 @@ function callCleanUpCallbacks(interaction) {
   });
 }
 function finishInteraction(id, data) {
-  var _getConfig4, _getConfig5;
+  var _getConfig4;
   var endTime = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : performance.now();
   data.end = endTime;
   try {
     // for Firefox 102 and older
-
-    if (fg('ufo_chrome_devtools_uplift')) {
-      performance.measure("\uD83D\uDEF8 [".concat(data.type, "] ").concat(data.ufoName, " [ttai]"), {
-        start: data.start,
-        end: data.end,
-        detail: {
-          devtools: {
-            track: 'main metrics',
-            trackGroup: '🛸 reactUFO metrics',
-            color: 'tertiary'
-          }
+    performance.measure("\uD83D\uDEF8 [".concat(data.type, "] ").concat(data.ufoName, " [ttai]"), {
+      start: data.start,
+      end: data.end,
+      detail: {
+        devtools: {
+          track: 'main metrics',
+          trackGroup: '🛸 reactUFO metrics',
+          color: 'tertiary'
         }
-      });
-      performance.mark("TTAI", {
-        startTime: data.end,
-        detail: {
-          devtools: {
-            dataType: 'marker'
-          }
+      }
+    });
+    performance.mark("TTAI", {
+      startTime: data.end,
+      detail: {
+        devtools: {
+          dataType: 'marker'
         }
-      });
-    } else {
-      performance.measure("\uD83D\uDEF8 [".concat(data.type, "] ").concat(data.ufoName, " [ttai]"), {
-        start: data.start,
-        end: data.end
-      });
-    }
+      }
+    });
   } catch (e) {
     // do nothing
   }
@@ -632,13 +663,31 @@ function finishInteraction(id, data) {
       postInteractionLog.stopVCObserver();
     }
   }
-  if (!((_getConfig5 = getConfig()) !== null && _getConfig5 !== void 0 && (_getConfig5 = _getConfig5.experimentalInteractionMetrics) !== null && _getConfig5 !== void 0 && _getConfig5.enabled)) {
-    remove(id);
+  if (fg('platform_ufo_enable_ttai_with_3p')) {
+    if (!data.hold3pActive || data.hold3pActive.size === 0) {
+      var _getConfig5;
+      if (!((_getConfig5 = getConfig()) !== null && _getConfig5 !== void 0 && (_getConfig5 = _getConfig5.experimentalInteractionMetrics) !== null && _getConfig5 !== void 0 && _getConfig5.enabled)) {
+        remove(id);
+      }
+      interactionExtraMetrics.stopVCObserver();
+    }
+  } else {
+    var _getConfig6;
+    if (!((_getConfig6 = getConfig()) !== null && _getConfig6 !== void 0 && (_getConfig6 = _getConfig6.experimentalInteractionMetrics) !== null && _getConfig6 !== void 0 && _getConfig6.enabled)) {
+      remove(id);
+    }
   }
   PreviousInteractionLog.name = data.ufoName || 'unknown';
   PreviousInteractionLog.isAborted = data.abortReason != null;
   if (data.ufoName) {
-    handleInteraction(id, data);
+    if (fg('platform_ufo_enable_ttai_with_3p')) {
+      if (interactionExtraMetrics.finishedInteractionId !== id) {
+        // If this same interaction was not already handled, handle it
+        handleInteraction(id, data);
+      }
+    } else {
+      handleInteraction(id, data);
+    }
   }
   if (isPerformanceTracingEnabled()) {
     var profilerTimingMap = new Map();
@@ -665,23 +714,16 @@ function finishInteraction(id, data) {
             labelStack = _step3$value$.labelStack,
             start = _step3$value$.start,
             end = _step3$value$.end;
-          if (fg('ufo_chrome_devtools_uplift')) {
-            performance.measure("\uD83D\uDEF8 ".concat(labelStackToString(labelStack), " [segment_ttai]"), {
-              start: start,
-              end: end,
-              detail: {
-                devtools: {
-                  track: '🛸 reactUFO detailed timings',
-                  color: 'secondary-dark'
-                }
+          performance.measure("\uD83D\uDEF8 ".concat(labelStackToString(labelStack), " [segment_ttai]"), {
+            start: start,
+            end: end,
+            detail: {
+              devtools: {
+                track: '🛸 reactUFO detailed timings',
+                color: 'secondary-dark'
               }
-            });
-          } else {
-            performance.measure("\uD83D\uDEF8 ".concat(labelStackToString(labelStack), " [segment_ttai]"), {
-              start: start,
-              end: end
-            });
-          }
+            }
+          });
         }
       } catch (err) {
         _iterator3.e(err);
@@ -723,16 +765,16 @@ export function tryComplete(interactionId, endTime) {
     var noMoreExpHolds = interaction.holdExpActive.size === 0;
     var postInteraction = /*#__PURE__*/function () {
       var _ref = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
-        var _getConfig6, _getConfig8;
-        var _getConfig7, experimentalVC90, experimentalTTAI, _yield$getExperimenta, start, end;
+        var _getConfig7;
+        var _getConfig8, experimentalVC90, experimentalTTAI, _yield$getExperimenta, start, end, _getConfig9, _getConfig0;
         return _regeneratorRuntime.wrap(function _callee$(_context) {
           while (1) switch (_context.prev = _context.next) {
             case 0:
-              if (!((_getConfig6 = getConfig()) !== null && _getConfig6 !== void 0 && (_getConfig6 = _getConfig6.postInteractionLog) !== null && _getConfig6 !== void 0 && _getConfig6.enabled)) {
+              if (!((_getConfig7 = getConfig()) !== null && _getConfig7 !== void 0 && (_getConfig7 = _getConfig7.postInteractionLog) !== null && _getConfig7 !== void 0 && _getConfig7.enabled)) {
                 _context.next = 17;
                 break;
               }
-              if (!((_getConfig7 = getConfig()) !== null && _getConfig7 !== void 0 && (_getConfig7 = _getConfig7.experimentalInteractionMetrics) !== null && _getConfig7 !== void 0 && _getConfig7.enabled)) {
+              if (!((_getConfig8 = getConfig()) !== null && _getConfig8 !== void 0 && (_getConfig8 = _getConfig8.experimentalInteractionMetrics) !== null && _getConfig8 !== void 0 && _getConfig8.enabled)) {
                 _context.next = 16;
                 break;
               }
@@ -766,8 +808,17 @@ export function tryComplete(interactionId, endTime) {
                 experimentalVC90: experimentalVC90
               }));
             case 17:
-              if ((_getConfig8 = getConfig()) !== null && _getConfig8 !== void 0 && (_getConfig8 = _getConfig8.experimentalInteractionMetrics) !== null && _getConfig8 !== void 0 && _getConfig8.enabled) {
-                remove(interactionId);
+              if (fg('platform_ufo_enable_ttai_with_3p')) {
+                if (interactionExtraMetrics.finishedInteractionId !== interactionId) {
+                  // If interactionExtraMetrics is not waiting for measuring this interaction
+                  if ((_getConfig9 = getConfig()) !== null && _getConfig9 !== void 0 && (_getConfig9 = _getConfig9.experimentalInteractionMetrics) !== null && _getConfig9 !== void 0 && _getConfig9.enabled) {
+                    remove(interactionId);
+                  }
+                }
+              } else {
+                if ((_getConfig0 = getConfig()) !== null && _getConfig0 !== void 0 && (_getConfig0 = _getConfig0.experimentalInteractionMetrics) !== null && _getConfig0 !== void 0 && _getConfig0.enabled) {
+                  remove(interactionId);
+                }
               }
               activeSubmitted = false;
             case 19:
@@ -780,17 +831,42 @@ export function tryComplete(interactionId, endTime) {
         return _ref.apply(this, arguments);
       };
     }();
-    if (noMoreActiveHolds) {
-      if (!activeSubmitted) {
-        finishInteraction(interactionId, interaction, endTime);
-        activeSubmitted = true;
+    if (fg('platform_ufo_enable_ttai_with_3p')) {
+      var _interaction$hold3pAc;
+      var noMoreActive3pHolds = ((_interaction$hold3pAc = interaction.hold3pActive) === null || _interaction$hold3pAc === void 0 ? void 0 : _interaction$hold3pAc.size) === 0 || interaction.hold3pActive === undefined;
+      if (noMoreActiveHolds) {
+        if (!activeSubmitted) {
+          finishInteraction(interactionId, interaction, endTime);
+          interactionExtraMetrics.updateFinishedInteractionId(interactionId);
+          activeSubmitted = true;
+        }
+        if (noMoreExpHolds) {
+          var _getConfig1;
+          if ((_getConfig1 = getConfig()) !== null && _getConfig1 !== void 0 && (_getConfig1 = _getConfig1.experimentalInteractionMetrics) !== null && _getConfig1 !== void 0 && _getConfig1.enabled) {
+            onExperimentalInteractionComplete(interactionId, interaction, endTime);
+          }
+          postInteraction();
+        }
+        if (noMoreActive3pHolds) {
+          var data = _objectSpread(_objectSpread({}, interaction), {}, {
+            end: endTime
+          });
+          interactionExtraMetrics.onInteractionComplete(interactionId, data);
+        }
       }
-      if (noMoreExpHolds) {
-        var _getConfig9;
-        if ((_getConfig9 = getConfig()) !== null && _getConfig9 !== void 0 && (_getConfig9 = _getConfig9.experimentalInteractionMetrics) !== null && _getConfig9 !== void 0 && _getConfig9.enabled) {
-          onExperimentalInteractionComplete(interactionId, interaction, endTime);
+    } else {
+      if (noMoreActiveHolds) {
+        if (!activeSubmitted) {
+          finishInteraction(interactionId, interaction, endTime);
+          activeSubmitted = true;
+        }
+        if (noMoreExpHolds) {
+          var _getConfig10;
+          if ((_getConfig10 = getConfig()) !== null && _getConfig10 !== void 0 && (_getConfig10 = _getConfig10.experimentalInteractionMetrics) !== null && _getConfig10 !== void 0 && _getConfig10.enabled) {
+            onExperimentalInteractionComplete(interactionId, interaction, endTime);
+          }
+          postInteraction();
         }
-        postInteraction();
       }
     }
   }
@@ -818,6 +894,11 @@ export function abort(interactionId, abortReason) {
     finishInteraction(interactionId, interaction);
     postInteractionLog.reset();
     postInteractionLog.stopVCObserver();
+    if (fg('platform_ufo_enable_ttai_with_3p')) {
+      interactionExtraMetrics.stopVCObserver();
+      interactionExtraMetrics.reset();
+      remove(interactionId);
+    }
     if (coinflip(getExperimentalInteractionRate(interaction.ufoName, interaction.type))) {
       onExperimentalInteractionComplete(interactionId, interaction);
       remove(interactionId);
@@ -843,6 +924,11 @@ export function abortByNewInteraction(interactionId, interactionName) {
     finishInteraction(interactionId, interaction);
     postInteractionLog.reset();
     postInteractionLog.stopVCObserver();
+    if (fg('platform_ufo_enable_ttai_with_3p')) {
+      interactionExtraMetrics.stopVCObserver();
+      interactionExtraMetrics.reset();
+      remove(interactionId);
+    }
     if (coinflip(getExperimentalInteractionRate(interaction.ufoName, interaction.type))) {
       onExperimentalInteractionComplete(interactionId, interaction);
       remove(interactionId);
@@ -872,6 +958,11 @@ export function abortAll(abortReason, abortedByInteractionName) {
     finishInteraction(interactionId, interaction);
     postInteractionLog.reset();
     postInteractionLog.stopVCObserver();
+    if (fg('platform_ufo_enable_ttai_with_3p')) {
+      interactionExtraMetrics.stopVCObserver();
+      interactionExtraMetrics.reset();
+      remove(interactionId);
+    }
     if (coinflip(getExperimentalInteractionRate(interaction.ufoName, interaction.type))) {
       onExperimentalInteractionComplete(interactionId, interaction);
       remove(interactionId);
@@ -969,7 +1060,9 @@ export function addNewInteraction(interactionId, ufoName, type, startTime, rate,
     timerID: timerID,
     changeTimeout: changeTimeout,
     trace: trace,
-    vcObserver: vcObserver
+    vcObserver: vcObserver,
+    hold3pActive: new Map(),
+    hold3pInfo: []
   };
   if (addFeatureFlagsToInteraction) {
     currentFeatureFlagsAccessed.clear();
@@ -1008,10 +1101,10 @@ export function addNewInteraction(interactionId, ufoName, type, startTime, rate,
       });
     }
     if (fg('platform_ufo_post_interaction_check_name')) {
-      var _getConfig0;
+      var _getConfig11;
       // Start post interaction observer for all if config is enabled
       // in case ufoName is updated at later time
-      if ((_getConfig0 = getConfig()) !== null && _getConfig0 !== void 0 && (_getConfig0 = _getConfig0.postInteractionLog) !== null && _getConfig0 !== void 0 && _getConfig0.enabled) {
+      if ((_getConfig11 = getConfig()) !== null && _getConfig11 !== void 0 && (_getConfig11 = _getConfig11.postInteractionLog) !== null && _getConfig11 !== void 0 && _getConfig11.enabled) {
         postInteractionLog.startVCObserver({
           startTime: startTime
         });
@@ -1028,6 +1121,11 @@ export function addNewInteraction(interactionId, ufoName, type, startTime, rate,
         startTime: startTime
       });
     }
+    if (fg('platform_ufo_enable_ttai_with_3p')) {
+      interactionExtraMetrics.startVCObserver({
+        startTime: startTime
+      }, interactionId);
+    }
   }
   if (type === 'press' && fg('platform_ufo_enable_vc_press_interactions')) {
     // Use per-interaction VC observer if available, otherwise fall back to global
@@ -1055,35 +1153,27 @@ export function addApdexToAll(apdex) {
   interactions.forEach(function (interaction, key) {
     interaction.apdex.push(apdex);
     try {
+      var _apdex$startTime;
       // for Firefox 102 and older
-      if (fg('ufo_chrome_devtools_uplift')) {
-        var _apdex$startTime;
-        performance.measure("\uD83D\uDEF8 ".concat(apdex.key, " [bm3_tti]"), {
-          start: (_apdex$startTime = apdex.startTime) !== null && _apdex$startTime !== void 0 ? _apdex$startTime : interaction.start,
-          end: apdex.stopTime,
-          detail: {
-            devtools: {
-              track: 'main metrics',
-              trackGroup: '🛸 reactUFO metrics',
-              color: 'primary-dark'
-            }
+      performance.measure("\uD83D\uDEF8 ".concat(apdex.key, " [bm3_tti]"), {
+        start: (_apdex$startTime = apdex.startTime) !== null && _apdex$startTime !== void 0 ? _apdex$startTime : interaction.start,
+        end: apdex.stopTime,
+        detail: {
+          devtools: {
+            track: 'main metrics',
+            trackGroup: '🛸 reactUFO metrics',
+            color: 'primary-dark'
           }
-        });
-        performance.mark("[bm3] TTI", {
-          startTime: apdex.stopTime,
-          detail: {
-            devtools: {
-              dataType: 'marker'
-            }
+        }
+      });
+      performance.mark("[bm3] TTI", {
+        startTime: apdex.stopTime,
+        detail: {
+          devtools: {
+            dataType: 'marker'
           }
-        });
-      } else {
-        var _apdex$startTime2;
-        performance.measure("\uD83D\uDEF8 ".concat(apdex.key, " [bm3_tti]"), {
-          start: (_apdex$startTime2 = apdex.startTime) !== null && _apdex$startTime2 !== void 0 ? _apdex$startTime2 : interaction.start,
-          end: apdex.stopTime
-        });
-      }
+        }
+      });
     } catch (e) {
       // do nothing
     }
@@ -1097,35 +1187,27 @@ export function addApdex(interactionId, apdexInfo) {
   if (interaction != null) {
     interaction.apdex.push(apdexInfo);
     try {
+      var _apdexInfo$startTime;
       // for Firefox 102 and older
-      if (fg('ufo_chrome_devtools_uplift')) {
-        var _apdexInfo$startTime;
-        performance.measure("\uD83D\uDEF8 ".concat(apdexInfo.key, " [bm3_tti]"), {
-          start: (_apdexInfo$startTime = apdexInfo.startTime) !== null && _apdexInfo$startTime !== void 0 ? _apdexInfo$startTime : interaction.start,
-          end: apdexInfo.stopTime,
-          detail: {
-            devtools: {
-              track: 'main metrics',
-              trackGroup: '🛸 reactUFO metrics',
-              color: 'primary-dark'
-            }
+      performance.measure("\uD83D\uDEF8 ".concat(apdexInfo.key, " [bm3_tti]"), {
+        start: (_apdexInfo$startTime = apdexInfo.startTime) !== null && _apdexInfo$startTime !== void 0 ? _apdexInfo$startTime : interaction.start,
+        end: apdexInfo.stopTime,
+        detail: {
+          devtools: {
+            track: 'main metrics',
+            trackGroup: '🛸 reactUFO metrics',
+            color: 'primary-dark'
           }
-        });
-        performance.mark("[bm3] TTI", {
-          startTime: apdexInfo.stopTime,
-          detail: {
-            devtools: {
-              dataType: 'marker'
-            }
+        }
+      });
+      performance.mark("[bm3] TTI", {
+        startTime: apdexInfo.stopTime,
+        detail: {
+          devtools: {
+            dataType: 'marker'
           }
-        });
-      } else {
-        var _apdexInfo$startTime2;
-        performance.measure("\uD83D\uDEF8 ".concat(apdexInfo.key, " [bm3_tti]"), {
-          start: (_apdexInfo$startTime2 = apdexInfo.startTime) !== null && _apdexInfo$startTime2 !== void 0 ? _apdexInfo$startTime2 : interaction.start,
-          end: apdexInfo.stopTime
-        });
-      }
+        }
+      });
     } catch (e) {
       // do nothing
     }
@@ -1192,26 +1274,18 @@ export function addRedirect(interactionId, fromUfoName, nextUfoName, nextRouteNa
     if (isPerformanceTracingEnabled()) {
       var prevRedirect = interaction.redirects.at(-2);
       try {
+        var _prevRedirect$time;
         // for Firefox 102 and older
-        if (fg('ufo_chrome_devtools_uplift')) {
-          var _prevRedirect$time;
-          performance.measure("\uD83D\uDEF8 ".concat(nextUfoName, " [redirect]"), {
-            start: (_prevRedirect$time = prevRedirect === null || prevRedirect === void 0 ? void 0 : prevRedirect.time) !== null && _prevRedirect$time !== void 0 ? _prevRedirect$time : interaction.start,
-            end: time,
-            detail: {
-              devtools: {
-                track: '🛸 reactUFO detailed timings',
-                color: 'tertiary'
-              }
+        performance.measure("\uD83D\uDEF8 ".concat(nextUfoName, " [redirect]"), {
+          start: (_prevRedirect$time = prevRedirect === null || prevRedirect === void 0 ? void 0 : prevRedirect.time) !== null && _prevRedirect$time !== void 0 ? _prevRedirect$time : interaction.start,
+          end: time,
+          detail: {
+            devtools: {
+              track: '🛸 reactUFO detailed timings',
+              color: 'tertiary'
             }
-          });
-        } else {
-          var _prevRedirect$time2;
-          performance.measure("\uD83D\uDEF8 ".concat(nextUfoName, " [redirect]"), {
-            start: (_prevRedirect$time2 = prevRedirect === null || prevRedirect === void 0 ? void 0 : prevRedirect.time) !== null && _prevRedirect$time2 !== void 0 ? _prevRedirect$time2 : interaction.start,
-            end: time
-          });
-        }
+          }
+        });
       } catch (e) {
         // do nothing
       }