@atlaskit/react-ufo 3.12.4 → 3.12.5

package/dist/cjs/vc/vc-observer-new/metric-calculator/percentile-calc/canvas-heatmap/index.js

@@ -5,6 +5,8 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.calculatePercentiles = calculatePercentiles;
+exports.calculatePercentilesWithDebugInfo = calculatePercentilesWithDebugInfo;
+exports.calculateTTVCPercentilesWithDebugInfo = calculateTTVCPercentilesWithDebugInfo;
 exports.default = void 0;
 var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
@@ -78,6 +80,69 @@ function _calculateTTVCPercentiles() {
   }));
   return _calculateTTVCPercentiles.apply(this, arguments);
 }
+function calculateTTVCPercentilesWithDebugInfo(_x2) {
+  return _calculateTTVCPercentilesWithDebugInfo.apply(this, arguments);
+}
+function _calculateTTVCPercentilesWithDebugInfo() {
+  _calculateTTVCPercentilesWithDebugInfo = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee2(_ref2) {
+    var viewport, orderedEntries, startTime, canvas, elementMap, _iterator3, _step3, entry, rect, timePixelCounts, canvasDimensions, totalPixels;
+    return _regenerator.default.wrap(function _callee2$(_context2) {
+      while (1) switch (_context2.prev = _context2.next) {
+        case 0:
+          viewport = _ref2.viewport, orderedEntries = _ref2.orderedEntries, startTime = _ref2.startTime;
+          canvas = new _canvasPixel.ViewportCanvas(viewport, (0, _platformFeatureFlags.fg)('platform_ufo_canvas_heatmap_full_precision') ? 1 : 0.25);
+          elementMap = new Map();
+          _iterator3 = _createForOfIteratorHelper(orderedEntries);
+          _context2.prev = 4;
+          _iterator3.s();
+        case 6:
+          if ((_step3 = _iterator3.n()).done) {
+            _context2.next = 16;
+            break;
+          }
+          entry = _step3.value;
+          if ('rect' in entry.data) {
+            _context2.next = 10;
+            break;
+          }
+          return _context2.abrupt("continue", 14);
+        case 10:
+          rect = entry.data.rect;
+          canvas.drawRect(rect, entry.time);
+          if (!elementMap.has(entry.time)) {
+            elementMap.set(entry.time, []);
+          }
+          elementMap.get(entry.time).push(entry.data);
+        case 14:
+          _context2.next = 6;
+          break;
+        case 16:
+          _context2.next = 21;
+          break;
+        case 18:
+          _context2.prev = 18;
+          _context2.t0 = _context2["catch"](4);
+          _iterator3.e(_context2.t0);
+        case 21:
+          _context2.prev = 21;
+          _iterator3.f();
+          return _context2.finish(21);
+        case 24:
+          _context2.next = 26;
+          return canvas.getPixelCounts();
+        case 26:
+          timePixelCounts = _context2.sent;
+          canvasDimensions = canvas.getScaledDimensions();
+          totalPixels = canvasDimensions.width * canvasDimensions.height;
+          return _context2.abrupt("return", calculatePercentilesWithDebugInfo(timePixelCounts, elementMap, totalPixels, startTime));
+        case 30:
+        case "end":
+          return _context2.stop();
+      }
+    }, _callee2, null, [[4, 18, 21, 24]]);
+  }));
+  return _calculateTTVCPercentilesWithDebugInfo.apply(this, arguments);
+}
 var _default = exports.default = calculateTTVCPercentiles;
 function calculatePercentiles(timePixelCounts, elementMap, unorderedPercentiles, totalPixels, startTime) {
   var results = {};
@@ -87,11 +152,11 @@ function calculatePercentiles(timePixelCounts, elementMap, unorderedPercentiles,
   });
 
   // Sort entries by timestamp for consistent processing
-  var sortedEntries = Array.from(timePixelCounts.entries()).sort(function (_ref2, _ref3) {
-    var _ref4 = (0, _slicedToArray2.default)(_ref2, 1),
-      timeA = _ref4[0];
+  var sortedEntries = Array.from(timePixelCounts.entries()).sort(function (_ref3, _ref4) {
     var _ref5 = (0, _slicedToArray2.default)(_ref3, 1),
-      timeB = _ref5[0];
+      timeA = _ref5[0];
+    var _ref6 = (0, _slicedToArray2.default)(_ref4, 1),
+      timeB = _ref6[0];
     return Number(timeA) - Number(timeB);
   });
   var percentileIndex = 0;
@@ -142,4 +207,29 @@ function calculatePercentiles(timePixelCounts, elementMap, unorderedPercentiles,
     previousResult = results["".concat(percentile)];
   }
   return results;
+}
+function calculatePercentilesWithDebugInfo(timePixelCounts, elementMap, totalPixels, startTime) {
+  var results = new Array(elementMap.size);
+  var cumulativePixels = 0;
+  var sortedEntries = Array.from(timePixelCounts.entries()).sort(function (_ref7, _ref8) {
+    var _ref9 = (0, _slicedToArray2.default)(_ref7, 1),
+      timeA = _ref9[0];
+    var _ref10 = (0, _slicedToArray2.default)(_ref8, 1),
+      timeB = _ref10[0];
+    return Number(timeA) - Number(timeB);
+  });
+  for (var i = 0; i < sortedEntries.length; i++) {
+    var _sortedEntries$i = (0, _slicedToArray2.default)(sortedEntries[i], 2),
+      time = _sortedEntries$i[0],
+      pixelCount = _sortedEntries$i[1];
+    cumulativePixels += pixelCount;
+    var percentCovered = cumulativePixels / totalPixels * 100;
+    var entryDatas = elementMap.get(time) || [];
+    results[i] = {
+      time: Math.round(Number(time - startTime)),
+      viewportPercentage: percentCovered,
+      entries: Array.from(entryDatas)
+    };
+  }
+  return results;
 }

package/dist/cjs/vc/vc-observer-new/metric-calculator/percentile-calc/canvas-heatmap/test-with-debug-info.js

@@ -0,0 +1,108 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
+var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
+var _index = require("./index");
+// Test utilities
+var createMockRect = function createMockRect() {
+  var x = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 0;
+  var y = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
+  var width = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 100;
+  var height = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : 100;
+  return new MockDOMRect(x, y, width, height);
+};
+var createViewportEntry = function createViewportEntry(elementName) {
+  var rect = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : createMockRect();
+  var visible = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : true;
+  var type = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : 'mutation:element';
+  return {
+    elementName: elementName,
+    rect: rect,
+    visible: visible,
+    type: type
+  };
+};
+var createTimePixelCounts = function createTimePixelCounts(counts) {
+  return new Map(counts);
+};
+var createElementMap = function createElementMap(entries) {
+  return new Map(entries);
+};
+var createExpectedResult = function createExpectedResult(time, viewportPercentage, entries) {
+  return {
+    time: time,
+    viewportPercentage: viewportPercentage,
+    entries: entries
+  };
+};
+var MockDOMRect = /*#__PURE__*/function () {
+  function MockDOMRect(x, y, width, height) {
+    (0, _classCallCheck2.default)(this, MockDOMRect);
+    this.x = x;
+    this.y = y;
+    this.width = width;
+    this.height = height;
+  }
+  return (0, _createClass2.default)(MockDOMRect, [{
+    key: "bottom",
+    get: function get() {
+      return this.y + this.height;
+    }
+  }, {
+    key: "left",
+    get: function get() {
+      return this.x;
+    }
+  }, {
+    key: "right",
+    get: function get() {
+      return this.x + this.width;
+    }
+  }, {
+    key: "top",
+    get: function get() {
+      return this.y;
+    }
+  }, {
+    key: "toJSON",
+    value: function toJSON() {
+      return {
+        x: this.x,
+        y: this.y,
+        width: this.width,
+        height: this.height
+      };
+    }
+  }]);
+}();
+describe('calculatePercentilesWithDebugInfo', function () {
+  it('should correctly calculate percentiles with accumulated elements from timestamps', function () {
+    var timePixelCounts = createTimePixelCounts([[100, 10], [200, 20], [300, 10], [400, 10]]);
+    var elementMap = createElementMap([[100, [createViewportEntry('div'), createViewportEntry('span')]], [200, [createViewportEntry('img')]], [300, [createViewportEntry('p'), createViewportEntry('a')]], [400, [createViewportEntry('img')]]]);
+    var expected = [createExpectedResult(100, 20, [createViewportEntry('div'), createViewportEntry('span')]), createExpectedResult(200, 60, [createViewportEntry('img')]), createExpectedResult(300, 80, [createViewportEntry('p'), createViewportEntry('a')]), createExpectedResult(400, 100, [createViewportEntry('img')])];
+    var result = (0, _index.calculatePercentilesWithDebugInfo)(timePixelCounts, elementMap, 50, 0);
+    expect(result).toEqual(expected);
+  });
+  it('should handle empty entries gracefully', function () {
+    var timePixelCounts = new Map();
+    var elementMap = new Map();
+    var expected = [];
+    var result = (0, _index.calculatePercentilesWithDebugInfo)(timePixelCounts, elementMap, 100, 0);
+    expect(result).toEqual(expected);
+  });
+  it('should handle non-sequential timestamps', function () {
+    var timePixelCounts = createTimePixelCounts([[300, 70], [100, 30]]);
+    var elementMap = createElementMap([[300, [createViewportEntry('p'), createViewportEntry('a')]], [100, [createViewportEntry('div')]]]);
+    var expected = [createExpectedResult(100, 30, [createViewportEntry('div')]), createExpectedResult(300, 100, [createViewportEntry('p'), createViewportEntry('a')])];
+    var result = (0, _index.calculatePercentilesWithDebugInfo)(timePixelCounts, elementMap, 100, 0);
+    expect(result).toEqual(expected);
+  });
+  it('should correctly calculate percentiles with startTime offset', function () {
+    var timePixelCounts = createTimePixelCounts([[100, 10], [200, 20], [300, 10], [400, 10]]);
+    var elementMap = createElementMap([[100, [createViewportEntry('div'), createViewportEntry('span')]], [200, [createViewportEntry('img')]], [300, [createViewportEntry('p'), createViewportEntry('a')]], [400, [createViewportEntry('img')]]]);
+    var expected = [createExpectedResult(50, 20, [createViewportEntry('div'), createViewportEntry('span')]), createExpectedResult(150, 60, [createViewportEntry('img')]), createExpectedResult(250, 80, [createViewportEntry('p'), createViewportEntry('a')]), createExpectedResult(350, 100, [createViewportEntry('img')])];
+    var result = (0, _index.calculatePercentilesWithDebugInfo)(timePixelCounts, elementMap, 50, 50);
+    expect(result).toEqual(expected);
+  });
+});

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

@@ -1,62 +1,21 @@
 "use strict";
 
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _typeof = require("@babel/runtime/helpers/typeof");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = void 0;
-var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
-var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
-var _canvasHeatmap = _interopRequireDefault(require("./canvas-heatmap"));
-var _heatmap = _interopRequireDefault(require("./heatmap"));
-var _rectSweepingLine = _interopRequireDefault(require("./rect-sweeping-line"));
-function calculateTTVCPercentiles(_x) {
-  return _calculateTTVCPercentiles.apply(this, arguments);
-}
-function _calculateTTVCPercentiles() {
-  _calculateTTVCPercentiles = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee(arg) {
-    var algo, vcDetails, _vcDetails, _vcDetails2;
-    return _regenerator.default.wrap(function _callee$(_context) {
-      while (1) switch (_context.prev = _context.next) {
-        case 0:
-          algo = 'canvas_heatmap';
-          if (!(algo === 'canvas_heatmap')) {
-            _context.next = 6;
-            break;
-          }
-          _context.next = 4;
-          return (0, _canvasHeatmap.default)(arg);
-        case 4:
-          vcDetails = _context.sent;
-          return _context.abrupt("return", vcDetails);
-        case 6:
-          if (!(algo === 'rect_sweeping')) {
-            _context.next = 11;
-            break;
-          }
-          _context.next = 9;
-          return (0, _rectSweepingLine.default)(arg);
-        case 9:
-          _vcDetails = _context.sent;
-          return _context.abrupt("return", _vcDetails);
-        case 11:
-          if (!(algo === 'old_heatmap')) {
-            _context.next = 16;
-            break;
-          }
-          _context.next = 14;
-          return (0, _heatmap.default)(arg);
-        case 14:
-          _vcDetails2 = _context.sent;
-          return _context.abrupt("return", _vcDetails2);
-        case 16:
-          throw new Error('unexpected Error algo not chosen correctly');
-        case 17:
-        case "end":
-          return _context.stop();
-      }
-    }, _callee);
-  }));
-  return _calculateTTVCPercentiles.apply(this, arguments);
-}
-var _default = exports.default = calculateTTVCPercentiles;
+Object.defineProperty(exports, "calculateTTVCPercentiles", {
+  enumerable: true,
+  get: function get() {
+    return _canvasHeatmap.default;
+  }
+});
+Object.defineProperty(exports, "calculateTTVCPercentilesWithDebugInfo", {
+  enumerable: true,
+  get: function get() {
+    return _canvasHeatmap.calculateTTVCPercentilesWithDebugInfo;
+  }
+});
+var _canvasHeatmap = _interopRequireWildcard(require("./canvas-heatmap"));
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }

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

@@ -123,7 +123,9 @@ var ViewportObserver = exports.default = /*#__PURE__*/function () {
     (0, _defineProperty2.default)(this, "handleAttributeMutation", function (_ref5) {
       var _this$intersectionObs4;
       var target = _ref5.target,
-        attributeName = _ref5.attributeName;
+        attributeName = _ref5.attributeName,
+        oldValue = _ref5.oldValue,
+        newValue = _ref5.newValue;
       (_this$intersectionObs4 = _this.intersectionObserver) === null || _this$intersectionObs4 === void 0 || _this$intersectionObs4.watchAndTag(target, function (_ref6) {
         var target = _ref6.target,
           rect = _ref6.rect;
@@ -131,7 +133,9 @@ var ViewportObserver = exports.default = /*#__PURE__*/function () {
           return {
             type: 'mutation:media',
             mutationData: {
-              attributeName: attributeName
+              attributeName: attributeName,
+              oldValue: oldValue,
+              newValue: newValue
             }
           };
         }
@@ -143,7 +147,9 @@ var ViewportObserver = exports.default = /*#__PURE__*/function () {
           return {
             type: 'mutation:attribute:non-visual-style',
             mutationData: {
-              attributeName: attributeName
+              attributeName: attributeName,
+              oldValue: oldValue,
+              newValue: newValue
             }
           };
         }
@@ -152,14 +158,18 @@ var ViewportObserver = exports.default = /*#__PURE__*/function () {
           return {
             type: 'mutation:attribute:no-layout-shift',
             mutationData: {
-              attributeName: attributeName
+              attributeName: attributeName,
+              oldValue: oldValue,
+              newValue: newValue
             }
           };
         }
         return {
           type: 'mutation:attribute',
           mutationData: {
-            attributeName: attributeName
+            attributeName: attributeName,
+            oldValue: oldValue,
+            newValue: newValue
           }
         };
       });

package/dist/cjs/vc/vc-observer-new/viewport-observer/mutation-observer/index.js

@@ -42,7 +42,9 @@ function createMutationObserver(_ref) {
             var _mut$attributeName;
             onAttributeMutation({
               target: mut.target,
-              attributeName: (_mut$attributeName = mut.attributeName) !== null && _mut$attributeName !== void 0 ? _mut$attributeName : 'unknown'
+              attributeName: (_mut$attributeName = mut.attributeName) !== null && _mut$attributeName !== void 0 ? _mut$attributeName : 'unknown',
+              oldValue: oldValue,
+              newValue: newValue
             });
           }
           continue;

package/dist/es2019/create-experimental-interaction-metrics-payload/index.js

@@ -68,7 +68,8 @@ export async function getExperimentalVCMetrics(interaction) {
       isEventAborted: !!interaction.abortReason,
       prefix,
       vc: interaction.vc,
-      experienceKey: interaction.ufoName
+      experienceKey: interaction.ufoName,
+      interactionId: interaction.id
     });
     const VC = result === null || result === void 0 ? void 0 : result['metrics:vc'];
     if (!VC || !(result !== null && result !== void 0 && result[`${prefix}:vc:clean`])) {

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

@@ -36,6 +36,7 @@ async function getVCMetrics(interaction) {
     vc: interaction.vc,
     isEventAborted: interactionStatus.originalInteractionStatus !== 'SUCCEEDED',
     experienceKey: interaction.ufoName,
+    interactionId: interaction.id,
     ...ssr
   });
   if ((_config$experimentalI = config.experimentalInteractionMetrics) !== null && _config$experimentalI !== void 0 && _config$experimentalI.enabled) {

package/dist/es2019/vc/index.js

@@ -82,7 +82,8 @@ export class VCObserverWrapper {
       const v1v2Result = isVCRevisionEnabled('fy25.01', experienceKey) || isVCRevisionEnabled('fy25.02', experienceKey) ? await ((_this$oldVCObserver6 = this.oldVCObserver) === null || _this$oldVCObserver6 === void 0 ? void 0 : _this$oldVCObserver6.getVCResult(param)) : {};
       const v3Result = isVCRevisionEnabled('fy25.03', experienceKey) ? await ((_this$newVCObserver5 = this.newVCObserver) === null || _this$newVCObserver5 === void 0 ? void 0 : _this$newVCObserver5.getVCResult({
         start: param.start,
-        stop: param.stop
+        stop: param.stop,
+        interactionId: param.interactionId
       })) : [];
       if (!v3Result) {
         return v1v2Result !== null && v1v2Result !== void 0 ? v1v2Result : {};
@@ -96,7 +97,8 @@ export class VCObserverWrapper {
       const oldResult = await ((_this$oldVCObserver7 = this.oldVCObserver) === null || _this$oldVCObserver7 === void 0 ? void 0 : _this$oldVCObserver7.getVCResult(param));
       const newResult = await ((_this$newVCObserver6 = this.newVCObserver) === null || _this$newVCObserver6 === void 0 ? void 0 : _this$newVCObserver6.getVCResult({
         start: param.start,
-        stop: param.stop
+        stop: param.stop,
+        interactionId: param.interactionId
       }));
       if (oldResult && !newResult) {
         return oldResult;

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

@@ -0,0 +1,32 @@
+export function getVCRevisionDebugDetails({
+  revision,
+  isClean,
+  abortReason,
+  VCEntries,
+  componentsLog,
+  interactionId
+}) {
+  return {
+    revision,
+    isClean,
+    abortReason,
+    vcLogs: VCEntries.map(entry => ({
+      time: entry.time,
+      viewportPercentage: entry.vc,
+      entries: entry.elements.map(element => {
+        var _componentsLog$entry$;
+        const logEntry = (_componentsLog$entry$ = componentsLog[entry.time]) === null || _componentsLog$entry$ === void 0 ? void 0 : _componentsLog$entry$.find(log => log.targetName === element);
+        return {
+          elementName: element,
+          type: logEntry === null || logEntry === void 0 ? void 0 : logEntry.type,
+          rect: logEntry === null || logEntry === void 0 ? void 0 : logEntry.intersectionRect,
+          visible: true,
+          attributeName: logEntry === null || logEntry === void 0 ? void 0 : logEntry.attributeName,
+          oldValue: logEntry === null || logEntry === void 0 ? void 0 : logEntry.oldValue,
+          newValue: logEntry === null || logEntry === void 0 ? void 0 : logEntry.newValue
+        };
+      })
+    })),
+    interactionId
+  };
+}

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

@@ -3,6 +3,7 @@ import { fg } from '@atlaskit/platform-feature-flags';
 import { isVCRevisionEnabled } from '../../config';
 import { getActiveInteraction } from '../../interaction-metrics';
 import { attachAbortListeners } from './attachAbortListeners';
+import { getVCRevisionDebugDetails } from './getVCRevisionDebugDetails';
 import { getVCRevisionsData } from './getVCRevisionsData';
 import { getViewportHeight, getViewportWidth } from './getViewport';
 import { MultiRevisionHeatmap } from './heatmap/heatmap';
@@ -96,7 +97,8 @@ export class VCObserver {
       ssr,
       vc,
       isEventAborted,
-      experienceKey
+      experienceKey,
+      interactionId
     }) => {
       const startTime = performance.now();
       // add local measurement
@@ -298,6 +300,33 @@ export class VCObserver {
               entries: isTTVCv1Disabled ? vcNext.VCEntries.rel : VCEntries.rel
             }
           }));
+
+          // Add devtool callback for both v1 and v2
+          if (typeof window.__ufo_devtool_onVCRevisionReady__ === 'function' && fg('platform_ufo_ttvc_v3_devtool')) {
+            var _ufo_devtool_onVCRev2, _ref2;
+            // Handle v1 if not disabled
+            if (!isTTVCv1Disabled) {
+              var _ufo_devtool_onVCRev, _ref;
+              (_ufo_devtool_onVCRev = (_ref = window).__ufo_devtool_onVCRevisionReady__) === null || _ufo_devtool_onVCRev === void 0 ? void 0 : _ufo_devtool_onVCRev.call(_ref, getVCRevisionDebugDetails({
+                revision: 'fy25.01',
+                isClean: !abortReasonInfo,
+                abortReason: abortReason.reason,
+                VCEntries: VCEntries.rel,
+                componentsLog,
+                interactionId
+              }));
+            }
+
+            // Handle v2
+            (_ufo_devtool_onVCRev2 = (_ref2 = window).__ufo_devtool_onVCRevisionReady__) === null || _ufo_devtool_onVCRev2 === void 0 ? void 0 : _ufo_devtool_onVCRev2.call(_ref2, getVCRevisionDebugDetails({
+              revision: 'fy25.02',
+              isClean: !abortReasonInfo,
+              abortReason: abortReason.reason,
+              VCEntries: vcNext.VCEntries.rel,
+              componentsLog,
+              interactionId
+            }));
+          }
         }
       } catch (e) {
         /*  do nothing */

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

@@ -13,10 +13,11 @@ const DEFAULT_SELECTOR_CONFIG = {
 };
 export default class VCObserverNew {
   constructor(config) {
-    var _config$selectorConfi;
+    var _config$isPostInterac, _config$selectorConfi;
     _defineProperty(this, "viewportObserver", null);
     _defineProperty(this, "windowEventObserver", null);
     this.entriesTimeline = new EntriesTimeline();
+    this.isPostInteraction = (_config$isPostInterac = config.isPostInteraction) !== null && _config$isPostInterac !== void 0 ? _config$isPostInterac : false;
     this.selectorConfig = (_config$selectorConfi = config.selectorConfig) !== null && _config$selectorConfi !== void 0 ? _config$selectorConfi : DEFAULT_SELECTOR_CONFIG;
     this.viewportObserver = new ViewportObserver({
       onChange: onChangeArg => {
@@ -36,13 +37,15 @@ export default class VCObserverNew {
         }
         this.entriesTimeline.push({
           time,
-          type,
           data: {
+            type,
             elementName,
             rect,
             previousRect,
             visible,
-            attributeName: mutationData === null || mutationData === void 0 ? void 0 : mutationData.attributeName
+            attributeName: mutationData === null || mutationData === void 0 ? void 0 : mutationData.attributeName,
+            oldValue: mutationData === null || mutationData === void 0 ? void 0 : mutationData.oldValue,
+            newValue: mutationData === null || mutationData === void 0 ? void 0 : mutationData.newValue
           }
         });
       }
@@ -54,8 +57,8 @@ export default class VCObserverNew {
       }) => {
         this.entriesTimeline.push({
           time,
-          type: 'window:event',
           data: {
+            type: 'window:event',
             eventType: type
           }
         });
@@ -78,7 +81,8 @@ export default class VCObserverNew {
   async getVCResult(param) {
     const {
       start,
-      stop
+      stop,
+      interactionId
     } = param;
     const results = [];
     const calculator_fy25_03 = new VCCalculator_FY25_03();
@@ -89,7 +93,9 @@ export default class VCObserverNew {
     const fy25_03 = await calculator_fy25_03.calculate({
       orderedEntries,
       startTime: start,
-      stopTime: stop
+      stopTime: stop,
+      interactionId,
+      isPostInteraction: this.isPostInteraction
     });
     if (fy25_03) {
       results.push(fy25_03);