@atlaskit/react-ufo 2.4.4 → 2.4.6
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 +22 -0
- package/dist/cjs/create-payload/common/utils/index.js +7 -8
- package/dist/cjs/create-payload/index.js +16 -12
- package/dist/cjs/vc/vc-observer/observers/index.js +12 -40
- package/dist/es2019/create-payload/common/utils/index.js +7 -10
- package/dist/es2019/create-payload/index.js +13 -8
- package/dist/es2019/vc/vc-observer/observers/index.js +12 -20
- package/dist/esm/create-payload/common/utils/index.js +7 -8
- package/dist/esm/create-payload/index.js +16 -12
- package/dist/esm/vc/vc-observer/observers/index.js +12 -40
- package/dist/types/common/vc/types.d.ts +1 -1
- package/dist/types/create-payload/index.d.ts +120 -496
- package/dist/types/vc/vc-observer/observers/index.d.ts +0 -1
- package/dist/types-ts4.5/common/vc/types.d.ts +1 -1
- package/dist/types-ts4.5/create-payload/index.d.ts +120 -496
- package/dist/types-ts4.5/vc/vc-observer/observers/index.d.ts +0 -1
- package/package.json +4 -1
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,27 @@
|
|
|
1
1
|
# @atlaskit/ufo-interaction-ignore
|
|
2
2
|
|
|
3
|
+
## 2.4.6
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- [#174829](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/174829)
|
|
8
|
+
[`381735c03773b`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/381735c03773b) -
|
|
9
|
+
add ufo: prefix to error count and stylesheet count metrics
|
|
10
|
+
- [#174760](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/174760)
|
|
11
|
+
[`0c5bbf0079bee`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/0c5bbf0079bee) -
|
|
12
|
+
Remove display style attribute mutation check
|
|
13
|
+
|
|
14
|
+
## 2.4.5
|
|
15
|
+
|
|
16
|
+
### Patch Changes
|
|
17
|
+
|
|
18
|
+
- [#172240](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/172240)
|
|
19
|
+
[`db973dafd5ae2`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/db973dafd5ae2) -
|
|
20
|
+
correctly feature flag and optimise buildSegmentTree function
|
|
21
|
+
- [#172231](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/172231)
|
|
22
|
+
[`de6f706c54af6`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/de6f706c54af6) -
|
|
23
|
+
[ED-25937] Skip TTVC calculation from changes that comes from the Editor container
|
|
24
|
+
|
|
3
25
|
## 2.4.4
|
|
4
26
|
|
|
5
27
|
### Patch Changes
|
|
@@ -27,20 +27,19 @@ function buildSegmentTree(labelStacks) {
|
|
|
27
27
|
};
|
|
28
28
|
labelStacks.forEach(function (labelStack) {
|
|
29
29
|
var currentNode = r;
|
|
30
|
-
labelStack.forEach(function (label
|
|
31
|
-
var _currentNode$c;
|
|
30
|
+
labelStack.forEach(function (label) {
|
|
32
31
|
var name = label.name;
|
|
33
32
|
var id = isSegmentLabel(label) ? label.segmentId : undefined;
|
|
34
|
-
var key = id !== undefined ? id
|
|
35
|
-
if (
|
|
33
|
+
var key = id !== undefined ? id : name;
|
|
34
|
+
if (!currentNode.c) {
|
|
35
|
+
currentNode.c = {};
|
|
36
|
+
}
|
|
37
|
+
if (!currentNode.c[key]) {
|
|
36
38
|
currentNode.c[key] = {
|
|
37
39
|
n: name
|
|
38
40
|
};
|
|
39
41
|
}
|
|
40
|
-
currentNode =
|
|
41
|
-
if (index < labelStack.length - 1) {
|
|
42
|
-
currentNode.c = _objectSpread({}, currentNode.c || {});
|
|
43
|
-
}
|
|
42
|
+
currentNode = currentNode.c[key];
|
|
44
43
|
});
|
|
45
44
|
});
|
|
46
45
|
return {
|
|
@@ -638,16 +638,22 @@ function getStylesheetMetrics() {
|
|
|
638
638
|
}
|
|
639
639
|
}, 0);
|
|
640
640
|
return {
|
|
641
|
-
stylesheets: stylesheetCount,
|
|
642
|
-
styleElements: styleElements,
|
|
643
|
-
styleProps: styleProps.length,
|
|
644
|
-
styleDeclarations: styleDeclarations,
|
|
645
|
-
cssrules: cssrules
|
|
641
|
+
'ufo:stylesheets': stylesheetCount,
|
|
642
|
+
'ufo:styleElements': styleElements,
|
|
643
|
+
'ufo:styleProps': styleProps.length,
|
|
644
|
+
'ufo:styleDeclarations': styleDeclarations,
|
|
645
|
+
'ufo:cssrules': cssrules
|
|
646
646
|
};
|
|
647
647
|
} catch (e) {
|
|
648
648
|
return {};
|
|
649
649
|
}
|
|
650
650
|
}
|
|
651
|
+
function getErrorCounts(interaction) {
|
|
652
|
+
return {
|
|
653
|
+
'ufo:errors:globalCount': (0, _globalErrorHandler.getGlobalErrorCount)(),
|
|
654
|
+
'ufo:errors:count': interaction.errors.length
|
|
655
|
+
};
|
|
656
|
+
}
|
|
651
657
|
function createInteractionMetricsPayload(interaction, interactionId) {
|
|
652
658
|
var _window$location, _config$additionalPay;
|
|
653
659
|
var interactionPayloadStart = performance.now();
|
|
@@ -670,9 +676,9 @@ function createInteractionMetricsPayload(interaction, interactionId) {
|
|
|
670
676
|
var pageVisibilityAtTTI = getPageVisibilityUpToTTI(interaction);
|
|
671
677
|
var pageVisibilityAtTTAI = getPageVisibilityUpToTTAI(interaction);
|
|
672
678
|
var segments = config.killswitchNestedSegments ? [] : knownSegments;
|
|
673
|
-
var segmentTree = (0, _utils.buildSegmentTree)(segments.map(function (segment) {
|
|
679
|
+
var segmentTree = _constants.REACT_UFO_VERSION === '2.0.0' ? (0, _utils.buildSegmentTree)(segments.map(function (segment) {
|
|
674
680
|
return segment.labelStack;
|
|
675
|
-
}));
|
|
681
|
+
})) : {};
|
|
676
682
|
var isDetailedPayload = pageVisibilityAtTTAI === 'visible';
|
|
677
683
|
var isPageLoad = type === 'page_load';
|
|
678
684
|
var calculatePageVisibilityFromTheStartOfPageLoad = config.enableBetterPageVisibilityApi && isPageLoad;
|
|
@@ -742,7 +748,7 @@ function createInteractionMetricsPayload(interaction, interactionId) {
|
|
|
742
748
|
source: 'measured',
|
|
743
749
|
tags: ['observability'],
|
|
744
750
|
attributes: {
|
|
745
|
-
properties: _objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread({
|
|
751
|
+
properties: _objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread({
|
|
746
752
|
// basic
|
|
747
753
|
'event:hostname': ((_window$location = window.location) === null || _window$location === void 0 ? void 0 : _window$location.hostname) || 'unknown',
|
|
748
754
|
'event:product': config.product,
|
|
@@ -756,8 +762,7 @@ function createInteractionMetricsPayload(interaction, interactionId) {
|
|
|
756
762
|
'event:region': config.region || 'unknown',
|
|
757
763
|
'experience:key': 'custom.interaction-metrics',
|
|
758
764
|
'experience:name': newUFOName
|
|
759
|
-
}, getBrowserMetadata()), getSSRProperties(type)), getPPSMetrics(interaction)), getPaintMetrics(type)), getNavigationMetrics(type)), getVCMetrics(interaction)), (_config$additionalPay = config.additionalPayloadData) === null || _config$additionalPay === void 0 ? void 0 : _config$additionalPay.call(config, interaction)), getTracingContextData(interaction)), getStylesheetMetrics()), {}, {
|
|
760
|
-
errorCount: (0, _globalErrorHandler.getGlobalErrorCount)(),
|
|
765
|
+
}, getBrowserMetadata()), getSSRProperties(type)), getPPSMetrics(interaction)), getPaintMetrics(type)), getNavigationMetrics(type)), getVCMetrics(interaction)), (_config$additionalPay = config.additionalPayloadData) === null || _config$additionalPay === void 0 ? void 0 : _config$additionalPay.call(config, interaction)), getTracingContextData(interaction)), getStylesheetMetrics()), getErrorCounts(interaction)), {}, {
|
|
761
766
|
interactionMetrics: _objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread({
|
|
762
767
|
namePrefix: config.namePrefix || '',
|
|
763
768
|
segmentPrefix: config.segmentPrefix || '',
|
|
@@ -788,8 +793,7 @@ function createInteractionMetricsPayload(interaction, interactionId) {
|
|
|
788
793
|
}),
|
|
789
794
|
marks: optimizeMarks(interaction.marks),
|
|
790
795
|
customData: optimizeCustomData(interaction),
|
|
791
|
-
reactProfilerTimings: optimizeReactProfilerTimings(interaction.reactProfilerTimings, start)
|
|
792
|
-
errorCount: interaction.errors.length
|
|
796
|
+
reactProfilerTimings: optimizeReactProfilerTimings(interaction.reactProfilerTimings, start)
|
|
793
797
|
}, labelStack), getPageLoadInteractionMetrics()), getDetailedInteractionMetrics()), getPageLoadDetailedInteractionMetrics()), getBm3TrackerTimings(interaction)),
|
|
794
798
|
'ufo:payloadTime': (0, _roundNumber.roundEpsilon)(performance.now() - interactionPayloadStart)
|
|
795
799
|
})
|
|
@@ -5,7 +5,6 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
5
5
|
value: true
|
|
6
6
|
});
|
|
7
7
|
exports.Observers = void 0;
|
|
8
|
-
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
|
|
9
8
|
var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
|
|
10
9
|
var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
|
|
11
10
|
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
@@ -13,9 +12,6 @@ var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
|
|
|
13
12
|
var _vcUtils = require("../media-wrapper/vc-utils");
|
|
14
13
|
var _editorLnv = require("./editor-lnv");
|
|
15
14
|
var _ssrPlaceholders = require("./ssr-placeholders");
|
|
16
|
-
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; } } }; }
|
|
17
|
-
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; } }
|
|
18
|
-
function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
|
|
19
15
|
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; }
|
|
20
16
|
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; }
|
|
21
17
|
var state = {
|
|
@@ -23,6 +19,12 @@ var state = {
|
|
|
23
19
|
waitingForFirstRender: 2,
|
|
24
20
|
ignoring: 3
|
|
25
21
|
};
|
|
22
|
+
function isInsideEditorContainer(target) {
|
|
23
|
+
if (!target || typeof target.closest !== 'function') {
|
|
24
|
+
return false;
|
|
25
|
+
}
|
|
26
|
+
return Boolean(target.closest('.ProseMirror'));
|
|
27
|
+
}
|
|
26
28
|
var Observers = exports.Observers = /*#__PURE__*/function () {
|
|
27
29
|
function Observers(opts) {
|
|
28
30
|
var _this = this;
|
|
@@ -196,8 +198,7 @@ var Observers = exports.Observers = /*#__PURE__*/function () {
|
|
|
196
198
|
});
|
|
197
199
|
} else if (mutation.type === 'attributes') {
|
|
198
200
|
if (mutation.target instanceof HTMLElement) {
|
|
199
|
-
|
|
200
|
-
if ((0, _platformFeatureFlags.fg)('platform-ufo-vc-observe-attributes') || isDisplayStyleAttributeMutation) {
|
|
201
|
+
if ((0, _platformFeatureFlags.fg)('platform-ufo-vc-observe-attributes')) {
|
|
201
202
|
_this2.observeElement(mutation.target, mutation, 'attr', ignoreReason);
|
|
202
203
|
}
|
|
203
204
|
}
|
|
@@ -206,40 +207,6 @@ var Observers = exports.Observers = /*#__PURE__*/function () {
|
|
|
206
207
|
_this2.measureStop();
|
|
207
208
|
}) : null;
|
|
208
209
|
}
|
|
209
|
-
}, {
|
|
210
|
-
key: "getStyleDisplay",
|
|
211
|
-
value: function getStyleDisplay(styleAttributeValue) {
|
|
212
|
-
if (!styleAttributeValue) {
|
|
213
|
-
return undefined;
|
|
214
|
-
}
|
|
215
|
-
|
|
216
|
-
// Split the style string into individual declarations
|
|
217
|
-
var declarations = styleAttributeValue.split(';');
|
|
218
|
-
// Iterate over each declaration
|
|
219
|
-
var _iterator = _createForOfIteratorHelper(declarations),
|
|
220
|
-
_step;
|
|
221
|
-
try {
|
|
222
|
-
for (_iterator.s(); !(_step = _iterator.n()).done;) {
|
|
223
|
-
var declaration = _step.value;
|
|
224
|
-
// Trim whitespace and split into property and value
|
|
225
|
-
var _declaration$split$ma = declaration.split(':').map(function (part) {
|
|
226
|
-
return part.trim();
|
|
227
|
-
}),
|
|
228
|
-
_declaration$split$ma2 = (0, _slicedToArray2.default)(_declaration$split$ma, 2),
|
|
229
|
-
property = _declaration$split$ma2[0],
|
|
230
|
-
value = _declaration$split$ma2[1];
|
|
231
|
-
// Check if the property is 'display'
|
|
232
|
-
if (property && property.toLowerCase() === 'display') {
|
|
233
|
-
return value;
|
|
234
|
-
}
|
|
235
|
-
}
|
|
236
|
-
} catch (err) {
|
|
237
|
-
_iterator.e(err);
|
|
238
|
-
} finally {
|
|
239
|
-
_iterator.f();
|
|
240
|
-
}
|
|
241
|
-
return undefined;
|
|
242
|
-
}
|
|
243
210
|
}, {
|
|
244
211
|
key: "getElementName",
|
|
245
212
|
value: function getElementName(element) {
|
|
@@ -297,6 +264,11 @@ var Observers = exports.Observers = /*#__PURE__*/function () {
|
|
|
297
264
|
data.ignoreReason = 'not-visible';
|
|
298
265
|
}
|
|
299
266
|
}
|
|
267
|
+
if ((0, _platformFeatureFlags.fg)('platform_editor_ed-25937_ignore_mutations_for_ttvc')) {
|
|
268
|
+
if (isInsideEditorContainer(target)) {
|
|
269
|
+
data.ignoreReason = 'editor-container-mutation';
|
|
270
|
+
}
|
|
271
|
+
}
|
|
300
272
|
_this3.callbacks.forEach(function (callback) {
|
|
301
273
|
var elementName;
|
|
302
274
|
try {
|
|
@@ -13,22 +13,19 @@ export function buildSegmentTree(labelStacks) {
|
|
|
13
13
|
};
|
|
14
14
|
labelStacks.forEach(labelStack => {
|
|
15
15
|
let currentNode = r;
|
|
16
|
-
labelStack.forEach(
|
|
17
|
-
var _currentNode$c;
|
|
16
|
+
labelStack.forEach(label => {
|
|
18
17
|
const name = label.name;
|
|
19
18
|
const id = isSegmentLabel(label) ? label.segmentId : undefined;
|
|
20
|
-
const key = id !== undefined ? id
|
|
21
|
-
if (
|
|
19
|
+
const key = id !== undefined ? id : name;
|
|
20
|
+
if (!currentNode.c) {
|
|
21
|
+
currentNode.c = {};
|
|
22
|
+
}
|
|
23
|
+
if (!currentNode.c[key]) {
|
|
22
24
|
currentNode.c[key] = {
|
|
23
25
|
n: name
|
|
24
26
|
};
|
|
25
27
|
}
|
|
26
|
-
currentNode =
|
|
27
|
-
if (index < labelStack.length - 1) {
|
|
28
|
-
currentNode.c = {
|
|
29
|
-
...(currentNode.c || {})
|
|
30
|
-
};
|
|
31
|
-
}
|
|
28
|
+
currentNode = currentNode.c[key];
|
|
32
29
|
});
|
|
33
30
|
});
|
|
34
31
|
return {
|
|
@@ -630,16 +630,22 @@ function getStylesheetMetrics() {
|
|
|
630
630
|
}
|
|
631
631
|
}, 0);
|
|
632
632
|
return {
|
|
633
|
-
stylesheets: stylesheetCount,
|
|
634
|
-
styleElements,
|
|
635
|
-
styleProps: styleProps.length,
|
|
636
|
-
styleDeclarations,
|
|
637
|
-
cssrules: cssrules
|
|
633
|
+
'ufo:stylesheets': stylesheetCount,
|
|
634
|
+
'ufo:styleElements': styleElements,
|
|
635
|
+
'ufo:styleProps': styleProps.length,
|
|
636
|
+
'ufo:styleDeclarations': styleDeclarations,
|
|
637
|
+
'ufo:cssrules': cssrules
|
|
638
638
|
};
|
|
639
639
|
} catch (e) {
|
|
640
640
|
return {};
|
|
641
641
|
}
|
|
642
642
|
}
|
|
643
|
+
function getErrorCounts(interaction) {
|
|
644
|
+
return {
|
|
645
|
+
'ufo:errors:globalCount': getGlobalErrorCount(),
|
|
646
|
+
'ufo:errors:count': interaction.errors.length
|
|
647
|
+
};
|
|
648
|
+
}
|
|
643
649
|
function createInteractionMetricsPayload(interaction, interactionId) {
|
|
644
650
|
var _window$location, _config$additionalPay;
|
|
645
651
|
const interactionPayloadStart = performance.now();
|
|
@@ -664,7 +670,7 @@ function createInteractionMetricsPayload(interaction, interactionId) {
|
|
|
664
670
|
const pageVisibilityAtTTI = getPageVisibilityUpToTTI(interaction);
|
|
665
671
|
const pageVisibilityAtTTAI = getPageVisibilityUpToTTAI(interaction);
|
|
666
672
|
const segments = config.killswitchNestedSegments ? [] : knownSegments;
|
|
667
|
-
const segmentTree = buildSegmentTree(segments.map(segment => segment.labelStack));
|
|
673
|
+
const segmentTree = REACT_UFO_VERSION === '2.0.0' ? buildSegmentTree(segments.map(segment => segment.labelStack)) : {};
|
|
668
674
|
const isDetailedPayload = pageVisibilityAtTTAI === 'visible';
|
|
669
675
|
const isPageLoad = type === 'page_load';
|
|
670
676
|
const calculatePageVisibilityFromTheStartOfPageLoad = config.enableBetterPageVisibilityApi && isPageLoad;
|
|
@@ -759,7 +765,7 @@ function createInteractionMetricsPayload(interaction, interactionId) {
|
|
|
759
765
|
...((_config$additionalPay = config.additionalPayloadData) === null || _config$additionalPay === void 0 ? void 0 : _config$additionalPay.call(config, interaction)),
|
|
760
766
|
...getTracingContextData(interaction),
|
|
761
767
|
...getStylesheetMetrics(),
|
|
762
|
-
|
|
768
|
+
...getErrorCounts(interaction),
|
|
763
769
|
interactionMetrics: {
|
|
764
770
|
namePrefix: config.namePrefix || '',
|
|
765
771
|
segmentPrefix: config.segmentPrefix || '',
|
|
@@ -791,7 +797,6 @@ function createInteractionMetricsPayload(interaction, interactionId) {
|
|
|
791
797
|
marks: optimizeMarks(interaction.marks),
|
|
792
798
|
customData: optimizeCustomData(interaction),
|
|
793
799
|
reactProfilerTimings: optimizeReactProfilerTimings(interaction.reactProfilerTimings, start),
|
|
794
|
-
errorCount: interaction.errors.length,
|
|
795
800
|
...labelStack,
|
|
796
801
|
...getPageLoadInteractionMetrics(),
|
|
797
802
|
...getDetailedInteractionMetrics(),
|
|
@@ -8,6 +8,12 @@ const state = {
|
|
|
8
8
|
waitingForFirstRender: 2,
|
|
9
9
|
ignoring: 3
|
|
10
10
|
};
|
|
11
|
+
function isInsideEditorContainer(target) {
|
|
12
|
+
if (!target || typeof target.closest !== 'function') {
|
|
13
|
+
return false;
|
|
14
|
+
}
|
|
15
|
+
return Boolean(target.closest('.ProseMirror'));
|
|
16
|
+
}
|
|
11
17
|
export class Observers {
|
|
12
18
|
constructor(opts) {
|
|
13
19
|
_defineProperty(this, "observedMutations", new WeakMap());
|
|
@@ -164,8 +170,7 @@ export class Observers {
|
|
|
164
170
|
});
|
|
165
171
|
} else if (mutation.type === 'attributes') {
|
|
166
172
|
if (mutation.target instanceof HTMLElement) {
|
|
167
|
-
|
|
168
|
-
if (fg('platform-ufo-vc-observe-attributes') || isDisplayStyleAttributeMutation) {
|
|
173
|
+
if (fg('platform-ufo-vc-observe-attributes')) {
|
|
169
174
|
this.observeElement(mutation.target, mutation, 'attr', ignoreReason);
|
|
170
175
|
}
|
|
171
176
|
}
|
|
@@ -174,24 +179,6 @@ export class Observers {
|
|
|
174
179
|
this.measureStop();
|
|
175
180
|
}) : null;
|
|
176
181
|
}
|
|
177
|
-
getStyleDisplay(styleAttributeValue) {
|
|
178
|
-
if (!styleAttributeValue) {
|
|
179
|
-
return undefined;
|
|
180
|
-
}
|
|
181
|
-
|
|
182
|
-
// Split the style string into individual declarations
|
|
183
|
-
const declarations = styleAttributeValue.split(';');
|
|
184
|
-
// Iterate over each declaration
|
|
185
|
-
for (const declaration of declarations) {
|
|
186
|
-
// Trim whitespace and split into property and value
|
|
187
|
-
const [property, value] = declaration.split(':').map(part => part.trim());
|
|
188
|
-
// Check if the property is 'display'
|
|
189
|
-
if (property && property.toLowerCase() === 'display') {
|
|
190
|
-
return value;
|
|
191
|
-
}
|
|
192
|
-
}
|
|
193
|
-
return undefined;
|
|
194
|
-
}
|
|
195
182
|
getElementName(element) {
|
|
196
183
|
try {
|
|
197
184
|
const tagName = element.localName;
|
|
@@ -245,6 +232,11 @@ export class Observers {
|
|
|
245
232
|
data.ignoreReason = 'not-visible';
|
|
246
233
|
}
|
|
247
234
|
}
|
|
235
|
+
if (fg('platform_editor_ed-25937_ignore_mutations_for_ttvc')) {
|
|
236
|
+
if (isInsideEditorContainer(target)) {
|
|
237
|
+
data.ignoreReason = 'editor-container-mutation';
|
|
238
|
+
}
|
|
239
|
+
}
|
|
248
240
|
this.callbacks.forEach(callback => {
|
|
249
241
|
let elementName;
|
|
250
242
|
try {
|
|
@@ -16,20 +16,19 @@ export function buildSegmentTree(labelStacks) {
|
|
|
16
16
|
};
|
|
17
17
|
labelStacks.forEach(function (labelStack) {
|
|
18
18
|
var currentNode = r;
|
|
19
|
-
labelStack.forEach(function (label
|
|
20
|
-
var _currentNode$c;
|
|
19
|
+
labelStack.forEach(function (label) {
|
|
21
20
|
var name = label.name;
|
|
22
21
|
var id = isSegmentLabel(label) ? label.segmentId : undefined;
|
|
23
|
-
var key = id !== undefined ? id
|
|
24
|
-
if (
|
|
22
|
+
var key = id !== undefined ? id : name;
|
|
23
|
+
if (!currentNode.c) {
|
|
24
|
+
currentNode.c = {};
|
|
25
|
+
}
|
|
26
|
+
if (!currentNode.c[key]) {
|
|
25
27
|
currentNode.c[key] = {
|
|
26
28
|
n: name
|
|
27
29
|
};
|
|
28
30
|
}
|
|
29
|
-
currentNode =
|
|
30
|
-
if (index < labelStack.length - 1) {
|
|
31
|
-
currentNode.c = _objectSpread({}, currentNode.c || {});
|
|
32
|
-
}
|
|
31
|
+
currentNode = currentNode.c[key];
|
|
33
32
|
});
|
|
34
33
|
});
|
|
35
34
|
return {
|
|
@@ -628,16 +628,22 @@ function getStylesheetMetrics() {
|
|
|
628
628
|
}
|
|
629
629
|
}, 0);
|
|
630
630
|
return {
|
|
631
|
-
stylesheets: stylesheetCount,
|
|
632
|
-
styleElements: styleElements,
|
|
633
|
-
styleProps: styleProps.length,
|
|
634
|
-
styleDeclarations: styleDeclarations,
|
|
635
|
-
cssrules: cssrules
|
|
631
|
+
'ufo:stylesheets': stylesheetCount,
|
|
632
|
+
'ufo:styleElements': styleElements,
|
|
633
|
+
'ufo:styleProps': styleProps.length,
|
|
634
|
+
'ufo:styleDeclarations': styleDeclarations,
|
|
635
|
+
'ufo:cssrules': cssrules
|
|
636
636
|
};
|
|
637
637
|
} catch (e) {
|
|
638
638
|
return {};
|
|
639
639
|
}
|
|
640
640
|
}
|
|
641
|
+
function getErrorCounts(interaction) {
|
|
642
|
+
return {
|
|
643
|
+
'ufo:errors:globalCount': getGlobalErrorCount(),
|
|
644
|
+
'ufo:errors:count': interaction.errors.length
|
|
645
|
+
};
|
|
646
|
+
}
|
|
641
647
|
function createInteractionMetricsPayload(interaction, interactionId) {
|
|
642
648
|
var _window$location, _config$additionalPay;
|
|
643
649
|
var interactionPayloadStart = performance.now();
|
|
@@ -660,9 +666,9 @@ function createInteractionMetricsPayload(interaction, interactionId) {
|
|
|
660
666
|
var pageVisibilityAtTTI = getPageVisibilityUpToTTI(interaction);
|
|
661
667
|
var pageVisibilityAtTTAI = getPageVisibilityUpToTTAI(interaction);
|
|
662
668
|
var segments = config.killswitchNestedSegments ? [] : knownSegments;
|
|
663
|
-
var segmentTree = buildSegmentTree(segments.map(function (segment) {
|
|
669
|
+
var segmentTree = REACT_UFO_VERSION === '2.0.0' ? buildSegmentTree(segments.map(function (segment) {
|
|
664
670
|
return segment.labelStack;
|
|
665
|
-
}));
|
|
671
|
+
})) : {};
|
|
666
672
|
var isDetailedPayload = pageVisibilityAtTTAI === 'visible';
|
|
667
673
|
var isPageLoad = type === 'page_load';
|
|
668
674
|
var calculatePageVisibilityFromTheStartOfPageLoad = config.enableBetterPageVisibilityApi && isPageLoad;
|
|
@@ -732,7 +738,7 @@ function createInteractionMetricsPayload(interaction, interactionId) {
|
|
|
732
738
|
source: 'measured',
|
|
733
739
|
tags: ['observability'],
|
|
734
740
|
attributes: {
|
|
735
|
-
properties: _objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread({
|
|
741
|
+
properties: _objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread({
|
|
736
742
|
// basic
|
|
737
743
|
'event:hostname': ((_window$location = window.location) === null || _window$location === void 0 ? void 0 : _window$location.hostname) || 'unknown',
|
|
738
744
|
'event:product': config.product,
|
|
@@ -746,8 +752,7 @@ function createInteractionMetricsPayload(interaction, interactionId) {
|
|
|
746
752
|
'event:region': config.region || 'unknown',
|
|
747
753
|
'experience:key': 'custom.interaction-metrics',
|
|
748
754
|
'experience:name': newUFOName
|
|
749
|
-
}, getBrowserMetadata()), getSSRProperties(type)), getPPSMetrics(interaction)), getPaintMetrics(type)), getNavigationMetrics(type)), getVCMetrics(interaction)), (_config$additionalPay = config.additionalPayloadData) === null || _config$additionalPay === void 0 ? void 0 : _config$additionalPay.call(config, interaction)), getTracingContextData(interaction)), getStylesheetMetrics()), {}, {
|
|
750
|
-
errorCount: getGlobalErrorCount(),
|
|
755
|
+
}, getBrowserMetadata()), getSSRProperties(type)), getPPSMetrics(interaction)), getPaintMetrics(type)), getNavigationMetrics(type)), getVCMetrics(interaction)), (_config$additionalPay = config.additionalPayloadData) === null || _config$additionalPay === void 0 ? void 0 : _config$additionalPay.call(config, interaction)), getTracingContextData(interaction)), getStylesheetMetrics()), getErrorCounts(interaction)), {}, {
|
|
751
756
|
interactionMetrics: _objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread({
|
|
752
757
|
namePrefix: config.namePrefix || '',
|
|
753
758
|
segmentPrefix: config.segmentPrefix || '',
|
|
@@ -778,8 +783,7 @@ function createInteractionMetricsPayload(interaction, interactionId) {
|
|
|
778
783
|
}),
|
|
779
784
|
marks: optimizeMarks(interaction.marks),
|
|
780
785
|
customData: optimizeCustomData(interaction),
|
|
781
|
-
reactProfilerTimings: optimizeReactProfilerTimings(interaction.reactProfilerTimings, start)
|
|
782
|
-
errorCount: interaction.errors.length
|
|
786
|
+
reactProfilerTimings: optimizeReactProfilerTimings(interaction.reactProfilerTimings, start)
|
|
783
787
|
}, labelStack), getPageLoadInteractionMetrics()), getDetailedInteractionMetrics()), getPageLoadDetailedInteractionMetrics()), getBm3TrackerTimings(interaction)),
|
|
784
788
|
'ufo:payloadTime': roundEpsilon(performance.now() - interactionPayloadStart)
|
|
785
789
|
})
|
|
@@ -1,10 +1,6 @@
|
|
|
1
|
-
import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
|
|
2
1
|
import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
|
|
3
2
|
import _createClass from "@babel/runtime/helpers/createClass";
|
|
4
3
|
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
5
|
-
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; } } }; }
|
|
6
|
-
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; } }
|
|
7
|
-
function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
|
|
8
4
|
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; }
|
|
9
5
|
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; }
|
|
10
6
|
import { fg } from '@atlaskit/platform-feature-flags';
|
|
@@ -16,6 +12,12 @@ var state = {
|
|
|
16
12
|
waitingForFirstRender: 2,
|
|
17
13
|
ignoring: 3
|
|
18
14
|
};
|
|
15
|
+
function isInsideEditorContainer(target) {
|
|
16
|
+
if (!target || typeof target.closest !== 'function') {
|
|
17
|
+
return false;
|
|
18
|
+
}
|
|
19
|
+
return Boolean(target.closest('.ProseMirror'));
|
|
20
|
+
}
|
|
19
21
|
export var Observers = /*#__PURE__*/function () {
|
|
20
22
|
function Observers(opts) {
|
|
21
23
|
var _this = this;
|
|
@@ -189,8 +191,7 @@ export var Observers = /*#__PURE__*/function () {
|
|
|
189
191
|
});
|
|
190
192
|
} else if (mutation.type === 'attributes') {
|
|
191
193
|
if (mutation.target instanceof HTMLElement) {
|
|
192
|
-
|
|
193
|
-
if (fg('platform-ufo-vc-observe-attributes') || isDisplayStyleAttributeMutation) {
|
|
194
|
+
if (fg('platform-ufo-vc-observe-attributes')) {
|
|
194
195
|
_this2.observeElement(mutation.target, mutation, 'attr', ignoreReason);
|
|
195
196
|
}
|
|
196
197
|
}
|
|
@@ -199,40 +200,6 @@ export var Observers = /*#__PURE__*/function () {
|
|
|
199
200
|
_this2.measureStop();
|
|
200
201
|
}) : null;
|
|
201
202
|
}
|
|
202
|
-
}, {
|
|
203
|
-
key: "getStyleDisplay",
|
|
204
|
-
value: function getStyleDisplay(styleAttributeValue) {
|
|
205
|
-
if (!styleAttributeValue) {
|
|
206
|
-
return undefined;
|
|
207
|
-
}
|
|
208
|
-
|
|
209
|
-
// Split the style string into individual declarations
|
|
210
|
-
var declarations = styleAttributeValue.split(';');
|
|
211
|
-
// Iterate over each declaration
|
|
212
|
-
var _iterator = _createForOfIteratorHelper(declarations),
|
|
213
|
-
_step;
|
|
214
|
-
try {
|
|
215
|
-
for (_iterator.s(); !(_step = _iterator.n()).done;) {
|
|
216
|
-
var declaration = _step.value;
|
|
217
|
-
// Trim whitespace and split into property and value
|
|
218
|
-
var _declaration$split$ma = declaration.split(':').map(function (part) {
|
|
219
|
-
return part.trim();
|
|
220
|
-
}),
|
|
221
|
-
_declaration$split$ma2 = _slicedToArray(_declaration$split$ma, 2),
|
|
222
|
-
property = _declaration$split$ma2[0],
|
|
223
|
-
value = _declaration$split$ma2[1];
|
|
224
|
-
// Check if the property is 'display'
|
|
225
|
-
if (property && property.toLowerCase() === 'display') {
|
|
226
|
-
return value;
|
|
227
|
-
}
|
|
228
|
-
}
|
|
229
|
-
} catch (err) {
|
|
230
|
-
_iterator.e(err);
|
|
231
|
-
} finally {
|
|
232
|
-
_iterator.f();
|
|
233
|
-
}
|
|
234
|
-
return undefined;
|
|
235
|
-
}
|
|
236
203
|
}, {
|
|
237
204
|
key: "getElementName",
|
|
238
205
|
value: function getElementName(element) {
|
|
@@ -290,6 +257,11 @@ export var Observers = /*#__PURE__*/function () {
|
|
|
290
257
|
data.ignoreReason = 'not-visible';
|
|
291
258
|
}
|
|
292
259
|
}
|
|
260
|
+
if (fg('platform_editor_ed-25937_ignore_mutations_for_ttvc')) {
|
|
261
|
+
if (isInsideEditorContainer(target)) {
|
|
262
|
+
data.ignoreReason = 'editor-container-mutation';
|
|
263
|
+
}
|
|
264
|
+
}
|
|
293
265
|
_this3.callbacks.forEach(function (callback) {
|
|
294
266
|
var elementName;
|
|
295
267
|
try {
|
|
@@ -35,7 +35,7 @@ export type VCEntryType = {
|
|
|
35
35
|
vc: number;
|
|
36
36
|
elements: string[];
|
|
37
37
|
};
|
|
38
|
-
export type VCIgnoreReason = 'image' | 'ssr-hydration' | 'editor-lazy-node-view' | 'not-visible' | '';
|
|
38
|
+
export type VCIgnoreReason = 'image' | 'ssr-hydration' | 'editor-lazy-node-view' | 'not-visible' | 'editor-container-mutation' | '';
|
|
39
39
|
export type ComponentsLogEntry = {
|
|
40
40
|
targetName: string;
|
|
41
41
|
__debug__element: WeakRef<Element> | null;
|