@atlaskit/react-ufo 4.7.0 → 4.7.2

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

@@ -13,7 +13,7 @@ import { getBm3Timings } from '../custom-timings';
 import { getGlobalErrorCount } from '../global-error-handler';
 import { getPageVisibilityState } from '../hidden-timing';
 import * as initialPageLoadExtraTiming from '../initial-page-load-extra-timing';
-import { interactionSpans as atlaskitInteractionSpans, segmentUnmountCache } from '../interaction-metrics';
+import { interactionSpans as atlaskitInteractionSpans } from '../interaction-metrics';
 import { createMemoryStateReport, createPressureStateReport } from '../machine-utilisation';
 import * as resourceTiming from '../resource-timing';
 import { filterResourceTimings } from '../resource-timing/common/utils/resource-timing-buffer';
@@ -24,6 +24,7 @@ import { createCriticalMetricsPayloads } from './critical-metrics-payload';
 import { addPerformanceMeasures } from './utils/add-performance-measures';
 import { getBrowserMetadataToLegacyFormat } from './utils/get-browser-metadata';
 import getInteractionStatus from './utils/get-interaction-status';
+import { getMoreAccuratePageVisibilityUpToTTAI } from './utils/get-more-accurate-page-visibility-up-to-ttai';
 import { getNavigationMetricsToLegacyFormat } from './utils/get-navigation-metrics';
 import getPageVisibilityUpToTTAI from './utils/get-page-visibility-up-to-ttai';
 import { getPaintMetricsToLegacyFormat } from './utils/get-paint-metrics';
@@ -33,6 +34,14 @@ import getSSRDoneTimeValue from './utils/get-ssr-done-time-value';
 import getSSRSuccessUtil from './utils/get-ssr-success';
 import getTTAI from './utils/get-ttai';
 import getVCMetrics from './utils/get-vc-metrics';
+import { getVisibilityStateFromPerformance } from './utils/get-visibility-state-from-performance';
+import { optimizeApdex } from './utils/optimize-apdex';
+import { optimizeCustomTimings } from './utils/optimize-custom-timings';
+import { optimizeHoldInfo } from './utils/optimize-hold-info';
+import { optimizeMarks } from './utils/optimize-marks';
+import { optimizeReactProfilerTimings } from './utils/optimize-react-profiler-timings';
+import { optimizeRequestInfo } from './utils/optimize-request-info';
+import { optimizeSpans } from './utils/optimize-spans';
 function getUfoNameOverride(interaction) {
   const {
     ufoName,
@@ -81,34 +90,6 @@ function getPageVisibilityUpToTTI(interaction) {
   const bm3EndTimeOrInteractionEndTime = getBm3EndTimeOrFallbackValue(interaction);
   return getPageVisibilityState(start, bm3EndTimeOrInteractionEndTime);
 }
-function getVisibilityStateFromPerformance(stop) {
-  try {
-    const results = performance.getEntriesByType('visibility-state');
-    if (!results || results.length === 0) {
-      return null;
-    }
-    return results.reduce((acc = null, {
-      name,
-      startTime
-    }) => {
-      if (startTime > stop) {
-        return acc;
-      }
-      if (acc === null && name === null) {
-        return null;
-      }
-      if (acc === null) {
-        return name;
-      }
-      if (acc !== name) {
-        return 'mixed';
-      }
-      return acc;
-    }, null);
-  } catch (e) {
-    return null;
-  }
-}
 function getMoreAccuratePageVisibilityUpToTTI(interaction) {
   const old = getPageVisibilityUpToTTI(interaction);
   const tti = getEarliestLegacyStopTime(interaction, []);
@@ -124,17 +105,6 @@ function getMoreAccuratePageVisibilityUpToTTI(interaction) {
   }
   return old;
 }
-export function getMoreAccuratePageVisibilityUpToTTAI(interaction) {
-  const old = getPageVisibilityUpToTTAI(interaction);
-  const buffered = getVisibilityStateFromPerformance(interaction.end);
-  if (!buffered) {
-    return old;
-  }
-  if (buffered !== old) {
-    return 'mixed';
-  }
-  return old;
-}
 function getResourceTimings(start, end) {
   var _resourceTiming$getRe;
   return (_resourceTiming$getRe = resourceTiming.getResourceTimings(start, end)) !== null && _resourceTiming$getRe !== void 0 ? _resourceTiming$getRe : undefined;
@@ -291,49 +261,6 @@ function optimizeCustomData(interaction) {
   }
   return [...customDataMap.values()];
 }
-function optimizeReactProfilerTimings(reactProfilerTimings, interactionStart, reactUFOVersion) {
-  const reactProfilerTimingsMap = reactProfilerTimings.reduce((result, {
-    labelStack,
-    startTime,
-    commitTime,
-    actualDuration,
-    type
-  }) => {
-    if (labelStack && startTime >= interactionStart) {
-      const label = stringifyLabelStackFully(labelStack);
-      const start = Math.round(startTime);
-      const end = Math.round(commitTime);
-      const timing = result.get(label) || {
-        labelStack: optimizeLabelStack(labelStack, reactUFOVersion),
-        startTime: start,
-        endTime: end,
-        mountCount: 0,
-        rerenderCount: 0,
-        renderDuration: 0
-      };
-      if (start < timing.startTime) {
-        timing.startTime = start;
-      }
-      if (end > timing.endTime) {
-        timing.endTime = end;
-      }
-      if (type === 'mount') {
-        timing.mountCount += 1;
-      }
-      if (type === 'update') {
-        timing.rerenderCount += 1;
-      }
-      if (segmentUnmountCache.has(label) && fg('platform_ufo_segment_unmount_count')) {
-        timing.unmountCount = segmentUnmountCache.get(label) || 0;
-        segmentUnmountCache.delete(label);
-      }
-      timing.renderDuration += Math.round(actualDuration);
-      result.set(label, timing);
-    }
-    return result;
-  }, new Map());
-  return [...reactProfilerTimingsMap.values()];
-}
 function optimizeRedirects(redirects, interactionStart) {
   let lastRedirectTime = interactionStart;
   const updatedRedirects = redirects.sort((a, b) => a.time - b.time).reduce((result, redirect) => {
@@ -355,128 +282,6 @@ function optimizeRedirects(redirects, interactionStart) {
   }, []);
   return updatedRedirects;
 }
-export function optimizeHoldInfo(holdInfo, interactionStart, reactUFOVersion) {
-  const holdInfoMap = holdInfo.reduce((result, hold) => {
-    const {
-      labelStack,
-      name,
-      start,
-      end,
-      ignoreOnSubmit
-    } = hold;
-    if (labelStack && !ignoreOnSubmit && start >= interactionStart) {
-      const label = stringifyLabelStackFully([...labelStack, {
-        name
-      }]);
-      const startTime = Math.round(start);
-      const endTime = Math.round(end);
-      const timing = result.get(label) || {
-        labelStack: optimizeLabelStack([...labelStack, {
-          name
-        }], reactUFOVersion),
-        startTime,
-        endTime
-      };
-      if (startTime < timing.startTime) {
-        timing.startTime = startTime;
-      }
-      if (endTime > timing.endTime) {
-        timing.endTime = endTime;
-      }
-      result.set(label, timing);
-    }
-    return result;
-  }, new Map());
-  return [...holdInfoMap.values()];
-}
-function optimizeSpans(spans, interactionStart, reactUFOVersion) {
-  const updatedSpans = spans.reduce((result, span) => {
-    const {
-      labelStack,
-      type,
-      name,
-      start,
-      end
-    } = span;
-    if (labelStack && start >= interactionStart) {
-      result.push({
-        labelStack: optimizeLabelStack([...labelStack, {
-          name
-        }], reactUFOVersion),
-        startTime: Math.round(start),
-        endTime: Math.round(end),
-        type
-      });
-    }
-    return result;
-  }, []);
-  return updatedSpans;
-}
-function optimizeRequestInfo(requestInfo, interactionStart, reactUFOVersion) {
-  const updatedRequestInfo = requestInfo.reduce((result, reqInfo) => {
-    const {
-      labelStack,
-      name,
-      start,
-      end,
-      networkStart,
-      networkComplete
-    } = reqInfo;
-    const startTime = networkStart !== null && networkStart !== void 0 ? networkStart : start;
-    const endTime = networkComplete !== null && networkComplete !== void 0 ? networkComplete : end;
-    if (labelStack && start >= interactionStart && endTime) {
-      result.push({
-        labelStack: optimizeLabelStack([...labelStack, {
-          name
-        }], reactUFOVersion),
-        startTime: Math.round(startTime),
-        endTime: Math.round(endTime)
-      });
-    }
-    return result;
-  }, []);
-  return updatedRequestInfo;
-}
-function optimizeCustomTimings(customTimings, interactionStart) {
-  return customTimings.reduce((result, item) => {
-    Object.keys(item.data).forEach(key => {
-      if (item.data[key].startTime >= interactionStart) {
-        result.push({
-          labelStack: [{
-            n: key
-          }],
-          startTime: Math.round(item.data[key].startTime),
-          endTime: Math.round(item.data[key].endTime)
-        });
-      }
-    });
-    return result;
-  }, []);
-}
-function optimizeMarks(marks, reactUFOVersion) {
-  return marks.map(({
-    labelStack,
-    time,
-    ...others
-  }) => ({
-    ...others,
-    labelStack: labelStack && optimizeLabelStack(labelStack, reactUFOVersion),
-    time: Math.round(time)
-  }));
-}
-function optimizeApdex(apdex, reactUFOVersion) {
-  return apdex.map(({
-    stopTime,
-    labelStack,
-    ...others
-  }) => ({
-    ...others,
-    stopTime: Math.round(stopTime),
-    ...(labelStack ? {
-      labelStack: optimizeLabelStack(labelStack, reactUFOVersion)
-    } : {})
-  }));
-}
 function objectToArray(obj = {}) {
   return Object.keys(obj).reduce((result, key) => {
     result.push({

package/dist/es2019/create-payload/utils/get-more-accurate-page-visibility-up-to-ttai.js

@@ -0,0 +1,13 @@
+import getPageVisibilityUpToTTAI from './get-page-visibility-up-to-ttai';
+import { getVisibilityStateFromPerformance } from './get-visibility-state-from-performance';
+export function getMoreAccuratePageVisibilityUpToTTAI(interaction) {
+  const old = getPageVisibilityUpToTTAI(interaction);
+  const buffered = getVisibilityStateFromPerformance(interaction.end);
+  if (!buffered) {
+    return old;
+  }
+  if (buffered !== old) {
+    return 'mixed';
+  }
+  return old;
+}

package/dist/es2019/create-payload/utils/get-visibility-state-from-performance.js

@@ -0,0 +1,28 @@
+export function getVisibilityStateFromPerformance(stop) {
+  try {
+    const results = performance.getEntriesByType('visibility-state');
+    if (!results || results.length === 0) {
+      return null;
+    }
+    return results.reduce((acc = null, {
+      name,
+      startTime
+    }) => {
+      if (startTime > stop) {
+        return acc;
+      }
+      if (acc === null && name === null) {
+        return null;
+      }
+      if (acc === null) {
+        return name;
+      }
+      if (acc !== name) {
+        return 'mixed';
+      }
+      return acc;
+    }, null);
+  } catch (e) {
+    return null;
+  }
+}

package/dist/es2019/create-payload/utils/optimize-apdex.js

@@ -0,0 +1,14 @@
+import { optimizeLabelStack } from '../common/utils';
+export function optimizeApdex(apdex, reactUFOVersion) {
+  return apdex.map(({
+    stopTime,
+    labelStack,
+    ...others
+  }) => ({
+    ...others,
+    stopTime: Math.round(stopTime),
+    ...(labelStack ? {
+      labelStack: optimizeLabelStack(labelStack, reactUFOVersion)
+    } : {})
+  }));
+}

package/dist/es2019/create-payload/utils/optimize-custom-timings.js

@@ -0,0 +1,16 @@
+export function optimizeCustomTimings(customTimings, interactionStart) {
+  return customTimings.reduce((result, item) => {
+    Object.keys(item.data).forEach(key => {
+      if (item.data[key].startTime >= interactionStart) {
+        result.push({
+          labelStack: [{
+            n: key
+          }],
+          startTime: Math.round(item.data[key].startTime),
+          endTime: Math.round(item.data[key].endTime)
+        });
+      }
+    });
+    return result;
+  }, []);
+}

package/dist/es2019/create-payload/utils/optimize-hold-info.js

@@ -0,0 +1,35 @@
+import { optimizeLabelStack, stringifyLabelStackFully } from '../common/utils';
+export function optimizeHoldInfo(holdInfo, interactionStart, reactUFOVersion) {
+  const holdInfoMap = holdInfo.reduce((result, hold) => {
+    const {
+      labelStack,
+      name,
+      start,
+      end,
+      ignoreOnSubmit
+    } = hold;
+    if (labelStack && !ignoreOnSubmit && start >= interactionStart) {
+      const label = stringifyLabelStackFully([...labelStack, {
+        name
+      }]);
+      const startTime = Math.round(start);
+      const endTime = Math.round(end);
+      const timing = result.get(label) || {
+        labelStack: optimizeLabelStack([...labelStack, {
+          name
+        }], reactUFOVersion),
+        startTime,
+        endTime
+      };
+      if (startTime < timing.startTime) {
+        timing.startTime = startTime;
+      }
+      if (endTime > timing.endTime) {
+        timing.endTime = endTime;
+      }
+      result.set(label, timing);
+    }
+    return result;
+  }, new Map());
+  return [...holdInfoMap.values()];
+}

package/dist/es2019/create-payload/utils/optimize-marks.js

@@ -0,0 +1,12 @@
+import { optimizeLabelStack } from '../common/utils';
+export function optimizeMarks(marks, reactUFOVersion) {
+  return marks.map(({
+    labelStack,
+    time,
+    ...others
+  }) => ({
+    ...others,
+    labelStack: labelStack && optimizeLabelStack(labelStack, reactUFOVersion),
+    time: Math.round(time)
+  }));
+}

package/dist/es2019/create-payload/utils/optimize-react-profiler-timings.js

@@ -0,0 +1,46 @@
+import { fg } from '@atlaskit/platform-feature-flags';
+import { segmentUnmountCache } from '../../interaction-metrics';
+import { optimizeLabelStack, stringifyLabelStackFully } from '../common/utils';
+export function optimizeReactProfilerTimings(reactProfilerTimings, interactionStart, reactUFOVersion) {
+  const reactProfilerTimingsMap = reactProfilerTimings.reduce((result, {
+    labelStack,
+    startTime,
+    commitTime,
+    actualDuration,
+    type
+  }) => {
+    if (labelStack && startTime >= interactionStart) {
+      const label = stringifyLabelStackFully(labelStack);
+      const start = Math.round(startTime);
+      const end = Math.round(commitTime);
+      const timing = result.get(label) || {
+        labelStack: optimizeLabelStack(labelStack, reactUFOVersion),
+        startTime: start,
+        endTime: end,
+        mountCount: 0,
+        rerenderCount: 0,
+        renderDuration: 0
+      };
+      if (start < timing.startTime) {
+        timing.startTime = start;
+      }
+      if (end > timing.endTime) {
+        timing.endTime = end;
+      }
+      if (type === 'mount') {
+        timing.mountCount += 1;
+      }
+      if (type === 'update') {
+        timing.rerenderCount += 1;
+      }
+      if (segmentUnmountCache.has(label) && fg('platform_ufo_segment_unmount_count')) {
+        timing.unmountCount = segmentUnmountCache.get(label) || 0;
+        segmentUnmountCache.delete(label);
+      }
+      timing.renderDuration += Math.round(actualDuration);
+      result.set(label, timing);
+    }
+    return result;
+  }, new Map());
+  return [...reactProfilerTimingsMap.values()];
+}

package/dist/es2019/create-payload/utils/optimize-request-info.js

@@ -0,0 +1,26 @@
+import { optimizeLabelStack } from '../common/utils';
+export function optimizeRequestInfo(requestInfo, interactionStart, reactUFOVersion) {
+  const updatedRequestInfo = requestInfo.reduce((result, reqInfo) => {
+    const {
+      labelStack,
+      name,
+      start,
+      end,
+      networkStart,
+      networkComplete
+    } = reqInfo;
+    const startTime = networkStart !== null && networkStart !== void 0 ? networkStart : start;
+    const endTime = networkComplete !== null && networkComplete !== void 0 ? networkComplete : end;
+    if (labelStack && start >= interactionStart && endTime) {
+      result.push({
+        labelStack: optimizeLabelStack([...labelStack, {
+          name
+        }], reactUFOVersion),
+        startTime: Math.round(startTime),
+        endTime: Math.round(endTime)
+      });
+    }
+    return result;
+  }, []);
+  return updatedRequestInfo;
+}

package/dist/es2019/create-payload/utils/optimize-spans.js

@@ -0,0 +1,24 @@
+import { optimizeLabelStack } from '../common/utils';
+export function optimizeSpans(spans, interactionStart, reactUFOVersion) {
+  const updatedSpans = spans.reduce((result, span) => {
+    const {
+      labelStack,
+      type,
+      name,
+      start,
+      end
+    } = span;
+    if (labelStack && start >= interactionStart) {
+      result.push({
+        labelStack: optimizeLabelStack([...labelStack, {
+          name
+        }], reactUFOVersion),
+        startTime: Math.round(start),
+        endTime: Math.round(end),
+        type
+      });
+    }
+    return result;
+  }, []);
+  return updatedSpans;
+}

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

@@ -111,7 +111,7 @@ export function init(analyticsWebClientAsync, config) {
         startTime: 0
       });
     }
-    if (config !== null && config !== void 0 && (_config$extraInteract = config.extraInteractionMetrics) !== null && _config$extraInteract !== void 0 && _config$extraInteract.enabled && fg('platform_ufo_enable_ttai_with_3p')) {
+    if (config !== null && config !== void 0 && (_config$extraInteract = config.extraInteractionMetrics) !== null && _config$extraInteract !== void 0 && _config$extraInteract.enabled) {
       interactionExtraMetrics.initializeVCObserver(vcOptions);
     }
   }

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

@@ -185,7 +185,7 @@ export class SSRPlaceholderHandlers {
     return element;
   }
 
-  // NOTE - for use when the FG `platform_ufo_ssr_placeholder_resolution_ttvc_v3` is disabled
+  // Validates placeholder match using asynchronous observation and resolves with the result
   checkIfExistedAndSizeMatching(el) {
     el = this.findNearestPlaceholderContainerIfIgnored(el);
     const id = this.getPlaceholderId(el);
@@ -201,7 +201,7 @@ export class SSRPlaceholderHandlers {
     });
   }
 
-  // NOTE - for use when the FG `platform_ufo_ssr_placeholder_resolution_ttvc_v3` is enabled
+  // Validates placeholder match synchronously using stored SSR dimensions and current bounds
   checkIfExistedAndSizeMatchingV3(el) {
     el = this.findNearestPlaceholderContainerIfIgnored(el);
     const id = this.getPlaceholderId(el);

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

@@ -121,15 +121,13 @@ export default class AbstractVCCalculatorBase {
     }
     let enhancedVcLogs = vcLogs ? vcLogs.map(log => ({
       ...log,
-      ...(fg('platform_ufo_serialise_ttvc_v3_debug_data') && {
-        entries: log.entries.map(entry => {
-          var _entry$rect, _entry$previousRect;
-          return {
-            ...entry,
-            rect: (_entry$rect = entry.rect) === null || _entry$rect === void 0 ? void 0 : _entry$rect.toJSON(),
-            previousRect: (_entry$previousRect = entry.previousRect) === null || _entry$previousRect === void 0 ? void 0 : _entry$previousRect.toJSON()
-          };
-        })
+      entries: log.entries.map(entry => {
+        var _entry$rect, _entry$previousRect;
+        return {
+          ...entry,
+          rect: (_entry$rect = entry.rect) === null || _entry$rect === void 0 ? void 0 : _entry$rect.toJSON(),
+          previousRect: (_entry$previousRect = entry.previousRect) === null || _entry$previousRect === void 0 ? void 0 : _entry$previousRect.toJSON()
+        };
       }),
       viewportPercentage: log.viewportPercentage
     })) : [];
@@ -182,10 +180,8 @@ export default class AbstractVCCalculatorBase {
           }
           (_ignoredEntriesByTime = ignoredEntriesByTime.get(timestamp)) === null || _ignoredEntriesByTime === void 0 ? void 0 : _ignoredEntriesByTime.push({
             ...viewportData,
-            ...(fg('platform_ufo_serialise_ttvc_v3_debug_data') && {
-              rect: (_viewportData$rect = viewportData.rect) === null || _viewportData$rect === void 0 ? void 0 : _viewportData$rect.toJSON(),
-              previousRect: (_viewportData$previou = viewportData.previousRect) === null || _viewportData$previou === void 0 ? void 0 : _viewportData$previou.toJSON()
-            }),
+            rect: (_viewportData$rect = viewportData.rect) === null || _viewportData$rect === void 0 ? void 0 : _viewportData$rect.toJSON(),
+            previousRect: (_viewportData$previou = viewportData.previousRect) === null || _viewportData$previou === void 0 ? void 0 : _viewportData$previou.toJSON(),
             ignoreReason: viewportData.visible ? viewportData.type : 'not-visible'
           });
         }

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

@@ -142,27 +142,18 @@ export default class ViewportObserver {
           const ssrPlaceholderHandler = this.getSSRPlaceholderHandler();
           if (ssrPlaceholderHandler) {
             if (ssrPlaceholderHandler.isPlaceholder(addedNode) || ssrPlaceholderHandler.isPlaceholderIgnored(addedNode)) {
-              if (fg('platform_ufo_ssr_placeholder_resolution_ttvc_v3')) {
-                if (ssrPlaceholderHandler.checkIfExistedAndSizeMatchingV3(addedNode)) {
-                  var _this$intersectionObs3;
-                  (_this$intersectionObs3 = this.intersectionObserver) === null || _this$intersectionObs3 === void 0 ? void 0 : _this$intersectionObs3.watchAndTag(addedNode, 'mutation:ssr-placeholder');
-                  continue;
-                }
-              } else {
-                const result = await ssrPlaceholderHandler.checkIfExistedAndSizeMatching(addedNode);
-                if (result !== false) {
-                  var _this$intersectionObs4;
-                  (_this$intersectionObs4 = this.intersectionObserver) === null || _this$intersectionObs4 === void 0 ? void 0 : _this$intersectionObs4.watchAndTag(addedNode, 'mutation:ssr-placeholder');
-                  continue;
-                }
+              if (ssrPlaceholderHandler.checkIfExistedAndSizeMatchingV3(addedNode)) {
+                var _this$intersectionObs3;
+                (_this$intersectionObs3 = this.intersectionObserver) === null || _this$intersectionObs3 === void 0 ? void 0 : _this$intersectionObs3.watchAndTag(addedNode, 'mutation:ssr-placeholder');
+                continue;
               }
               // If result is false, continue to normal mutation logic below
             }
             if (ssrPlaceholderHandler.isPlaceholderReplacement(addedNode) || ssrPlaceholderHandler.isPlaceholderIgnored(addedNode)) {
               const result = await ssrPlaceholderHandler.validateReactComponentMatchToPlaceholder(addedNode);
               if (result !== false) {
-                var _this$intersectionObs5;
-                (_this$intersectionObs5 = this.intersectionObserver) === null || _this$intersectionObs5 === void 0 ? void 0 : _this$intersectionObs5.watchAndTag(addedNode, 'mutation:ssr-placeholder');
+                var _this$intersectionObs4;
+                (_this$intersectionObs4 = this.intersectionObserver) === null || _this$intersectionObs4 === void 0 ? void 0 : _this$intersectionObs4.watchAndTag(addedNode, 'mutation:ssr-placeholder');
                 continue;
               }
               // If result is false, continue to normal mutation logic below
@@ -178,36 +169,36 @@ export default class ViewportObserver {
         });
         const isInIgnoreLsMarker = isInVCIgnoreIfNoLayoutShiftMarker(addedNode);
         if (sameDeletedNode && isInIgnoreLsMarker) {
-          var _this$intersectionObs6;
-          (_this$intersectionObs6 = this.intersectionObserver) === null || _this$intersectionObs6 === void 0 ? void 0 : _this$intersectionObs6.watchAndTag(addedNode, 'mutation:remount');
+          var _this$intersectionObs5;
+          (_this$intersectionObs5 = this.intersectionObserver) === null || _this$intersectionObs5 === void 0 ? void 0 : _this$intersectionObs5.watchAndTag(addedNode, 'mutation:remount');
           continue;
         }
         if (isContainedWithinMediaWrapper(addedNode)) {
-          var _this$intersectionObs7;
-          (_this$intersectionObs7 = this.intersectionObserver) === null || _this$intersectionObs7 === void 0 ? void 0 : _this$intersectionObs7.watchAndTag(addedNode, 'mutation:media');
+          var _this$intersectionObs6;
+          (_this$intersectionObs6 = this.intersectionObserver) === null || _this$intersectionObs6 === void 0 ? void 0 : _this$intersectionObs6.watchAndTag(addedNode, 'mutation:media');
           continue;
         }
         const {
           isWithin: isWithinThirdPartySegment
         } = checkWithinComponent(addedNode, 'UFOThirdPartySegment', this.mapIs3pResult);
         if (isWithinThirdPartySegment) {
-          var _this$intersectionObs8;
-          (_this$intersectionObs8 = this.intersectionObserver) === null || _this$intersectionObs8 === void 0 ? void 0 : _this$intersectionObs8.watchAndTag(addedNode, 'mutation:third-party-element');
+          var _this$intersectionObs7;
+          (_this$intersectionObs7 = this.intersectionObserver) === null || _this$intersectionObs7 === void 0 ? void 0 : _this$intersectionObs7.watchAndTag(addedNode, 'mutation:third-party-element');
           continue;
         }
         if (fg('platform_ufo_display_content_resolution_ttvc_v3')) {
           // Check if the target has display:content css property, return array of valid targets
           const validTargets = checkCssProperty(addedNode);
           for (const validTarget of validTargets) {
-            var _this$intersectionObs9;
-            (_this$intersectionObs9 = this.intersectionObserver) === null || _this$intersectionObs9 === void 0 ? void 0 : _this$intersectionObs9.watchAndTag(validTarget, createElementMutationsWatcher(removedNodeRects));
+            var _this$intersectionObs8;
+            (_this$intersectionObs8 = this.intersectionObserver) === null || _this$intersectionObs8 === void 0 ? void 0 : _this$intersectionObs8.watchAndTag(validTarget, createElementMutationsWatcher(removedNodeRects));
           }
         } else {
-          var _this$intersectionObs0;
+          var _this$intersectionObs9;
           if (fg('platform_ufo_display_content_track_occurrence')) {
             trackDisplayContentsOccurrence(addedNode);
           }
-          (_this$intersectionObs0 = this.intersectionObserver) === null || _this$intersectionObs0 === void 0 ? void 0 : _this$intersectionObs0.watchAndTag(addedNode, createElementMutationsWatcher(removedNodeRects));
+          (_this$intersectionObs9 = this.intersectionObserver) === null || _this$intersectionObs9 === void 0 ? void 0 : _this$intersectionObs9.watchAndTag(addedNode, createElementMutationsWatcher(removedNodeRects));
         }
       }
     });
@@ -217,8 +208,8 @@ export default class ViewportObserver {
       oldValue,
       newValue
     }) => {
-      var _this$intersectionObs1;
-      (_this$intersectionObs1 = this.intersectionObserver) === null || _this$intersectionObs1 === void 0 ? void 0 : _this$intersectionObs1.watchAndTag(target, ({
+      var _this$intersectionObs0;
+      (_this$intersectionObs0 = this.intersectionObserver) === null || _this$intersectionObs0 === void 0 ? void 0 : _this$intersectionObs0.watchAndTag(target, ({
         target,
         rect
       }) => {
@@ -345,12 +336,12 @@ export default class ViewportObserver {
     this.isStarted = true;
   }
   stop() {
-    var _this$mutationObserve2, _this$intersectionObs10, _this$performanceObse2;
+    var _this$mutationObserve2, _this$intersectionObs1, _this$performanceObse2;
     if (!this.isStarted) {
       return;
     }
     (_this$mutationObserve2 = this.mutationObserver) === null || _this$mutationObserve2 === void 0 ? void 0 : _this$mutationObserve2.disconnect();
-    (_this$intersectionObs10 = this.intersectionObserver) === null || _this$intersectionObs10 === void 0 ? void 0 : _this$intersectionObs10.disconnect();
+    (_this$intersectionObs1 = this.intersectionObserver) === null || _this$intersectionObs1 === void 0 ? void 0 : _this$intersectionObs1.disconnect();
     (_this$performanceObse2 = this.performanceObserver) === null || _this$performanceObse2 === void 0 ? void 0 : _this$performanceObse2.disconnect();
     this.isStarted = false;
     // Clean up caches when stopping