@atlaskit/react-ufo 4.0.3 → 4.1.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +17 -0
- package/custom-cohort-data/package.json +15 -0
- package/dist/cjs/custom-cohort-data/index.js +37 -0
- package/dist/cjs/custom-cohort-data/types.js +1 -0
- package/dist/cjs/vc/vc-observer/index.js +2 -3
- package/dist/cjs/vc/vc-observer-new/metric-calculator/abstract-base-vc-calculator.js +2 -2
- package/dist/cjs/vc/vc-observer-new/viewport-observer/index.js +10 -13
- package/dist/cjs/vc/vc-observer-new/viewport-observer/utils/{get-component-name-and-child-props.js → check-within-component-and-extract-child-props.js} +6 -39
- package/dist/cjs/vc/vc-observer-new/viewport-observer/utils/find-react-fiber.js +16 -0
- package/dist/cjs/vc/vc-observer-new/viewport-observer/utils/get-component-name.js +19 -0
- package/dist/es2019/custom-cohort-data/index.js +30 -0
- package/dist/es2019/custom-cohort-data/types.js +0 -0
- package/dist/es2019/vc/vc-observer/index.js +2 -3
- package/dist/es2019/vc/vc-observer-new/metric-calculator/abstract-base-vc-calculator.js +2 -2
- package/dist/es2019/vc/vc-observer-new/viewport-observer/index.js +7 -11
- package/dist/es2019/vc/vc-observer-new/viewport-observer/utils/{get-component-name-and-child-props.js → check-within-component-and-extract-child-props.js} +4 -31
- package/dist/es2019/vc/vc-observer-new/viewport-observer/utils/find-react-fiber.js +10 -0
- package/dist/es2019/vc/vc-observer-new/viewport-observer/utils/get-component-name.js +11 -0
- package/dist/esm/custom-cohort-data/index.js +29 -0
- package/dist/esm/custom-cohort-data/types.js +0 -0
- package/dist/esm/vc/vc-observer/index.js +2 -3
- package/dist/esm/vc/vc-observer-new/metric-calculator/abstract-base-vc-calculator.js +2 -2
- package/dist/esm/vc/vc-observer-new/viewport-observer/index.js +10 -13
- package/dist/esm/vc/vc-observer-new/viewport-observer/utils/{get-component-name-and-child-props.js → check-within-component-and-extract-child-props.js} +4 -34
- package/dist/esm/vc/vc-observer-new/viewport-observer/utils/find-react-fiber.js +10 -0
- package/dist/esm/vc/vc-observer-new/viewport-observer/utils/get-component-name.js +12 -0
- package/dist/types/custom-cohort-data/index.d.ts +4 -0
- package/dist/types/custom-cohort-data/types.d.ts +4 -0
- package/dist/types/vc/vc-observer-new/viewport-observer/utils/check-within-component-and-extract-child-props.d.ts +8 -0
- package/dist/types/vc/vc-observer-new/viewport-observer/utils/find-react-fiber.d.ts +1 -0
- package/dist/types/vc/vc-observer-new/viewport-observer/utils/get-component-name.d.ts +1 -0
- package/dist/types-ts4.5/custom-cohort-data/index.d.ts +4 -0
- package/dist/types-ts4.5/custom-cohort-data/types.d.ts +4 -0
- package/dist/types-ts4.5/vc/vc-observer-new/viewport-observer/utils/check-within-component-and-extract-child-props.d.ts +8 -0
- package/dist/types-ts4.5/vc/vc-observer-new/viewport-observer/utils/find-react-fiber.d.ts +1 -0
- package/dist/types-ts4.5/vc/vc-observer-new/viewport-observer/utils/get-component-name.d.ts +1 -0
- package/package.json +2 -4
- package/dist/types/vc/vc-observer-new/viewport-observer/utils/get-component-name-and-child-props.d.ts +0 -15
- package/dist/types-ts4.5/vc/vc-observer-new/viewport-observer/utils/get-component-name-and-child-props.d.ts +0 -15
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,22 @@
|
|
|
1
1
|
# @atlaskit/ufo-interaction-ignore
|
|
2
2
|
|
|
3
|
+
## 4.1.1
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- [#187972](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/187972)
|
|
8
|
+
[`fff3f06f3e5e1`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/fff3f06f3e5e1) -
|
|
9
|
+
FG cleanup - platform_ufo_emit_vc_debug_data
|
|
10
|
+
|
|
11
|
+
## 4.1.0
|
|
12
|
+
|
|
13
|
+
### Minor Changes
|
|
14
|
+
|
|
15
|
+
- [#185569](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/185569)
|
|
16
|
+
[`1c7b682d3bd6a`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/1c7b682d3bd6a) -
|
|
17
|
+
Adds UFOCustomCohortData component and addUFOCustomCohortData function to separate cohorting data
|
|
18
|
+
(important for analytics) from general debugging data.
|
|
19
|
+
|
|
3
20
|
## 4.0.3
|
|
4
21
|
|
|
5
22
|
### Patch Changes
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "@atlaskit/react-ufo/custom-cohort-data",
|
|
3
|
+
"main": "../dist/cjs/custom-cohort-data/index.js",
|
|
4
|
+
"module": "../dist/esm/custom-cohort-data/index.js",
|
|
5
|
+
"module:es2019": "../dist/es2019/custom-cohort-data/index.js",
|
|
6
|
+
"sideEffects": false,
|
|
7
|
+
"types": "../dist/types/custom-cohort-data/index.d.ts",
|
|
8
|
+
"typesVersions": {
|
|
9
|
+
">=4.5 <5.4": {
|
|
10
|
+
"*": [
|
|
11
|
+
"../dist/types-ts4.5/custom-cohort-data/index.d.ts"
|
|
12
|
+
]
|
|
13
|
+
}
|
|
14
|
+
}
|
|
15
|
+
}
|
|
@@ -0,0 +1,37 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
Object.defineProperty(exports, "__esModule", {
|
|
5
|
+
value: true
|
|
6
|
+
});
|
|
7
|
+
exports.addUFOCustomCohortData = addUFOCustomCohortData;
|
|
8
|
+
exports.default = UFOCustomCohortData;
|
|
9
|
+
var _react = require("react");
|
|
10
|
+
var _interactionContext = _interopRequireDefault(require("../interaction-context"));
|
|
11
|
+
var _interactionIdContext = require("../interaction-id-context");
|
|
12
|
+
var _interactionMetrics = require("../interaction-metrics");
|
|
13
|
+
function UFOCustomCohortData(_ref) {
|
|
14
|
+
var dataKey = _ref.dataKey,
|
|
15
|
+
value = _ref.value;
|
|
16
|
+
var interactionContext = (0, _react.useContext)(_interactionContext.default);
|
|
17
|
+
(0, _react.useMemo)(function () {
|
|
18
|
+
if (!interactionContext) {
|
|
19
|
+
return;
|
|
20
|
+
}
|
|
21
|
+
var interactionId = (0, _interactionIdContext.getInteractionId)();
|
|
22
|
+
var currentInteractionId = interactionId.current;
|
|
23
|
+
if (!currentInteractionId) {
|
|
24
|
+
return;
|
|
25
|
+
}
|
|
26
|
+
(0, _interactionMetrics.addCohortingCustomData)(currentInteractionId, dataKey, value);
|
|
27
|
+
}, [dataKey, value, interactionContext]);
|
|
28
|
+
return null;
|
|
29
|
+
}
|
|
30
|
+
function addUFOCustomCohortData(key, value) {
|
|
31
|
+
var interactionId = (0, _interactionIdContext.getInteractionId)();
|
|
32
|
+
var currentInteractionId = interactionId.current;
|
|
33
|
+
if (!currentInteractionId) {
|
|
34
|
+
return;
|
|
35
|
+
}
|
|
36
|
+
(0, _interactionMetrics.addCohortingCustomData)(currentInteractionId, key, value);
|
|
37
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";
|
|
@@ -13,7 +13,6 @@ var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/creat
|
|
|
13
13
|
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
14
14
|
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
|
|
15
15
|
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
|
|
16
|
-
var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
|
|
17
16
|
var _config = require("../../config");
|
|
18
17
|
var _interactionMetrics = require("../../interaction-metrics");
|
|
19
18
|
var _attachAbortListeners = require("./attachAbortListeners");
|
|
@@ -275,7 +274,7 @@ var VCObserver = exports.VCObserver = /*#__PURE__*/function () {
|
|
|
275
274
|
}
|
|
276
275
|
if (!_this.isPostInteraction) {
|
|
277
276
|
// Only create revision debug details if callbacks exist
|
|
278
|
-
shouldCreateDebugDetails = typeof window.__ufo_devtool_onVCRevisionReady__ === 'function' || typeof window.__on_ufo_vc_debug_data_ready === 'function'
|
|
277
|
+
shouldCreateDebugDetails = typeof window.__ufo_devtool_onVCRevisionReady__ === 'function' || typeof window.__on_ufo_vc_debug_data_ready === 'function';
|
|
279
278
|
if (shouldCreateDebugDetails) {
|
|
280
279
|
v1RevisionDebugDetails = (0, _getVCRevisionDebugDetails.getVCRevisionDebugDetails)({
|
|
281
280
|
revision: 'fy25.01',
|
|
@@ -302,7 +301,7 @@ var VCObserver = exports.VCObserver = /*#__PURE__*/function () {
|
|
|
302
301
|
// Handle v2
|
|
303
302
|
(_window$__ufo_devtool2 = (_window2 = window).__ufo_devtool_onVCRevisionReady__) === null || _window$__ufo_devtool2 === void 0 || _window$__ufo_devtool2.call(_window2, v2RevisionDebugDetails);
|
|
304
303
|
}
|
|
305
|
-
if (typeof window.__on_ufo_vc_debug_data_ready === 'function'
|
|
304
|
+
if (typeof window.__on_ufo_vc_debug_data_ready === 'function') {
|
|
306
305
|
if (!isTTVCv1Disabled) {
|
|
307
306
|
(_window$__on_ufo_vc_d = (_window3 = window).__on_ufo_vc_debug_data_ready) === null || _window$__on_ufo_vc_d === void 0 || _window$__on_ufo_vc_d.call(_window3, v1RevisionDebugDetails);
|
|
308
307
|
}
|
|
@@ -181,7 +181,7 @@ var AbstractVCCalculatorBase = exports.default = /*#__PURE__*/function () {
|
|
|
181
181
|
viewportPercentage: log.viewportPercentage
|
|
182
182
|
});
|
|
183
183
|
}) : []; // Only calculate enhanced debug details if devtool callbacks exist
|
|
184
|
-
shouldCalculateDebugDetails = !isPostInteraction && (typeof ((_window = window) === null || _window === void 0 ? void 0 : _window.__ufo_devtool_onVCRevisionReady__) === 'function' || typeof ((_window2 = window) === null || _window2 === void 0 ? void 0 : _window2.__on_ufo_vc_debug_data_ready) === 'function'
|
|
184
|
+
shouldCalculateDebugDetails = !isPostInteraction && (typeof ((_window = window) === null || _window === void 0 ? void 0 : _window.__ufo_devtool_onVCRevisionReady__) === 'function' || typeof ((_window2 = window) === null || _window2 === void 0 ? void 0 : _window2.__on_ufo_vc_debug_data_ready) === 'function');
|
|
185
185
|
if (shouldCalculateDebugDetails && allEntries && vcLogs) {
|
|
186
186
|
// Pre-sort vcLogs by time for efficient lookups
|
|
187
187
|
sortedVcLogs = (0, _toConsumableArray2.default)(vcLogs).sort(function (a, b) {
|
|
@@ -292,7 +292,7 @@ var AbstractVCCalculatorBase = exports.default = /*#__PURE__*/function () {
|
|
|
292
292
|
console.error('Error in onVCRevisionReady', e);
|
|
293
293
|
}
|
|
294
294
|
}
|
|
295
|
-
if (v3RevisionDebugDetails && typeof ((_window5 = window) === null || _window5 === void 0 ? void 0 : _window5.__on_ufo_vc_debug_data_ready) === 'function'
|
|
295
|
+
if (v3RevisionDebugDetails && typeof ((_window5 = window) === null || _window5 === void 0 ? void 0 : _window5.__on_ufo_vc_debug_data_ready) === 'function') {
|
|
296
296
|
try {
|
|
297
297
|
(_window6 = window) === null || _window6 === void 0 || (_window6$__on_ufo_vc_ = _window6.__on_ufo_vc_debug_data_ready) === null || _window6$__on_ufo_vc_ === void 0 || _window6$__on_ufo_vc_.call(_window6, v3RevisionDebugDetails);
|
|
298
298
|
} catch (e) {
|
|
@@ -17,7 +17,7 @@ var _rllPlaceholders = require("../../vc-observer/observers/rll-placeholders");
|
|
|
17
17
|
var _intersectionObserver = require("./intersection-observer");
|
|
18
18
|
var _mutationObserver = _interopRequireDefault(require("./mutation-observer"));
|
|
19
19
|
var _performanceObserver = _interopRequireDefault(require("./performance-observer"));
|
|
20
|
-
var
|
|
20
|
+
var _checkWithinComponentAndExtractChildProps = _interopRequireDefault(require("./utils/check-within-component-and-extract-child-props"));
|
|
21
21
|
var _isInVcIgnoreIfNoLayoutShiftMarker = _interopRequireDefault(require("./utils/is-in-vc-ignore-if-no-layout-shift-marker"));
|
|
22
22
|
function _createForOfIteratorHelper(r, e) { var t = "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (!t) { if (Array.isArray(r) || (t = _unsupportedIterableToArray(r)) || e && r && "number" == typeof r.length) { t && (r = t); var _n = 0, F = function F() {}; return { s: F, n: function n() { return _n >= r.length ? { done: !0 } : { done: !1, value: r[_n++] }; }, e: function e(r) { throw r; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var o, a = !0, u = !1; return { s: function s() { t = t.call(r); }, n: function n() { var r = t.next(); return a = r.done, r; }, e: function e(r) { u = !0, o = r; }, f: function f() { try { a || null == t.return || t.return(); } finally { if (u) throw o; } } }; }
|
|
23
23
|
function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
|
|
@@ -125,7 +125,7 @@ var ViewportObserver = exports.default = /*#__PURE__*/function () {
|
|
|
125
125
|
_context2.prev = 4;
|
|
126
126
|
_loop = /*#__PURE__*/_regenerator.default.mark(function _loop() {
|
|
127
127
|
var _this$intersectionObs8;
|
|
128
|
-
var addedNodeRef, addedNode, ssrState, SSRStateEnum, _this$intersectionObs, _this$intersectionObs2, ssrPlaceholderHandler, result, _this$intersectionObs3, _result, _this$intersectionObs4, sameDeletedNode, isInIgnoreLsMarker, isNoLsMarkerEnabled, _this$intersectionObs5, _this$intersectionObs6,
|
|
128
|
+
var addedNodeRef, addedNode, ssrState, SSRStateEnum, _this$intersectionObs, _this$intersectionObs2, ssrPlaceholderHandler, result, _this$intersectionObs3, _result, _this$intersectionObs4, sameDeletedNode, isInIgnoreLsMarker, isNoLsMarkerEnabled, _this$intersectionObs5, _this$intersectionObs6, _checkWithinComponent, isWithinThirdPartySegment, _this$intersectionObs7;
|
|
129
129
|
return _regenerator.default.wrap(function _loop$(_context) {
|
|
130
130
|
while (1) switch (_context.prev = _context.next) {
|
|
131
131
|
case 0:
|
|
@@ -235,17 +235,16 @@ var ViewportObserver = exports.default = /*#__PURE__*/function () {
|
|
|
235
235
|
(_this$intersectionObs6 = _this.intersectionObserver) === null || _this$intersectionObs6 === void 0 || _this$intersectionObs6.watchAndTag(addedNode, 'mutation:media');
|
|
236
236
|
return _context.abrupt("return", 0);
|
|
237
237
|
case 45:
|
|
238
|
-
|
|
238
|
+
_checkWithinComponent = (0, _checkWithinComponentAndExtractChildProps.default)(addedNode, 'UFOThirdPartySegment'), isWithinThirdPartySegment = _checkWithinComponent.isWithin;
|
|
239
239
|
if (!isWithinThirdPartySegment) {
|
|
240
|
-
_context.next =
|
|
240
|
+
_context.next = 49;
|
|
241
241
|
break;
|
|
242
242
|
}
|
|
243
|
-
|
|
244
|
-
(_this$intersectionObs7 = _this.intersectionObserver) === null || _this$intersectionObs7 === void 0 || _this$intersectionObs7.watchAndTag(addedNode, assignedReason);
|
|
243
|
+
(_this$intersectionObs7 = _this.intersectionObserver) === null || _this$intersectionObs7 === void 0 || _this$intersectionObs7.watchAndTag(addedNode, 'mutation:third-party-element');
|
|
245
244
|
return _context.abrupt("return", 0);
|
|
246
|
-
case
|
|
245
|
+
case 49:
|
|
247
246
|
(_this$intersectionObs8 = _this.intersectionObserver) === null || _this$intersectionObs8 === void 0 || _this$intersectionObs8.watchAndTag(addedNode, createElementMutationsWatcher(removedNodeRects));
|
|
248
|
-
case
|
|
247
|
+
case 50:
|
|
249
248
|
case "end":
|
|
250
249
|
return _context.stop();
|
|
251
250
|
}
|
|
@@ -333,13 +332,11 @@ var ViewportObserver = exports.default = /*#__PURE__*/function () {
|
|
|
333
332
|
}
|
|
334
333
|
};
|
|
335
334
|
}
|
|
336
|
-
var
|
|
337
|
-
isWithinThirdPartySegment =
|
|
338
|
-
ignoredReason = _checkThirdPartySegme2.ignoredReason;
|
|
335
|
+
var _checkWithinComponent2 = (0, _checkWithinComponentAndExtractChildProps.default)(target, 'UFOThirdPartySegment'),
|
|
336
|
+
isWithinThirdPartySegment = _checkWithinComponent2.isWithin;
|
|
339
337
|
if (isWithinThirdPartySegment) {
|
|
340
|
-
var assignedReason = (0, _getComponentNameAndChildProps.createMutationTypeWithIgnoredReason)(ignoredReason || 'third-party-element');
|
|
341
338
|
return {
|
|
342
|
-
type:
|
|
339
|
+
type: 'mutation:third-party-element',
|
|
343
340
|
mutationData: {
|
|
344
341
|
attributeName: attributeName,
|
|
345
342
|
oldValue: oldValue,
|
|
@@ -4,22 +4,13 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
|
|
|
4
4
|
Object.defineProperty(exports, "__esModule", {
|
|
5
5
|
value: true
|
|
6
6
|
});
|
|
7
|
-
exports.
|
|
8
|
-
exports.checkWithinComponentAndExtractChildProps = checkWithinComponentAndExtractChildProps;
|
|
9
|
-
exports.createMutationTypeWithIgnoredReason = createMutationTypeWithIgnoredReason;
|
|
7
|
+
exports.default = checkWithinComponentAndExtractChildProps;
|
|
10
8
|
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
11
|
-
var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
|
|
12
9
|
var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
|
|
10
|
+
var _findReactFiber = _interopRequireDefault(require("./find-react-fiber"));
|
|
11
|
+
var _getComponentName = _interopRequireDefault(require("./get-component-name"));
|
|
13
12
|
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
14
13
|
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
15
|
-
// Helper function to find React fiber on an element
|
|
16
|
-
var findReactFiber = function findReactFiber(element) {
|
|
17
|
-
var key = Object.keys(element).find(function (key) {
|
|
18
|
-
return key.startsWith('__reactFiber$') || key.startsWith('__reactInternalInstance$');
|
|
19
|
-
});
|
|
20
|
-
return key ? element[key] : null;
|
|
21
|
-
};
|
|
22
|
-
|
|
23
14
|
// Using the React Fiber tree to traverse up the DOM and check if a node is within a specific component
|
|
24
15
|
// and extract child component props if needed.
|
|
25
16
|
function checkWithinComponentAndExtractChildProps(node, targetComponentName, childComponentConfig) {
|
|
@@ -28,13 +19,13 @@ function checkWithinComponentAndExtractChildProps(node, targetComponentName, chi
|
|
|
28
19
|
// Walk up the DOM tree to find React fiber (handles non-React-rendered elements)
|
|
29
20
|
var currentElement = node;
|
|
30
21
|
while (currentElement && !fiber) {
|
|
31
|
-
fiber =
|
|
22
|
+
fiber = (0, _findReactFiber.default)(currentElement);
|
|
32
23
|
if (!fiber) {
|
|
33
24
|
currentElement = currentElement.parentElement;
|
|
34
25
|
}
|
|
35
26
|
}
|
|
36
27
|
} else {
|
|
37
|
-
fiber =
|
|
28
|
+
fiber = (0, _findReactFiber.default)(node);
|
|
38
29
|
}
|
|
39
30
|
|
|
40
31
|
// If no React fiber found, return false
|
|
@@ -48,14 +39,7 @@ function checkWithinComponentAndExtractChildProps(node, targetComponentName, chi
|
|
|
48
39
|
var currentFiber = fiber;
|
|
49
40
|
var childProp;
|
|
50
41
|
while (currentFiber) {
|
|
51
|
-
var componentName =
|
|
52
|
-
if (currentFiber.type) {
|
|
53
|
-
if (typeof currentFiber.type === 'function') {
|
|
54
|
-
componentName = currentFiber.type.displayName || currentFiber.type.name;
|
|
55
|
-
} else if ((0, _typeof2.default)(currentFiber.type) === 'object' && (currentFiber.type.displayName || currentFiber.type.name)) {
|
|
56
|
-
componentName = currentFiber.type.displayName || currentFiber.type.name;
|
|
57
|
-
}
|
|
58
|
-
}
|
|
42
|
+
var componentName = (0, _getComponentName.default)(currentFiber);
|
|
59
43
|
|
|
60
44
|
// Check if this is a child component we're looking for
|
|
61
45
|
if (childComponentConfig && componentName === childComponentConfig.componentName) {
|
|
@@ -79,21 +63,4 @@ function checkWithinComponentAndExtractChildProps(node, targetComponentName, chi
|
|
|
79
63
|
return {
|
|
80
64
|
isWithin: false
|
|
81
65
|
};
|
|
82
|
-
}
|
|
83
|
-
|
|
84
|
-
// Check if the node is within a UFOThirdPartySegment and extract any UFOIgnoreHolds reason
|
|
85
|
-
function checkThirdPartySegmentWithIgnoreReason(node) {
|
|
86
|
-
var result = checkWithinComponentAndExtractChildProps(node, 'UFOThirdPartySegment', {
|
|
87
|
-
componentName: 'UFOIgnoreHolds',
|
|
88
|
-
propName: 'reason'
|
|
89
|
-
});
|
|
90
|
-
return {
|
|
91
|
-
isWithinThirdPartySegment: result.isWithin,
|
|
92
|
-
ignoredReason: result.childProp
|
|
93
|
-
};
|
|
94
|
-
}
|
|
95
|
-
|
|
96
|
-
// Helper function to create mutation type from UFOIgnoreHoldsReason
|
|
97
|
-
function createMutationTypeWithIgnoredReason(reason) {
|
|
98
|
-
return "mutation:".concat(reason);
|
|
99
66
|
}
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.default = findReactFiber;
|
|
7
|
+
// Helper function to find React fiber on an element
|
|
8
|
+
function findReactFiber(element) {
|
|
9
|
+
// Use for...in loop instead of Object.keys().find() to avoid creating an array
|
|
10
|
+
for (var key in element) {
|
|
11
|
+
if (key.startsWith('__reactFiber$') || key.startsWith('__reactInternalInstance$')) {
|
|
12
|
+
return element[key];
|
|
13
|
+
}
|
|
14
|
+
}
|
|
15
|
+
return null;
|
|
16
|
+
}
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
Object.defineProperty(exports, "__esModule", {
|
|
5
|
+
value: true
|
|
6
|
+
});
|
|
7
|
+
exports.default = getComponentName;
|
|
8
|
+
var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
|
|
9
|
+
// Helper function to extract component name from fiber
|
|
10
|
+
function getComponentName(fiber) {
|
|
11
|
+
var type = fiber === null || fiber === void 0 ? void 0 : fiber.type;
|
|
12
|
+
if (!type) {
|
|
13
|
+
return undefined;
|
|
14
|
+
}
|
|
15
|
+
if (typeof type === 'function' || (0, _typeof2.default)(type) === 'object') {
|
|
16
|
+
return type.displayName || type.name;
|
|
17
|
+
}
|
|
18
|
+
return undefined;
|
|
19
|
+
}
|
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
import { useContext, useMemo } from 'react';
|
|
2
|
+
import UFOInteractionContext from '../interaction-context';
|
|
3
|
+
import { getInteractionId } from '../interaction-id-context';
|
|
4
|
+
import { addCohortingCustomData } from '../interaction-metrics';
|
|
5
|
+
export default function UFOCustomCohortData({
|
|
6
|
+
dataKey,
|
|
7
|
+
value
|
|
8
|
+
}) {
|
|
9
|
+
const interactionContext = useContext(UFOInteractionContext);
|
|
10
|
+
useMemo(() => {
|
|
11
|
+
if (!interactionContext) {
|
|
12
|
+
return;
|
|
13
|
+
}
|
|
14
|
+
const interactionId = getInteractionId();
|
|
15
|
+
const currentInteractionId = interactionId.current;
|
|
16
|
+
if (!currentInteractionId) {
|
|
17
|
+
return;
|
|
18
|
+
}
|
|
19
|
+
addCohortingCustomData(currentInteractionId, dataKey, value);
|
|
20
|
+
}, [dataKey, value, interactionContext]);
|
|
21
|
+
return null;
|
|
22
|
+
}
|
|
23
|
+
export function addUFOCustomCohortData(key, value) {
|
|
24
|
+
const interactionId = getInteractionId();
|
|
25
|
+
const currentInteractionId = interactionId.current;
|
|
26
|
+
if (!currentInteractionId) {
|
|
27
|
+
return;
|
|
28
|
+
}
|
|
29
|
+
addCohortingCustomData(currentInteractionId, key, value);
|
|
30
|
+
}
|
|
File without changes
|
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
2
|
-
import { fg } from '@atlaskit/platform-feature-flags';
|
|
3
2
|
import { isVCRevisionEnabled } from '../../config';
|
|
4
3
|
import { getActiveInteraction } from '../../interaction-metrics';
|
|
5
4
|
import { attachAbortListeners } from './attachAbortListeners';
|
|
@@ -285,7 +284,7 @@ export class VCObserver {
|
|
|
285
284
|
}
|
|
286
285
|
if (!this.isPostInteraction) {
|
|
287
286
|
// Only create revision debug details if callbacks exist
|
|
288
|
-
const shouldCreateDebugDetails = typeof window.__ufo_devtool_onVCRevisionReady__ === 'function' || typeof window.__on_ufo_vc_debug_data_ready === 'function'
|
|
287
|
+
const shouldCreateDebugDetails = typeof window.__ufo_devtool_onVCRevisionReady__ === 'function' || typeof window.__on_ufo_vc_debug_data_ready === 'function';
|
|
289
288
|
if (shouldCreateDebugDetails) {
|
|
290
289
|
const v1RevisionDebugDetails = getVCRevisionDebugDetails({
|
|
291
290
|
revision: 'fy25.01',
|
|
@@ -316,7 +315,7 @@ export class VCObserver {
|
|
|
316
315
|
// Handle v2
|
|
317
316
|
(_window$__ufo_devtool2 = (_window2 = window).__ufo_devtool_onVCRevisionReady__) === null || _window$__ufo_devtool2 === void 0 ? void 0 : _window$__ufo_devtool2.call(_window2, v2RevisionDebugDetails);
|
|
318
317
|
}
|
|
319
|
-
if (typeof window.__on_ufo_vc_debug_data_ready === 'function'
|
|
318
|
+
if (typeof window.__on_ufo_vc_debug_data_ready === 'function') {
|
|
320
319
|
var _window$__on_ufo_vc_d2, _window4;
|
|
321
320
|
if (!isTTVCv1Disabled) {
|
|
322
321
|
var _window$__on_ufo_vc_d, _window3;
|
|
@@ -109,7 +109,7 @@ export default class AbstractVCCalculatorBase {
|
|
|
109
109
|
})) : [];
|
|
110
110
|
|
|
111
111
|
// Only calculate enhanced debug details if devtool callbacks exist
|
|
112
|
-
const shouldCalculateDebugDetails = !isPostInteraction && (typeof ((_window = window) === null || _window === void 0 ? void 0 : _window.__ufo_devtool_onVCRevisionReady__) === 'function' || typeof ((_window2 = window) === null || _window2 === void 0 ? void 0 : _window2.__on_ufo_vc_debug_data_ready) === 'function'
|
|
112
|
+
const shouldCalculateDebugDetails = !isPostInteraction && (typeof ((_window = window) === null || _window === void 0 ? void 0 : _window.__ufo_devtool_onVCRevisionReady__) === 'function' || typeof ((_window2 = window) === null || _window2 === void 0 ? void 0 : _window2.__on_ufo_vc_debug_data_ready) === 'function');
|
|
113
113
|
if (shouldCalculateDebugDetails && allEntries && vcLogs) {
|
|
114
114
|
// Pre-sort vcLogs by time for efficient lookups
|
|
115
115
|
const sortedVcLogs = [...vcLogs].sort((a, b) => a.time - b.time);
|
|
@@ -199,7 +199,7 @@ export default class AbstractVCCalculatorBase {
|
|
|
199
199
|
console.error('Error in onVCRevisionReady', e);
|
|
200
200
|
}
|
|
201
201
|
}
|
|
202
|
-
if (v3RevisionDebugDetails && typeof ((_window5 = window) === null || _window5 === void 0 ? void 0 : _window5.__on_ufo_vc_debug_data_ready) === 'function'
|
|
202
|
+
if (v3RevisionDebugDetails && typeof ((_window5 = window) === null || _window5 === void 0 ? void 0 : _window5.__on_ufo_vc_debug_data_ready) === 'function') {
|
|
203
203
|
try {
|
|
204
204
|
var _window6, _window6$__on_ufo_vc_;
|
|
205
205
|
(_window6 = window) === null || _window6 === void 0 ? void 0 : (_window6$__on_ufo_vc_ = _window6.__on_ufo_vc_debug_data_ready) === null || _window6$__on_ufo_vc_ === void 0 ? void 0 : _window6$__on_ufo_vc_.call(_window6, v3RevisionDebugDetails);
|
|
@@ -6,7 +6,7 @@ import { RLLPlaceholderHandlers } from '../../vc-observer/observers/rll-placehol
|
|
|
6
6
|
import { createIntersectionObserver } from './intersection-observer';
|
|
7
7
|
import createMutationObserver from './mutation-observer';
|
|
8
8
|
import createPerformanceObserver from './performance-observer';
|
|
9
|
-
import
|
|
9
|
+
import checkWithinComponentAndExtractChildProps from './utils/check-within-component-and-extract-child-props';
|
|
10
10
|
import isInVCIgnoreIfNoLayoutShiftMarker from './utils/is-in-vc-ignore-if-no-layout-shift-marker';
|
|
11
11
|
function isElementVisible(element) {
|
|
12
12
|
if (!(element instanceof HTMLElement)) {
|
|
@@ -186,13 +186,11 @@ export default class ViewportObserver {
|
|
|
186
186
|
continue;
|
|
187
187
|
}
|
|
188
188
|
const {
|
|
189
|
-
isWithinThirdPartySegment
|
|
190
|
-
|
|
191
|
-
} = checkThirdPartySegmentWithIgnoreReason(addedNode);
|
|
189
|
+
isWithin: isWithinThirdPartySegment
|
|
190
|
+
} = checkWithinComponentAndExtractChildProps(addedNode, 'UFOThirdPartySegment');
|
|
192
191
|
if (isWithinThirdPartySegment) {
|
|
193
192
|
var _this$intersectionObs7;
|
|
194
|
-
|
|
195
|
-
(_this$intersectionObs7 = this.intersectionObserver) === null || _this$intersectionObs7 === void 0 ? void 0 : _this$intersectionObs7.watchAndTag(addedNode, assignedReason);
|
|
193
|
+
(_this$intersectionObs7 = this.intersectionObserver) === null || _this$intersectionObs7 === void 0 ? void 0 : _this$intersectionObs7.watchAndTag(addedNode, 'mutation:third-party-element');
|
|
196
194
|
continue;
|
|
197
195
|
}
|
|
198
196
|
(_this$intersectionObs8 = this.intersectionObserver) === null || _this$intersectionObs8 === void 0 ? void 0 : _this$intersectionObs8.watchAndTag(addedNode, createElementMutationsWatcher(removedNodeRects));
|
|
@@ -245,13 +243,11 @@ export default class ViewportObserver {
|
|
|
245
243
|
};
|
|
246
244
|
}
|
|
247
245
|
const {
|
|
248
|
-
isWithinThirdPartySegment
|
|
249
|
-
|
|
250
|
-
} = checkThirdPartySegmentWithIgnoreReason(target);
|
|
246
|
+
isWithin: isWithinThirdPartySegment
|
|
247
|
+
} = checkWithinComponentAndExtractChildProps(target, 'UFOThirdPartySegment');
|
|
251
248
|
if (isWithinThirdPartySegment) {
|
|
252
|
-
const assignedReason = createMutationTypeWithIgnoredReason(ignoredReason || 'third-party-element');
|
|
253
249
|
return {
|
|
254
|
-
type:
|
|
250
|
+
type: 'mutation:third-party-element',
|
|
255
251
|
mutationData: {
|
|
256
252
|
attributeName,
|
|
257
253
|
oldValue,
|
|
@@ -1,13 +1,10 @@
|
|
|
1
1
|
import { fg } from '@atlaskit/platform-feature-flags';
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
const key = Object.keys(element).find(key => key.startsWith('__reactFiber$') || key.startsWith('__reactInternalInstance$'));
|
|
5
|
-
return key ? element[key] : null;
|
|
6
|
-
};
|
|
2
|
+
import findReactFiber from './find-react-fiber';
|
|
3
|
+
import getComponentName from './get-component-name';
|
|
7
4
|
|
|
8
5
|
// Using the React Fiber tree to traverse up the DOM and check if a node is within a specific component
|
|
9
6
|
// and extract child component props if needed.
|
|
10
|
-
export function checkWithinComponentAndExtractChildProps(node, targetComponentName, childComponentConfig) {
|
|
7
|
+
export default function checkWithinComponentAndExtractChildProps(node, targetComponentName, childComponentConfig) {
|
|
11
8
|
let fiber = null;
|
|
12
9
|
if (fg('platform_ufo_handle_non_react_element_for_3p')) {
|
|
13
10
|
// Walk up the DOM tree to find React fiber (handles non-React-rendered elements)
|
|
@@ -33,14 +30,7 @@ export function checkWithinComponentAndExtractChildProps(node, targetComponentNa
|
|
|
33
30
|
let currentFiber = fiber;
|
|
34
31
|
let childProp;
|
|
35
32
|
while (currentFiber) {
|
|
36
|
-
|
|
37
|
-
if (currentFiber.type) {
|
|
38
|
-
if (typeof currentFiber.type === 'function') {
|
|
39
|
-
componentName = currentFiber.type.displayName || currentFiber.type.name;
|
|
40
|
-
} else if (typeof currentFiber.type === 'object' && (currentFiber.type.displayName || currentFiber.type.name)) {
|
|
41
|
-
componentName = currentFiber.type.displayName || currentFiber.type.name;
|
|
42
|
-
}
|
|
43
|
-
}
|
|
33
|
+
const componentName = getComponentName(currentFiber);
|
|
44
34
|
|
|
45
35
|
// Check if this is a child component we're looking for
|
|
46
36
|
if (childComponentConfig && componentName === childComponentConfig.componentName) {
|
|
@@ -65,21 +55,4 @@ export function checkWithinComponentAndExtractChildProps(node, targetComponentNa
|
|
|
65
55
|
return {
|
|
66
56
|
isWithin: false
|
|
67
57
|
};
|
|
68
|
-
}
|
|
69
|
-
|
|
70
|
-
// Check if the node is within a UFOThirdPartySegment and extract any UFOIgnoreHolds reason
|
|
71
|
-
export function checkThirdPartySegmentWithIgnoreReason(node) {
|
|
72
|
-
const result = checkWithinComponentAndExtractChildProps(node, 'UFOThirdPartySegment', {
|
|
73
|
-
componentName: 'UFOIgnoreHolds',
|
|
74
|
-
propName: 'reason'
|
|
75
|
-
});
|
|
76
|
-
return {
|
|
77
|
-
isWithinThirdPartySegment: result.isWithin,
|
|
78
|
-
ignoredReason: result.childProp
|
|
79
|
-
};
|
|
80
|
-
}
|
|
81
|
-
|
|
82
|
-
// Helper function to create mutation type from UFOIgnoreHoldsReason
|
|
83
|
-
export function createMutationTypeWithIgnoredReason(reason) {
|
|
84
|
-
return `mutation:${reason}`;
|
|
85
58
|
}
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
// Helper function to find React fiber on an element
|
|
2
|
+
export default function findReactFiber(element) {
|
|
3
|
+
// Use for...in loop instead of Object.keys().find() to avoid creating an array
|
|
4
|
+
for (const key in element) {
|
|
5
|
+
if (key.startsWith('__reactFiber$') || key.startsWith('__reactInternalInstance$')) {
|
|
6
|
+
return element[key];
|
|
7
|
+
}
|
|
8
|
+
}
|
|
9
|
+
return null;
|
|
10
|
+
}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
// Helper function to extract component name from fiber
|
|
2
|
+
export default function getComponentName(fiber) {
|
|
3
|
+
const type = fiber === null || fiber === void 0 ? void 0 : fiber.type;
|
|
4
|
+
if (!type) {
|
|
5
|
+
return undefined;
|
|
6
|
+
}
|
|
7
|
+
if (typeof type === 'function' || typeof type === 'object') {
|
|
8
|
+
return type.displayName || type.name;
|
|
9
|
+
}
|
|
10
|
+
return undefined;
|
|
11
|
+
}
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
import { useContext, useMemo } from 'react';
|
|
2
|
+
import UFOInteractionContext from '../interaction-context';
|
|
3
|
+
import { getInteractionId } from '../interaction-id-context';
|
|
4
|
+
import { addCohortingCustomData } from '../interaction-metrics';
|
|
5
|
+
export default function UFOCustomCohortData(_ref) {
|
|
6
|
+
var dataKey = _ref.dataKey,
|
|
7
|
+
value = _ref.value;
|
|
8
|
+
var interactionContext = useContext(UFOInteractionContext);
|
|
9
|
+
useMemo(function () {
|
|
10
|
+
if (!interactionContext) {
|
|
11
|
+
return;
|
|
12
|
+
}
|
|
13
|
+
var interactionId = getInteractionId();
|
|
14
|
+
var currentInteractionId = interactionId.current;
|
|
15
|
+
if (!currentInteractionId) {
|
|
16
|
+
return;
|
|
17
|
+
}
|
|
18
|
+
addCohortingCustomData(currentInteractionId, dataKey, value);
|
|
19
|
+
}, [dataKey, value, interactionContext]);
|
|
20
|
+
return null;
|
|
21
|
+
}
|
|
22
|
+
export function addUFOCustomCohortData(key, value) {
|
|
23
|
+
var interactionId = getInteractionId();
|
|
24
|
+
var currentInteractionId = interactionId.current;
|
|
25
|
+
if (!currentInteractionId) {
|
|
26
|
+
return;
|
|
27
|
+
}
|
|
28
|
+
addCohortingCustomData(currentInteractionId, key, value);
|
|
29
|
+
}
|
|
File without changes
|
|
@@ -9,7 +9,6 @@ var _excluded = ["__debug__element"];
|
|
|
9
9
|
import _regeneratorRuntime from "@babel/runtime/regenerator";
|
|
10
10
|
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
11
11
|
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
12
|
-
import { fg } from '@atlaskit/platform-feature-flags';
|
|
13
12
|
import { isVCRevisionEnabled } from '../../config';
|
|
14
13
|
import { getActiveInteraction } from '../../interaction-metrics';
|
|
15
14
|
import { attachAbortListeners } from './attachAbortListeners';
|
|
@@ -268,7 +267,7 @@ export var VCObserver = /*#__PURE__*/function () {
|
|
|
268
267
|
}
|
|
269
268
|
if (!_this.isPostInteraction) {
|
|
270
269
|
// Only create revision debug details if callbacks exist
|
|
271
|
-
shouldCreateDebugDetails = typeof window.__ufo_devtool_onVCRevisionReady__ === 'function' || typeof window.__on_ufo_vc_debug_data_ready === 'function'
|
|
270
|
+
shouldCreateDebugDetails = typeof window.__ufo_devtool_onVCRevisionReady__ === 'function' || typeof window.__on_ufo_vc_debug_data_ready === 'function';
|
|
272
271
|
if (shouldCreateDebugDetails) {
|
|
273
272
|
v1RevisionDebugDetails = getVCRevisionDebugDetails({
|
|
274
273
|
revision: 'fy25.01',
|
|
@@ -295,7 +294,7 @@ export var VCObserver = /*#__PURE__*/function () {
|
|
|
295
294
|
// Handle v2
|
|
296
295
|
(_window$__ufo_devtool2 = (_window2 = window).__ufo_devtool_onVCRevisionReady__) === null || _window$__ufo_devtool2 === void 0 || _window$__ufo_devtool2.call(_window2, v2RevisionDebugDetails);
|
|
297
296
|
}
|
|
298
|
-
if (typeof window.__on_ufo_vc_debug_data_ready === 'function'
|
|
297
|
+
if (typeof window.__on_ufo_vc_debug_data_ready === 'function') {
|
|
299
298
|
if (!isTTVCv1Disabled) {
|
|
300
299
|
(_window$__on_ufo_vc_d = (_window3 = window).__on_ufo_vc_debug_data_ready) === null || _window$__on_ufo_vc_d === void 0 || _window$__on_ufo_vc_d.call(_window3, v1RevisionDebugDetails);
|
|
301
300
|
}
|
|
@@ -175,7 +175,7 @@ var AbstractVCCalculatorBase = /*#__PURE__*/function () {
|
|
|
175
175
|
viewportPercentage: log.viewportPercentage
|
|
176
176
|
});
|
|
177
177
|
}) : []; // Only calculate enhanced debug details if devtool callbacks exist
|
|
178
|
-
shouldCalculateDebugDetails = !isPostInteraction && (typeof ((_window = window) === null || _window === void 0 ? void 0 : _window.__ufo_devtool_onVCRevisionReady__) === 'function' || typeof ((_window2 = window) === null || _window2 === void 0 ? void 0 : _window2.__on_ufo_vc_debug_data_ready) === 'function'
|
|
178
|
+
shouldCalculateDebugDetails = !isPostInteraction && (typeof ((_window = window) === null || _window === void 0 ? void 0 : _window.__ufo_devtool_onVCRevisionReady__) === 'function' || typeof ((_window2 = window) === null || _window2 === void 0 ? void 0 : _window2.__on_ufo_vc_debug_data_ready) === 'function');
|
|
179
179
|
if (shouldCalculateDebugDetails && allEntries && vcLogs) {
|
|
180
180
|
// Pre-sort vcLogs by time for efficient lookups
|
|
181
181
|
sortedVcLogs = _toConsumableArray(vcLogs).sort(function (a, b) {
|
|
@@ -286,7 +286,7 @@ var AbstractVCCalculatorBase = /*#__PURE__*/function () {
|
|
|
286
286
|
console.error('Error in onVCRevisionReady', e);
|
|
287
287
|
}
|
|
288
288
|
}
|
|
289
|
-
if (v3RevisionDebugDetails && typeof ((_window5 = window) === null || _window5 === void 0 ? void 0 : _window5.__on_ufo_vc_debug_data_ready) === 'function'
|
|
289
|
+
if (v3RevisionDebugDetails && typeof ((_window5 = window) === null || _window5 === void 0 ? void 0 : _window5.__on_ufo_vc_debug_data_ready) === 'function') {
|
|
290
290
|
try {
|
|
291
291
|
(_window6 = window) === null || _window6 === void 0 || (_window6$__on_ufo_vc_ = _window6.__on_ufo_vc_debug_data_ready) === null || _window6$__on_ufo_vc_ === void 0 || _window6$__on_ufo_vc_.call(_window6, v3RevisionDebugDetails);
|
|
292
292
|
} catch (e) {
|
|
@@ -13,7 +13,7 @@ import { RLLPlaceholderHandlers } from '../../vc-observer/observers/rll-placehol
|
|
|
13
13
|
import { createIntersectionObserver } from './intersection-observer';
|
|
14
14
|
import createMutationObserver from './mutation-observer';
|
|
15
15
|
import createPerformanceObserver from './performance-observer';
|
|
16
|
-
import
|
|
16
|
+
import checkWithinComponentAndExtractChildProps from './utils/check-within-component-and-extract-child-props';
|
|
17
17
|
import isInVCIgnoreIfNoLayoutShiftMarker from './utils/is-in-vc-ignore-if-no-layout-shift-marker';
|
|
18
18
|
function isElementVisible(element) {
|
|
19
19
|
if (!(element instanceof HTMLElement)) {
|
|
@@ -118,7 +118,7 @@ var ViewportObserver = /*#__PURE__*/function () {
|
|
|
118
118
|
_context2.prev = 4;
|
|
119
119
|
_loop = /*#__PURE__*/_regeneratorRuntime.mark(function _loop() {
|
|
120
120
|
var _this$intersectionObs8;
|
|
121
|
-
var addedNodeRef, addedNode, ssrState, SSRStateEnum, _this$intersectionObs, _this$intersectionObs2, ssrPlaceholderHandler, result, _this$intersectionObs3, _result, _this$intersectionObs4, sameDeletedNode, isInIgnoreLsMarker, isNoLsMarkerEnabled, _this$intersectionObs5, _this$intersectionObs6,
|
|
121
|
+
var addedNodeRef, addedNode, ssrState, SSRStateEnum, _this$intersectionObs, _this$intersectionObs2, ssrPlaceholderHandler, result, _this$intersectionObs3, _result, _this$intersectionObs4, sameDeletedNode, isInIgnoreLsMarker, isNoLsMarkerEnabled, _this$intersectionObs5, _this$intersectionObs6, _checkWithinComponent, isWithinThirdPartySegment, _this$intersectionObs7;
|
|
122
122
|
return _regeneratorRuntime.wrap(function _loop$(_context) {
|
|
123
123
|
while (1) switch (_context.prev = _context.next) {
|
|
124
124
|
case 0:
|
|
@@ -228,17 +228,16 @@ var ViewportObserver = /*#__PURE__*/function () {
|
|
|
228
228
|
(_this$intersectionObs6 = _this.intersectionObserver) === null || _this$intersectionObs6 === void 0 || _this$intersectionObs6.watchAndTag(addedNode, 'mutation:media');
|
|
229
229
|
return _context.abrupt("return", 0);
|
|
230
230
|
case 45:
|
|
231
|
-
|
|
231
|
+
_checkWithinComponent = checkWithinComponentAndExtractChildProps(addedNode, 'UFOThirdPartySegment'), isWithinThirdPartySegment = _checkWithinComponent.isWithin;
|
|
232
232
|
if (!isWithinThirdPartySegment) {
|
|
233
|
-
_context.next =
|
|
233
|
+
_context.next = 49;
|
|
234
234
|
break;
|
|
235
235
|
}
|
|
236
|
-
|
|
237
|
-
(_this$intersectionObs7 = _this.intersectionObserver) === null || _this$intersectionObs7 === void 0 || _this$intersectionObs7.watchAndTag(addedNode, assignedReason);
|
|
236
|
+
(_this$intersectionObs7 = _this.intersectionObserver) === null || _this$intersectionObs7 === void 0 || _this$intersectionObs7.watchAndTag(addedNode, 'mutation:third-party-element');
|
|
238
237
|
return _context.abrupt("return", 0);
|
|
239
|
-
case
|
|
238
|
+
case 49:
|
|
240
239
|
(_this$intersectionObs8 = _this.intersectionObserver) === null || _this$intersectionObs8 === void 0 || _this$intersectionObs8.watchAndTag(addedNode, createElementMutationsWatcher(removedNodeRects));
|
|
241
|
-
case
|
|
240
|
+
case 50:
|
|
242
241
|
case "end":
|
|
243
242
|
return _context.stop();
|
|
244
243
|
}
|
|
@@ -326,13 +325,11 @@ var ViewportObserver = /*#__PURE__*/function () {
|
|
|
326
325
|
}
|
|
327
326
|
};
|
|
328
327
|
}
|
|
329
|
-
var
|
|
330
|
-
isWithinThirdPartySegment =
|
|
331
|
-
ignoredReason = _checkThirdPartySegme2.ignoredReason;
|
|
328
|
+
var _checkWithinComponent2 = checkWithinComponentAndExtractChildProps(target, 'UFOThirdPartySegment'),
|
|
329
|
+
isWithinThirdPartySegment = _checkWithinComponent2.isWithin;
|
|
332
330
|
if (isWithinThirdPartySegment) {
|
|
333
|
-
var assignedReason = createMutationTypeWithIgnoredReason(ignoredReason || 'third-party-element');
|
|
334
331
|
return {
|
|
335
|
-
type:
|
|
332
|
+
type: 'mutation:third-party-element',
|
|
336
333
|
mutationData: {
|
|
337
334
|
attributeName: attributeName,
|
|
338
335
|
oldValue: oldValue,
|
|
@@ -1,19 +1,13 @@
|
|
|
1
1
|
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
2
|
-
import _typeof from "@babel/runtime/helpers/typeof";
|
|
3
2
|
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
4
3
|
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
5
4
|
import { fg } from '@atlaskit/platform-feature-flags';
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
var key = Object.keys(element).find(function (key) {
|
|
9
|
-
return key.startsWith('__reactFiber$') || key.startsWith('__reactInternalInstance$');
|
|
10
|
-
});
|
|
11
|
-
return key ? element[key] : null;
|
|
12
|
-
};
|
|
5
|
+
import findReactFiber from './find-react-fiber';
|
|
6
|
+
import getComponentName from './get-component-name';
|
|
13
7
|
|
|
14
8
|
// Using the React Fiber tree to traverse up the DOM and check if a node is within a specific component
|
|
15
9
|
// and extract child component props if needed.
|
|
16
|
-
export function checkWithinComponentAndExtractChildProps(node, targetComponentName, childComponentConfig) {
|
|
10
|
+
export default function checkWithinComponentAndExtractChildProps(node, targetComponentName, childComponentConfig) {
|
|
17
11
|
var fiber = null;
|
|
18
12
|
if (fg('platform_ufo_handle_non_react_element_for_3p')) {
|
|
19
13
|
// Walk up the DOM tree to find React fiber (handles non-React-rendered elements)
|
|
@@ -39,14 +33,7 @@ export function checkWithinComponentAndExtractChildProps(node, targetComponentNa
|
|
|
39
33
|
var currentFiber = fiber;
|
|
40
34
|
var childProp;
|
|
41
35
|
while (currentFiber) {
|
|
42
|
-
var componentName =
|
|
43
|
-
if (currentFiber.type) {
|
|
44
|
-
if (typeof currentFiber.type === 'function') {
|
|
45
|
-
componentName = currentFiber.type.displayName || currentFiber.type.name;
|
|
46
|
-
} else if (_typeof(currentFiber.type) === 'object' && (currentFiber.type.displayName || currentFiber.type.name)) {
|
|
47
|
-
componentName = currentFiber.type.displayName || currentFiber.type.name;
|
|
48
|
-
}
|
|
49
|
-
}
|
|
36
|
+
var componentName = getComponentName(currentFiber);
|
|
50
37
|
|
|
51
38
|
// Check if this is a child component we're looking for
|
|
52
39
|
if (childComponentConfig && componentName === childComponentConfig.componentName) {
|
|
@@ -70,21 +57,4 @@ export function checkWithinComponentAndExtractChildProps(node, targetComponentNa
|
|
|
70
57
|
return {
|
|
71
58
|
isWithin: false
|
|
72
59
|
};
|
|
73
|
-
}
|
|
74
|
-
|
|
75
|
-
// Check if the node is within a UFOThirdPartySegment and extract any UFOIgnoreHolds reason
|
|
76
|
-
export function checkThirdPartySegmentWithIgnoreReason(node) {
|
|
77
|
-
var result = checkWithinComponentAndExtractChildProps(node, 'UFOThirdPartySegment', {
|
|
78
|
-
componentName: 'UFOIgnoreHolds',
|
|
79
|
-
propName: 'reason'
|
|
80
|
-
});
|
|
81
|
-
return {
|
|
82
|
-
isWithinThirdPartySegment: result.isWithin,
|
|
83
|
-
ignoredReason: result.childProp
|
|
84
|
-
};
|
|
85
|
-
}
|
|
86
|
-
|
|
87
|
-
// Helper function to create mutation type from UFOIgnoreHoldsReason
|
|
88
|
-
export function createMutationTypeWithIgnoredReason(reason) {
|
|
89
|
-
return "mutation:".concat(reason);
|
|
90
60
|
}
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
// Helper function to find React fiber on an element
|
|
2
|
+
export default function findReactFiber(element) {
|
|
3
|
+
// Use for...in loop instead of Object.keys().find() to avoid creating an array
|
|
4
|
+
for (var key in element) {
|
|
5
|
+
if (key.startsWith('__reactFiber$') || key.startsWith('__reactInternalInstance$')) {
|
|
6
|
+
return element[key];
|
|
7
|
+
}
|
|
8
|
+
}
|
|
9
|
+
return null;
|
|
10
|
+
}
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import _typeof from "@babel/runtime/helpers/typeof";
|
|
2
|
+
// Helper function to extract component name from fiber
|
|
3
|
+
export default function getComponentName(fiber) {
|
|
4
|
+
var type = fiber === null || fiber === void 0 ? void 0 : fiber.type;
|
|
5
|
+
if (!type) {
|
|
6
|
+
return undefined;
|
|
7
|
+
}
|
|
8
|
+
if (typeof type === 'function' || _typeof(type) === 'object') {
|
|
9
|
+
return type.displayName || type.name;
|
|
10
|
+
}
|
|
11
|
+
return undefined;
|
|
12
|
+
}
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
import type { UFOCustomCohortDataProps } from './types';
|
|
2
|
+
export type { UFOCustomCohortDataProps } from './types';
|
|
3
|
+
export default function UFOCustomCohortData({ dataKey, value }: UFOCustomCohortDataProps): null;
|
|
4
|
+
export declare function addUFOCustomCohortData(key: string, value: number | boolean | string | null | undefined): void;
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
export default function checkWithinComponentAndExtractChildProps<T = string>(node: HTMLElement, targetComponentName: string, childComponentConfig?: {
|
|
2
|
+
componentName: string;
|
|
3
|
+
propName: string;
|
|
4
|
+
extractValue?: (props: any) => T;
|
|
5
|
+
}): {
|
|
6
|
+
isWithin: boolean;
|
|
7
|
+
childProp?: T;
|
|
8
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export default function findReactFiber(element: HTMLElement): any;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export default function getComponentName(fiber: any): string | undefined;
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
import type { UFOCustomCohortDataProps } from './types';
|
|
2
|
+
export type { UFOCustomCohortDataProps } from './types';
|
|
3
|
+
export default function UFOCustomCohortData({ dataKey, value }: UFOCustomCohortDataProps): null;
|
|
4
|
+
export declare function addUFOCustomCohortData(key: string, value: number | boolean | string | null | undefined): void;
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
export default function checkWithinComponentAndExtractChildProps<T = string>(node: HTMLElement, targetComponentName: string, childComponentConfig?: {
|
|
2
|
+
componentName: string;
|
|
3
|
+
propName: string;
|
|
4
|
+
extractValue?: (props: any) => T;
|
|
5
|
+
}): {
|
|
6
|
+
isWithin: boolean;
|
|
7
|
+
childProp?: T;
|
|
8
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export default function findReactFiber(element: HTMLElement): any;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export default function getComponentName(fiber: any): string | undefined;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/react-ufo",
|
|
3
|
-
"version": "4.
|
|
3
|
+
"version": "4.1.1",
|
|
4
4
|
"description": "Parts of React UFO that are publicly available",
|
|
5
5
|
"author": "Atlassian Pty Ltd",
|
|
6
6
|
"license": "Apache-2.0",
|
|
@@ -35,6 +35,7 @@
|
|
|
35
35
|
"./create-payload": "./src/create-payload/index.ts",
|
|
36
36
|
"./create-post-interaction-log-payload": "./src/create-post-interaction-log-payload/index.ts",
|
|
37
37
|
"./custom-data": "./src/custom-data/index.ts",
|
|
38
|
+
"./custom-cohort-data": "./src/custom-cohort-data/index.ts",
|
|
38
39
|
"./custom-mark": "./src/custom-mark/index.ts",
|
|
39
40
|
"./custom-spans": "./src/custom-spans/index.ts",
|
|
40
41
|
"./custom-timings": "./src/custom-timings/index.ts",
|
|
@@ -134,9 +135,6 @@
|
|
|
134
135
|
"platform_ufo_enable_media_for_ttvc_v3": {
|
|
135
136
|
"type": "boolean"
|
|
136
137
|
},
|
|
137
|
-
"platform_ufo_emit_vc_debug_data": {
|
|
138
|
-
"type": "boolean"
|
|
139
|
-
},
|
|
140
138
|
"ufo_return_relative_request_start": {
|
|
141
139
|
"type": "boolean"
|
|
142
140
|
},
|
|
@@ -1,15 +0,0 @@
|
|
|
1
|
-
import type { UFOIgnoreHoldsReason } from '../../../../ignore-holds';
|
|
2
|
-
import type { VCObserverEntryType } from '../../types';
|
|
3
|
-
export declare function checkWithinComponentAndExtractChildProps<T = string>(node: HTMLElement, targetComponentName: string, childComponentConfig?: {
|
|
4
|
-
componentName: string;
|
|
5
|
-
propName: string;
|
|
6
|
-
extractValue?: (props: any) => T;
|
|
7
|
-
}): {
|
|
8
|
-
isWithin: boolean;
|
|
9
|
-
childProp?: T;
|
|
10
|
-
};
|
|
11
|
-
export declare function checkThirdPartySegmentWithIgnoreReason(node: HTMLElement): {
|
|
12
|
-
isWithinThirdPartySegment: boolean;
|
|
13
|
-
ignoredReason?: UFOIgnoreHoldsReason;
|
|
14
|
-
};
|
|
15
|
-
export declare function createMutationTypeWithIgnoredReason(reason: UFOIgnoreHoldsReason): VCObserverEntryType;
|
|
@@ -1,15 +0,0 @@
|
|
|
1
|
-
import type { UFOIgnoreHoldsReason } from '../../../../ignore-holds';
|
|
2
|
-
import type { VCObserverEntryType } from '../../types';
|
|
3
|
-
export declare function checkWithinComponentAndExtractChildProps<T = string>(node: HTMLElement, targetComponentName: string, childComponentConfig?: {
|
|
4
|
-
componentName: string;
|
|
5
|
-
propName: string;
|
|
6
|
-
extractValue?: (props: any) => T;
|
|
7
|
-
}): {
|
|
8
|
-
isWithin: boolean;
|
|
9
|
-
childProp?: T;
|
|
10
|
-
};
|
|
11
|
-
export declare function checkThirdPartySegmentWithIgnoreReason(node: HTMLElement): {
|
|
12
|
-
isWithinThirdPartySegment: boolean;
|
|
13
|
-
ignoredReason?: UFOIgnoreHoldsReason;
|
|
14
|
-
};
|
|
15
|
-
export declare function createMutationTypeWithIgnoredReason(reason: UFOIgnoreHoldsReason): VCObserverEntryType;
|