@atlaskit/react-ufo 4.2.4 → 4.2.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 +16 -0
- package/dist/cjs/create-payload/common/utils/index.js +4 -4
- package/dist/cjs/ignore-holds/index.js +1 -2
- package/dist/cjs/interaction-metrics-init/index.js +7 -9
- package/dist/cjs/resource-timing/main.js +1 -1
- package/dist/cjs/segment/segment.js +2 -3
- package/dist/cjs/vc/no-op-vc-observer.js +5 -5
- package/dist/cjs/vc/vc-observer-new/index.js +5 -6
- package/dist/cjs/vc/vc-observer-new/metric-calculator/percentile-calc/canvas-heatmap/canvas-pixel.js +1 -1
- package/dist/cjs/vc/vc-observer-new/viewport-observer/utils/check-within-component.js +1 -0
- package/dist/es2019/create-payload/common/utils/index.js +4 -4
- package/dist/es2019/ignore-holds/index.js +1 -2
- package/dist/es2019/interaction-metrics-init/index.js +7 -9
- package/dist/es2019/resource-timing/main.js +1 -1
- package/dist/es2019/segment/segment.js +2 -3
- package/dist/es2019/vc/no-op-vc-observer.js +5 -5
- package/dist/es2019/vc/vc-observer-new/index.js +1 -3
- package/dist/es2019/vc/vc-observer-new/metric-calculator/percentile-calc/canvas-heatmap/canvas-pixel.js +1 -1
- package/dist/es2019/vc/vc-observer-new/viewport-observer/utils/check-within-component.js +1 -0
- package/dist/esm/create-payload/common/utils/index.js +4 -4
- package/dist/esm/ignore-holds/index.js +1 -2
- package/dist/esm/interaction-metrics-init/index.js +7 -9
- package/dist/esm/resource-timing/main.js +1 -1
- package/dist/esm/segment/segment.js +2 -3
- package/dist/esm/vc/no-op-vc-observer.js +5 -5
- package/dist/esm/vc/vc-observer-new/index.js +5 -6
- package/dist/esm/vc/vc-observer-new/metric-calculator/percentile-calc/canvas-heatmap/canvas-pixel.js +1 -1
- package/dist/esm/vc/vc-observer-new/viewport-observer/utils/check-within-component.js +1 -0
- package/dist/types/ignore-holds/index.d.ts +1 -1
- package/dist/types/vc/no-op-vc-observer.d.ts +5 -5
- package/dist/types/vc/vc-observer-new/index.d.ts +1 -3
- package/dist/types/vc/vc-observer-new/metric-calculator/percentile-calc/canvas-heatmap/canvas-pixel.d.ts +1 -1
- package/dist/types/vc/vc-observer-new/viewport-observer/utils/check-within-component.d.ts +1 -1
- package/dist/types-ts4.5/ignore-holds/index.d.ts +1 -1
- package/dist/types-ts4.5/vc/no-op-vc-observer.d.ts +5 -5
- package/dist/types-ts4.5/vc/vc-observer-new/index.d.ts +1 -3
- package/dist/types-ts4.5/vc/vc-observer-new/metric-calculator/percentile-calc/canvas-heatmap/canvas-pixel.d.ts +1 -1
- package/dist/types-ts4.5/vc/vc-observer-new/viewport-observer/utils/check-within-component.d.ts +1 -1
- package/package.json +1 -7
- package/dist/cjs/vc/vc-observer-new/metric-calculator/percentile-calc/canvas-heatmap/test-with-debug-info.js +0 -108
- package/dist/es2019/vc/vc-observer-new/metric-calculator/percentile-calc/canvas-heatmap/test-with-debug-info.js +0 -75
- package/dist/esm/vc/vc-observer-new/metric-calculator/percentile-calc/canvas-heatmap/test-with-debug-info.js +0 -106
- package/dist/types/vc/vc-observer-new/metric-calculator/percentile-calc/canvas-heatmap/test-with-debug-info.d.ts +0 -1
- package/dist/types-ts4.5/vc/vc-observer-new/metric-calculator/percentile-calc/canvas-heatmap/test-with-debug-info.d.ts +0 -1
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,21 @@
|
|
|
1
1
|
# @atlaskit/ufo-interaction-ignore
|
|
2
2
|
|
|
3
|
+
## 4.2.6
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- [#201076](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/201076)
|
|
8
|
+
[`eda3ae04eeeb4`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/eda3ae04eeeb4) -
|
|
9
|
+
FG clean up React UFO
|
|
10
|
+
|
|
11
|
+
## 4.2.5
|
|
12
|
+
|
|
13
|
+
### Patch Changes
|
|
14
|
+
|
|
15
|
+
- [#200712](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/200712)
|
|
16
|
+
[`018d190fdbed5`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/018d190fdbed5) -
|
|
17
|
+
FG clean up React UFO
|
|
18
|
+
|
|
3
19
|
## 4.2.4
|
|
4
20
|
|
|
5
21
|
### Patch Changes
|
|
@@ -67,7 +67,7 @@ function buildSegmentTree(labelStacks) {
|
|
|
67
67
|
if (!currentNode.c[key]) {
|
|
68
68
|
currentNode.c[key] = _objectSpread({
|
|
69
69
|
n: name
|
|
70
|
-
}, type
|
|
70
|
+
}, type ? {
|
|
71
71
|
t: type
|
|
72
72
|
} : {});
|
|
73
73
|
}
|
|
@@ -93,7 +93,7 @@ function buildSegmentTree(labelStacks) {
|
|
|
93
93
|
if (!currentNode.c[key]) {
|
|
94
94
|
currentNode.c[key] = _objectSpread({
|
|
95
95
|
n: name
|
|
96
|
-
}, type
|
|
96
|
+
}, type ? {
|
|
97
97
|
t: type
|
|
98
98
|
} : {});
|
|
99
99
|
}
|
|
@@ -135,7 +135,7 @@ function optimizeLabelStack(labelStack, reactUFOVersion) {
|
|
|
135
135
|
n: ls.name
|
|
136
136
|
}, ls.segmentId ? {
|
|
137
137
|
s: ls.segmentId
|
|
138
|
-
} : {}), ls.type
|
|
138
|
+
} : {}), ls.type ? {
|
|
139
139
|
t: ls.type
|
|
140
140
|
} : {});
|
|
141
141
|
});
|
|
@@ -169,7 +169,7 @@ function getOldSegmentsLabelStack(segments, interactionType) {
|
|
|
169
169
|
n: ls.name
|
|
170
170
|
}, ls.segmentId ? {
|
|
171
171
|
s: ls.segmentId
|
|
172
|
-
} : {}), ls.type
|
|
172
|
+
} : {}), ls.type ? {
|
|
173
173
|
t: ls.type
|
|
174
174
|
} : {}));
|
|
175
175
|
}
|
|
@@ -34,8 +34,7 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
|
|
|
34
34
|
function UFOIgnoreHolds(_ref) {
|
|
35
35
|
var children = _ref.children,
|
|
36
36
|
_ref$ignore = _ref.ignore,
|
|
37
|
-
ignore = _ref$ignore === void 0 ? true : _ref$ignore
|
|
38
|
-
reason = _ref.reason;
|
|
37
|
+
ignore = _ref$ignore === void 0 ? true : _ref$ignore;
|
|
39
38
|
var parentContext = (0, _react.useContext)(_interactionContext.default);
|
|
40
39
|
var ignoredInteractionContext = (0, _react.useMemo)(function () {
|
|
41
40
|
if (!parentContext) {
|
|
@@ -107,15 +107,13 @@ function init(analyticsWebClientAsync, config) {
|
|
|
107
107
|
(0, _hiddenTiming.setupHiddenTimingCapture)();
|
|
108
108
|
(0, _additionalPayload.startLighthouseObserver)();
|
|
109
109
|
initialized = true;
|
|
110
|
-
if (
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
});
|
|
118
|
-
}
|
|
110
|
+
if (typeof PerformanceObserver !== 'undefined') {
|
|
111
|
+
var observer = (0, _interactionsPerformanceObserver.getPerformanceObserver)();
|
|
112
|
+
observer.observe({
|
|
113
|
+
type: 'event',
|
|
114
|
+
buffered: true,
|
|
115
|
+
durationThreshold: 16
|
|
116
|
+
});
|
|
119
117
|
}
|
|
120
118
|
Promise.all([analyticsWebClientAsync, Promise.resolve().then(function () {
|
|
121
119
|
return _interopRequireWildcard(require( /* webpackChunkName: "create-payloads" */'../create-payload'));
|
|
@@ -60,7 +60,7 @@ function getReportedInitiatorTypes(xhrEnabled) {
|
|
|
60
60
|
}
|
|
61
61
|
return ufoConfig.allowedResources;
|
|
62
62
|
}
|
|
63
|
-
function evaluateAccessToResourceTimings(
|
|
63
|
+
function evaluateAccessToResourceTimings(_, entry) {
|
|
64
64
|
return !(entry.responseStart === 0 && entry.startTime > entry.responseStart);
|
|
65
65
|
}
|
|
66
66
|
|
|
@@ -11,7 +11,6 @@ var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers
|
|
|
11
11
|
var _react = _interopRequireWildcard(require("react"));
|
|
12
12
|
var _scheduler = require("scheduler");
|
|
13
13
|
var _uuid = require("uuid");
|
|
14
|
-
var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
|
|
15
14
|
var _coinflip = _interopRequireDefault(require("../coinflip"));
|
|
16
15
|
var _config = require("../config");
|
|
17
16
|
var _experienceTraceIdContext = require("../experience-trace-id-context");
|
|
@@ -67,13 +66,13 @@ function UFOSegment(_ref) {
|
|
|
67
66
|
return parentContext !== null && parentContext !== void 0 && parentContext.labelStack ? [].concat((0, _toConsumableArray2.default)(parentContext.labelStack), [_objectSpread({
|
|
68
67
|
name: segmentName,
|
|
69
68
|
segmentId: segmentId
|
|
70
|
-
}, type !== 'first-party'
|
|
69
|
+
}, type !== 'first-party' ? {
|
|
71
70
|
type: type
|
|
72
71
|
} : {}) // Only pass non-default types (not 'first-party') in payload to reduce size
|
|
73
72
|
]) : [_objectSpread({
|
|
74
73
|
name: segmentName,
|
|
75
74
|
segmentId: segmentId
|
|
76
|
-
}, type !== 'first-party'
|
|
75
|
+
}, type !== 'first-party' ? {
|
|
77
76
|
type: type
|
|
78
77
|
} : {})];
|
|
79
78
|
}, [parentContext, segmentName, segmentId, type]);
|
|
@@ -15,7 +15,7 @@ var VCObserverNOOP = exports.VCObserverNOOP = /*#__PURE__*/function () {
|
|
|
15
15
|
}
|
|
16
16
|
return (0, _createClass2.default)(VCObserverNOOP, [{
|
|
17
17
|
key: "start",
|
|
18
|
-
value: function start(
|
|
18
|
+
value: function start(_) {}
|
|
19
19
|
}, {
|
|
20
20
|
key: "stop",
|
|
21
21
|
value: function stop() {}
|
|
@@ -26,19 +26,19 @@ var VCObserverNOOP = exports.VCObserverNOOP = /*#__PURE__*/function () {
|
|
|
26
26
|
}
|
|
27
27
|
}, {
|
|
28
28
|
key: "getVCResult",
|
|
29
|
-
value: function getVCResult(
|
|
29
|
+
value: function getVCResult(_) {
|
|
30
30
|
return Promise.resolve({
|
|
31
31
|
'ufo:vc:noop': true
|
|
32
32
|
});
|
|
33
33
|
}
|
|
34
34
|
}, {
|
|
35
35
|
key: "setSSRElement",
|
|
36
|
-
value: function setSSRElement(
|
|
36
|
+
value: function setSSRElement(_) {}
|
|
37
37
|
}, {
|
|
38
38
|
key: "setReactRootRenderStart",
|
|
39
|
-
value: function setReactRootRenderStart(
|
|
39
|
+
value: function setReactRootRenderStart(_) {}
|
|
40
40
|
}, {
|
|
41
41
|
key: "setReactRootRenderStop",
|
|
42
|
-
value: function setReactRootRenderStop(
|
|
42
|
+
value: function setReactRootRenderStop(_) {}
|
|
43
43
|
}]);
|
|
44
44
|
}();
|
|
@@ -113,12 +113,11 @@ var VCObserverNew = exports.default = /*#__PURE__*/function () {
|
|
|
113
113
|
}
|
|
114
114
|
return (0, _createClass2.default)(VCObserverNew, [{
|
|
115
115
|
key: "start",
|
|
116
|
-
value: function start(
|
|
116
|
+
value: function start(_) {
|
|
117
117
|
var _this$viewportObserve,
|
|
118
118
|
_window,
|
|
119
119
|
_this2 = this,
|
|
120
120
|
_this$windowEventObse;
|
|
121
|
-
var startTime = _ref2.startTime;
|
|
122
121
|
// Reset SSR state on start (matches old VCObserver behavior)
|
|
123
122
|
this.ssr = {
|
|
124
123
|
state: SSRState.normal,
|
|
@@ -132,10 +131,10 @@ var VCObserverNew = exports.default = /*#__PURE__*/function () {
|
|
|
132
131
|
var abortListeners = window.__SSR_ABORT_LISTENERS__;
|
|
133
132
|
var aborts = abortListeners.aborts;
|
|
134
133
|
if (aborts && (0, _typeof2.default)(aborts) === 'object') {
|
|
135
|
-
Object.entries(aborts).forEach(function (
|
|
136
|
-
var
|
|
137
|
-
key =
|
|
138
|
-
time =
|
|
134
|
+
Object.entries(aborts).forEach(function (_ref2) {
|
|
135
|
+
var _ref3 = (0, _slicedToArray2.default)(_ref2, 2),
|
|
136
|
+
key = _ref3[0],
|
|
137
|
+
time = _ref3[1];
|
|
139
138
|
if (typeof time === 'number') {
|
|
140
139
|
_this2.entriesTimeline.push({
|
|
141
140
|
time: time,
|
package/dist/cjs/vc/vc-observer-new/metric-calculator/percentile-calc/canvas-heatmap/canvas-pixel.js
CHANGED
|
@@ -244,7 +244,7 @@ function calculateDrawnPixelsRaw(_x, _x2, _x3) {
|
|
|
244
244
|
return _calculateDrawnPixelsRaw.apply(this, arguments);
|
|
245
245
|
}
|
|
246
246
|
function _calculateDrawnPixelsRaw() {
|
|
247
|
-
_calculateDrawnPixelsRaw = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee2(imageData,
|
|
247
|
+
_calculateDrawnPixelsRaw = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee2(imageData, _, arraySize) {
|
|
248
248
|
var data, arr, i, color, colorIndex;
|
|
249
249
|
return _regenerator.default.wrap(function _callee2$(_context2) {
|
|
250
250
|
while (1) switch (_context2.prev = _context2.next) {
|
|
@@ -40,7 +40,7 @@ export function buildSegmentTree(labelStacks) {
|
|
|
40
40
|
if (!currentNode.c[key]) {
|
|
41
41
|
currentNode.c[key] = {
|
|
42
42
|
n: name,
|
|
43
|
-
...(type
|
|
43
|
+
...(type ? {
|
|
44
44
|
t: type
|
|
45
45
|
} : {})
|
|
46
46
|
};
|
|
@@ -62,7 +62,7 @@ export function buildSegmentTree(labelStacks) {
|
|
|
62
62
|
if (!currentNode.c[key]) {
|
|
63
63
|
currentNode.c[key] = {
|
|
64
64
|
n: name,
|
|
65
|
-
...(type
|
|
65
|
+
...(type ? {
|
|
66
66
|
t: type
|
|
67
67
|
} : {})
|
|
68
68
|
};
|
|
@@ -103,7 +103,7 @@ export function optimizeLabelStack(labelStack, reactUFOVersion) {
|
|
|
103
103
|
...(ls.segmentId ? {
|
|
104
104
|
s: ls.segmentId
|
|
105
105
|
} : {}),
|
|
106
|
-
...(ls.type
|
|
106
|
+
...(ls.type ? {
|
|
107
107
|
t: ls.type
|
|
108
108
|
} : {})
|
|
109
109
|
}));
|
|
@@ -135,7 +135,7 @@ export function getOldSegmentsLabelStack(segments, interactionType) {
|
|
|
135
135
|
...(ls.segmentId ? {
|
|
136
136
|
s: ls.segmentId
|
|
137
137
|
} : {}),
|
|
138
|
-
...(ls.type
|
|
138
|
+
...(ls.type ? {
|
|
139
139
|
t: ls.type
|
|
140
140
|
} : {})
|
|
141
141
|
});
|
|
@@ -21,8 +21,7 @@ import InteractionContext from '@atlaskit/interaction-context';
|
|
|
21
21
|
*/
|
|
22
22
|
export default function UFOIgnoreHolds({
|
|
23
23
|
children,
|
|
24
|
-
ignore = true
|
|
25
|
-
reason
|
|
24
|
+
ignore = true
|
|
26
25
|
}) {
|
|
27
26
|
const parentContext = useContext(InteractionContext);
|
|
28
27
|
const ignoredInteractionContext = useMemo(() => {
|
|
@@ -97,15 +97,13 @@ export function init(analyticsWebClientAsync, config) {
|
|
|
97
97
|
setupHiddenTimingCapture();
|
|
98
98
|
startLighthouseObserver();
|
|
99
99
|
initialized = true;
|
|
100
|
-
if (
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
});
|
|
108
|
-
}
|
|
100
|
+
if (typeof PerformanceObserver !== 'undefined') {
|
|
101
|
+
const observer = getPerformanceObserver();
|
|
102
|
+
observer.observe({
|
|
103
|
+
type: 'event',
|
|
104
|
+
buffered: true,
|
|
105
|
+
durationThreshold: 16
|
|
106
|
+
});
|
|
109
107
|
}
|
|
110
108
|
Promise.all([analyticsWebClientAsync, import( /* webpackChunkName: "create-payloads" */'../create-payload'), import( /* webpackChunkName: "create-post-interaction-log-payload" */'../create-post-interaction-log-payload')]).then(([awc, payloadPackage, createPostInteractionLogPayloadPackage]) => {
|
|
111
109
|
if (awc.getAnalyticsWebClientPromise) {
|
|
@@ -50,7 +50,7 @@ function getReportedInitiatorTypes(xhrEnabled) {
|
|
|
50
50
|
}
|
|
51
51
|
return ufoConfig.allowedResources;
|
|
52
52
|
}
|
|
53
|
-
function evaluateAccessToResourceTimings(
|
|
53
|
+
function evaluateAccessToResourceTimings(_, entry) {
|
|
54
54
|
return !(entry.responseStart === 0 && entry.startTime > entry.responseStart);
|
|
55
55
|
}
|
|
56
56
|
|
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
import React, { lazy, Profiler, Suspense, useCallback, useContext, useEffect, useMemo, useRef } from 'react';
|
|
2
2
|
import { unstable_NormalPriority as NormalPriority, unstable_scheduleCallback as scheduleCallback } from 'scheduler';
|
|
3
3
|
import { v4 as createUUID } from 'uuid';
|
|
4
|
-
import { fg } from '@atlaskit/platform-feature-flags';
|
|
5
4
|
import coinflip from '../coinflip';
|
|
6
5
|
import { getConfig, getInteractionRate } from '../config';
|
|
7
6
|
import { getActiveTrace, setInteractionActiveTrace } from '../experience-trace-id-context';
|
|
@@ -46,14 +45,14 @@ export default function UFOSegment({
|
|
|
46
45
|
const labelStack = useMemo(() => parentContext !== null && parentContext !== void 0 && parentContext.labelStack ? [...parentContext.labelStack, {
|
|
47
46
|
name: segmentName,
|
|
48
47
|
segmentId,
|
|
49
|
-
...(type !== 'first-party'
|
|
48
|
+
...(type !== 'first-party' ? {
|
|
50
49
|
type
|
|
51
50
|
} : {})
|
|
52
51
|
} // Only pass non-default types (not 'first-party') in payload to reduce size
|
|
53
52
|
] : [{
|
|
54
53
|
name: segmentName,
|
|
55
54
|
segmentId,
|
|
56
|
-
...(type !== 'first-party'
|
|
55
|
+
...(type !== 'first-party' ? {
|
|
57
56
|
type
|
|
58
57
|
} : {})
|
|
59
58
|
}], [parentContext, segmentName, segmentId, type]);
|
|
@@ -1,17 +1,17 @@
|
|
|
1
1
|
// This class should be used on scenarios where VC can not be calculate
|
|
2
2
|
// such as: SSR environment and legacy browsers
|
|
3
3
|
export class VCObserverNOOP {
|
|
4
|
-
start(
|
|
4
|
+
start(_) {}
|
|
5
5
|
stop() {}
|
|
6
6
|
getVCRawData() {
|
|
7
7
|
return null;
|
|
8
8
|
}
|
|
9
|
-
getVCResult(
|
|
9
|
+
getVCResult(_) {
|
|
10
10
|
return Promise.resolve({
|
|
11
11
|
'ufo:vc:noop': true
|
|
12
12
|
});
|
|
13
13
|
}
|
|
14
|
-
setSSRElement(
|
|
15
|
-
setReactRootRenderStart(
|
|
16
|
-
setReactRootRenderStop(
|
|
14
|
+
setSSRElement(_) {}
|
|
15
|
+
setReactRootRenderStart(_) {}
|
|
16
|
+
setReactRootRenderStop(_) {}
|
|
17
17
|
}
|
|
@@ -185,7 +185,7 @@ export function getRGBComponents(n) {
|
|
|
185
185
|
* @param arraySize - The amount of timestamps that were drawn in the viewport
|
|
186
186
|
* @returns A Map containing color to pixel count mappings.
|
|
187
187
|
*/
|
|
188
|
-
export async function calculateDrawnPixelsRaw(imageData,
|
|
188
|
+
export async function calculateDrawnPixelsRaw(imageData, _, arraySize) {
|
|
189
189
|
const data = imageData.data;
|
|
190
190
|
const arr = new Uint32Array(arraySize);
|
|
191
191
|
for (let i = 0; i < data.length; i += 4) {
|
|
@@ -17,6 +17,7 @@ function maybeCleanup(resultCache) {
|
|
|
17
17
|
export function cleanupCaches(resultCache) {
|
|
18
18
|
resultCache = new WeakMap();
|
|
19
19
|
callCount = 0;
|
|
20
|
+
return resultCache;
|
|
20
21
|
}
|
|
21
22
|
export default function checkWithinComponent(node, targetComponentName, resultCache) {
|
|
22
23
|
maybeCleanup(resultCache);
|
|
@@ -53,7 +53,7 @@ export function buildSegmentTree(labelStacks) {
|
|
|
53
53
|
if (!currentNode.c[key]) {
|
|
54
54
|
currentNode.c[key] = _objectSpread({
|
|
55
55
|
n: name
|
|
56
|
-
}, type
|
|
56
|
+
}, type ? {
|
|
57
57
|
t: type
|
|
58
58
|
} : {});
|
|
59
59
|
}
|
|
@@ -79,7 +79,7 @@ export function buildSegmentTree(labelStacks) {
|
|
|
79
79
|
if (!currentNode.c[key]) {
|
|
80
80
|
currentNode.c[key] = _objectSpread({
|
|
81
81
|
n: name
|
|
82
|
-
}, type
|
|
82
|
+
}, type ? {
|
|
83
83
|
t: type
|
|
84
84
|
} : {});
|
|
85
85
|
}
|
|
@@ -121,7 +121,7 @@ export function optimizeLabelStack(labelStack, reactUFOVersion) {
|
|
|
121
121
|
n: ls.name
|
|
122
122
|
}, ls.segmentId ? {
|
|
123
123
|
s: ls.segmentId
|
|
124
|
-
} : {}), ls.type
|
|
124
|
+
} : {}), ls.type ? {
|
|
125
125
|
t: ls.type
|
|
126
126
|
} : {});
|
|
127
127
|
});
|
|
@@ -155,7 +155,7 @@ export function getOldSegmentsLabelStack(segments, interactionType) {
|
|
|
155
155
|
n: ls.name
|
|
156
156
|
}, ls.segmentId ? {
|
|
157
157
|
s: ls.segmentId
|
|
158
|
-
} : {}), ls.type
|
|
158
|
+
} : {}), ls.type ? {
|
|
159
159
|
t: ls.type
|
|
160
160
|
} : {}));
|
|
161
161
|
}
|
|
@@ -25,8 +25,7 @@ import InteractionContext from '@atlaskit/interaction-context';
|
|
|
25
25
|
export default function UFOIgnoreHolds(_ref) {
|
|
26
26
|
var children = _ref.children,
|
|
27
27
|
_ref$ignore = _ref.ignore,
|
|
28
|
-
ignore = _ref$ignore === void 0 ? true : _ref$ignore
|
|
29
|
-
reason = _ref.reason;
|
|
28
|
+
ignore = _ref$ignore === void 0 ? true : _ref$ignore;
|
|
30
29
|
var parentContext = useContext(InteractionContext);
|
|
31
30
|
var ignoredInteractionContext = useMemo(function () {
|
|
32
31
|
if (!parentContext) {
|
|
@@ -98,15 +98,13 @@ export function init(analyticsWebClientAsync, config) {
|
|
|
98
98
|
setupHiddenTimingCapture();
|
|
99
99
|
startLighthouseObserver();
|
|
100
100
|
initialized = true;
|
|
101
|
-
if (
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
});
|
|
109
|
-
}
|
|
101
|
+
if (typeof PerformanceObserver !== 'undefined') {
|
|
102
|
+
var observer = getPerformanceObserver();
|
|
103
|
+
observer.observe({
|
|
104
|
+
type: 'event',
|
|
105
|
+
buffered: true,
|
|
106
|
+
durationThreshold: 16
|
|
107
|
+
});
|
|
110
108
|
}
|
|
111
109
|
Promise.all([analyticsWebClientAsync, import( /* webpackChunkName: "create-payloads" */'../create-payload'), import( /* webpackChunkName: "create-post-interaction-log-payload" */'../create-post-interaction-log-payload')]).then(function (_ref) {
|
|
112
110
|
var _ref2 = _slicedToArray(_ref, 3),
|
|
@@ -53,7 +53,7 @@ function getReportedInitiatorTypes(xhrEnabled) {
|
|
|
53
53
|
}
|
|
54
54
|
return ufoConfig.allowedResources;
|
|
55
55
|
}
|
|
56
|
-
function evaluateAccessToResourceTimings(
|
|
56
|
+
function evaluateAccessToResourceTimings(_, entry) {
|
|
57
57
|
return !(entry.responseStart === 0 && entry.startTime > entry.responseStart);
|
|
58
58
|
}
|
|
59
59
|
|
|
@@ -5,7 +5,6 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
|
|
|
5
5
|
import React, { lazy, Profiler, Suspense, useCallback, useContext, useEffect, useMemo, useRef } from 'react';
|
|
6
6
|
import { unstable_NormalPriority as NormalPriority, unstable_scheduleCallback as scheduleCallback } from 'scheduler';
|
|
7
7
|
import { v4 as createUUID } from 'uuid';
|
|
8
|
-
import { fg } from '@atlaskit/platform-feature-flags';
|
|
9
8
|
import coinflip from '../coinflip';
|
|
10
9
|
import { getConfig, getInteractionRate } from '../config';
|
|
11
10
|
import { getActiveTrace, setInteractionActiveTrace } from '../experience-trace-id-context';
|
|
@@ -56,13 +55,13 @@ export default function UFOSegment(_ref) {
|
|
|
56
55
|
return parentContext !== null && parentContext !== void 0 && parentContext.labelStack ? [].concat(_toConsumableArray(parentContext.labelStack), [_objectSpread({
|
|
57
56
|
name: segmentName,
|
|
58
57
|
segmentId: segmentId
|
|
59
|
-
}, type !== 'first-party'
|
|
58
|
+
}, type !== 'first-party' ? {
|
|
60
59
|
type: type
|
|
61
60
|
} : {}) // Only pass non-default types (not 'first-party') in payload to reduce size
|
|
62
61
|
]) : [_objectSpread({
|
|
63
62
|
name: segmentName,
|
|
64
63
|
segmentId: segmentId
|
|
65
|
-
}, type !== 'first-party'
|
|
64
|
+
}, type !== 'first-party' ? {
|
|
66
65
|
type: type
|
|
67
66
|
} : {})];
|
|
68
67
|
}, [parentContext, segmentName, segmentId, type]);
|
|
@@ -8,7 +8,7 @@ export var VCObserverNOOP = /*#__PURE__*/function () {
|
|
|
8
8
|
}
|
|
9
9
|
return _createClass(VCObserverNOOP, [{
|
|
10
10
|
key: "start",
|
|
11
|
-
value: function start(
|
|
11
|
+
value: function start(_) {}
|
|
12
12
|
}, {
|
|
13
13
|
key: "stop",
|
|
14
14
|
value: function stop() {}
|
|
@@ -19,19 +19,19 @@ export var VCObserverNOOP = /*#__PURE__*/function () {
|
|
|
19
19
|
}
|
|
20
20
|
}, {
|
|
21
21
|
key: "getVCResult",
|
|
22
|
-
value: function getVCResult(
|
|
22
|
+
value: function getVCResult(_) {
|
|
23
23
|
return Promise.resolve({
|
|
24
24
|
'ufo:vc:noop': true
|
|
25
25
|
});
|
|
26
26
|
}
|
|
27
27
|
}, {
|
|
28
28
|
key: "setSSRElement",
|
|
29
|
-
value: function setSSRElement(
|
|
29
|
+
value: function setSSRElement(_) {}
|
|
30
30
|
}, {
|
|
31
31
|
key: "setReactRootRenderStart",
|
|
32
|
-
value: function setReactRootRenderStart(
|
|
32
|
+
value: function setReactRootRenderStart(_) {}
|
|
33
33
|
}, {
|
|
34
34
|
key: "setReactRootRenderStop",
|
|
35
|
-
value: function setReactRootRenderStop(
|
|
35
|
+
value: function setReactRootRenderStop(_) {}
|
|
36
36
|
}]);
|
|
37
37
|
}();
|
|
@@ -106,12 +106,11 @@ var VCObserverNew = /*#__PURE__*/function () {
|
|
|
106
106
|
}
|
|
107
107
|
return _createClass(VCObserverNew, [{
|
|
108
108
|
key: "start",
|
|
109
|
-
value: function start(
|
|
109
|
+
value: function start(_) {
|
|
110
110
|
var _this$viewportObserve,
|
|
111
111
|
_window,
|
|
112
112
|
_this2 = this,
|
|
113
113
|
_this$windowEventObse;
|
|
114
|
-
var startTime = _ref2.startTime;
|
|
115
114
|
// Reset SSR state on start (matches old VCObserver behavior)
|
|
116
115
|
this.ssr = {
|
|
117
116
|
state: SSRState.normal,
|
|
@@ -125,10 +124,10 @@ var VCObserverNew = /*#__PURE__*/function () {
|
|
|
125
124
|
var abortListeners = window.__SSR_ABORT_LISTENERS__;
|
|
126
125
|
var aborts = abortListeners.aborts;
|
|
127
126
|
if (aborts && _typeof(aborts) === 'object') {
|
|
128
|
-
Object.entries(aborts).forEach(function (
|
|
129
|
-
var
|
|
130
|
-
key =
|
|
131
|
-
time =
|
|
127
|
+
Object.entries(aborts).forEach(function (_ref2) {
|
|
128
|
+
var _ref3 = _slicedToArray(_ref2, 2),
|
|
129
|
+
key = _ref3[0],
|
|
130
|
+
time = _ref3[1];
|
|
132
131
|
if (typeof time === 'number') {
|
|
133
132
|
_this2.entriesTimeline.push({
|
|
134
133
|
time: time,
|
package/dist/esm/vc/vc-observer-new/metric-calculator/percentile-calc/canvas-heatmap/canvas-pixel.js
CHANGED
|
@@ -238,7 +238,7 @@ export function calculateDrawnPixelsRaw(_x, _x2, _x3) {
|
|
|
238
238
|
return _calculateDrawnPixelsRaw.apply(this, arguments);
|
|
239
239
|
}
|
|
240
240
|
function _calculateDrawnPixelsRaw() {
|
|
241
|
-
_calculateDrawnPixelsRaw = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2(imageData,
|
|
241
|
+
_calculateDrawnPixelsRaw = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2(imageData, _, arraySize) {
|
|
242
242
|
var data, arr, i, color, colorIndex;
|
|
243
243
|
return _regeneratorRuntime.wrap(function _callee2$(_context2) {
|
|
244
244
|
while (1) switch (_context2.prev = _context2.next) {
|
|
@@ -17,6 +17,7 @@ function maybeCleanup(resultCache) {
|
|
|
17
17
|
export function cleanupCaches(resultCache) {
|
|
18
18
|
resultCache = new WeakMap();
|
|
19
19
|
callCount = 0;
|
|
20
|
+
return resultCache;
|
|
20
21
|
}
|
|
21
22
|
export default function checkWithinComponent(node, targetComponentName, resultCache) {
|
|
22
23
|
maybeCleanup(resultCache);
|
|
@@ -24,7 +24,7 @@ export type UFOIgnoreHoldsProps = {
|
|
|
24
24
|
* Has an `ignore` prop, to allow you to use it conditionally
|
|
25
25
|
* Has a `reason` prop, to specify why the hold is being ignored
|
|
26
26
|
*/
|
|
27
|
-
declare function UFOIgnoreHolds({ children, ignore
|
|
27
|
+
declare function UFOIgnoreHolds({ children, ignore }: UFOIgnoreHoldsProps): React.JSX.Element;
|
|
28
28
|
declare namespace UFOIgnoreHolds {
|
|
29
29
|
var displayName: string;
|
|
30
30
|
}
|
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
import type { VCResult } from '../common/vc/types';
|
|
2
2
|
import type { GetVCResultType, VCObserverInterface } from './types';
|
|
3
3
|
export declare class VCObserverNOOP implements VCObserverInterface {
|
|
4
|
-
start(
|
|
4
|
+
start(_: {
|
|
5
5
|
startTime: number;
|
|
6
6
|
}): void;
|
|
7
7
|
stop(): void;
|
|
8
8
|
getVCRawData(): null;
|
|
9
|
-
getVCResult(
|
|
10
|
-
setSSRElement(
|
|
11
|
-
setReactRootRenderStart(
|
|
12
|
-
setReactRootRenderStop(
|
|
9
|
+
getVCResult(_: GetVCResultType): Promise<VCResult>;
|
|
10
|
+
setSSRElement(_: HTMLElement): void;
|
|
11
|
+
setReactRootRenderStart(_: number): void;
|
|
12
|
+
setReactRootRenderStop(_: number): void;
|
|
13
13
|
}
|
|
@@ -31,9 +31,7 @@ export default class VCObserverNew {
|
|
|
31
31
|
private ssrPlaceholderHandler;
|
|
32
32
|
private ssr;
|
|
33
33
|
constructor(config: VCObserverNewConfig);
|
|
34
|
-
start(
|
|
35
|
-
startTime: DOMHighResTimeStamp;
|
|
36
|
-
}): void;
|
|
34
|
+
start(_: any): void;
|
|
37
35
|
stop(): void;
|
|
38
36
|
setReactRootElement(element: HTMLElement): void;
|
|
39
37
|
setReactRootRenderStart(startTime?: number): void;
|
|
@@ -91,5 +91,5 @@ export declare function getRGBComponents(n: number): RGBColor;
|
|
|
91
91
|
* @param arraySize - The amount of timestamps that were drawn in the viewport
|
|
92
92
|
* @returns A Map containing color to pixel count mappings.
|
|
93
93
|
*/
|
|
94
|
-
export declare function calculateDrawnPixelsRaw(imageData: ImageData,
|
|
94
|
+
export declare function calculateDrawnPixelsRaw(imageData: ImageData, _: number, arraySize: number): Promise<Uint32Array>;
|
|
95
95
|
export {};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
export declare function cleanupCaches(resultCache: WeakMap<HTMLElement, boolean>):
|
|
1
|
+
export declare function cleanupCaches(resultCache: WeakMap<HTMLElement, boolean>): WeakMap<HTMLElement, boolean>;
|
|
2
2
|
export default function checkWithinComponent(node: HTMLElement, targetComponentName: string, resultCache: WeakMap<HTMLElement, boolean>): {
|
|
3
3
|
isWithin: boolean;
|
|
4
4
|
};
|
|
@@ -24,7 +24,7 @@ export type UFOIgnoreHoldsProps = {
|
|
|
24
24
|
* Has an `ignore` prop, to allow you to use it conditionally
|
|
25
25
|
* Has a `reason` prop, to specify why the hold is being ignored
|
|
26
26
|
*/
|
|
27
|
-
declare function UFOIgnoreHolds({ children, ignore
|
|
27
|
+
declare function UFOIgnoreHolds({ children, ignore }: UFOIgnoreHoldsProps): React.JSX.Element;
|
|
28
28
|
declare namespace UFOIgnoreHolds {
|
|
29
29
|
var displayName: string;
|
|
30
30
|
}
|
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
import type { VCResult } from '../common/vc/types';
|
|
2
2
|
import type { GetVCResultType, VCObserverInterface } from './types';
|
|
3
3
|
export declare class VCObserverNOOP implements VCObserverInterface {
|
|
4
|
-
start(
|
|
4
|
+
start(_: {
|
|
5
5
|
startTime: number;
|
|
6
6
|
}): void;
|
|
7
7
|
stop(): void;
|
|
8
8
|
getVCRawData(): null;
|
|
9
|
-
getVCResult(
|
|
10
|
-
setSSRElement(
|
|
11
|
-
setReactRootRenderStart(
|
|
12
|
-
setReactRootRenderStop(
|
|
9
|
+
getVCResult(_: GetVCResultType): Promise<VCResult>;
|
|
10
|
+
setSSRElement(_: HTMLElement): void;
|
|
11
|
+
setReactRootRenderStart(_: number): void;
|
|
12
|
+
setReactRootRenderStop(_: number): void;
|
|
13
13
|
}
|
|
@@ -31,9 +31,7 @@ export default class VCObserverNew {
|
|
|
31
31
|
private ssrPlaceholderHandler;
|
|
32
32
|
private ssr;
|
|
33
33
|
constructor(config: VCObserverNewConfig);
|
|
34
|
-
start(
|
|
35
|
-
startTime: DOMHighResTimeStamp;
|
|
36
|
-
}): void;
|
|
34
|
+
start(_: any): void;
|
|
37
35
|
stop(): void;
|
|
38
36
|
setReactRootElement(element: HTMLElement): void;
|
|
39
37
|
setReactRootRenderStart(startTime?: number): void;
|
|
@@ -91,5 +91,5 @@ export declare function getRGBComponents(n: number): RGBColor;
|
|
|
91
91
|
* @param arraySize - The amount of timestamps that were drawn in the viewport
|
|
92
92
|
* @returns A Map containing color to pixel count mappings.
|
|
93
93
|
*/
|
|
94
|
-
export declare function calculateDrawnPixelsRaw(imageData: ImageData,
|
|
94
|
+
export declare function calculateDrawnPixelsRaw(imageData: ImageData, _: number, arraySize: number): Promise<Uint32Array>;
|
|
95
95
|
export {};
|
package/dist/types-ts4.5/vc/vc-observer-new/viewport-observer/utils/check-within-component.d.ts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
export declare function cleanupCaches(resultCache: WeakMap<HTMLElement, boolean>):
|
|
1
|
+
export declare function cleanupCaches(resultCache: WeakMap<HTMLElement, boolean>): WeakMap<HTMLElement, boolean>;
|
|
2
2
|
export default function checkWithinComponent(node: HTMLElement, targetComponentName: string, resultCache: WeakMap<HTMLElement, boolean>): {
|
|
3
3
|
isWithin: boolean;
|
|
4
4
|
};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/react-ufo",
|
|
3
|
-
"version": "4.2.
|
|
3
|
+
"version": "4.2.6",
|
|
4
4
|
"description": "Parts of React UFO that are publicly available",
|
|
5
5
|
"author": "Atlassian Pty Ltd",
|
|
6
6
|
"license": "Apache-2.0",
|
|
@@ -153,9 +153,6 @@
|
|
|
153
153
|
"platform_ufo_assets_check_for_nan": {
|
|
154
154
|
"type": "boolean"
|
|
155
155
|
},
|
|
156
|
-
"platform_ufo_enable_events_observer": {
|
|
157
|
-
"type": "boolean"
|
|
158
|
-
},
|
|
159
156
|
"platform_ufo_ssr_size_field": {
|
|
160
157
|
"type": "boolean"
|
|
161
158
|
},
|
|
@@ -174,9 +171,6 @@
|
|
|
174
171
|
"platform_ufo_exclude_3p_elements_from_ttvc": {
|
|
175
172
|
"type": "boolean"
|
|
176
173
|
},
|
|
177
|
-
"platform_ufo_add_type_for_3p_segments": {
|
|
178
|
-
"type": "boolean"
|
|
179
|
-
},
|
|
180
174
|
"platform_ufo_enable_vc_press_interactions": {
|
|
181
175
|
"type": "boolean"
|
|
182
176
|
},
|
|
@@ -1,108 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
-
var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
|
|
5
|
-
var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
|
|
6
|
-
var _index = require("./index");
|
|
7
|
-
// Test utilities
|
|
8
|
-
var createMockRect = function createMockRect() {
|
|
9
|
-
var x = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 0;
|
|
10
|
-
var y = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
|
|
11
|
-
var width = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 100;
|
|
12
|
-
var height = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : 100;
|
|
13
|
-
return new MockDOMRect(x, y, width, height);
|
|
14
|
-
};
|
|
15
|
-
var createViewportEntry = function createViewportEntry(elementName) {
|
|
16
|
-
var rect = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : createMockRect();
|
|
17
|
-
var visible = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : true;
|
|
18
|
-
var type = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : 'mutation:element';
|
|
19
|
-
return {
|
|
20
|
-
elementName: elementName,
|
|
21
|
-
rect: rect,
|
|
22
|
-
visible: visible,
|
|
23
|
-
type: type
|
|
24
|
-
};
|
|
25
|
-
};
|
|
26
|
-
var createTimePixelCounts = function createTimePixelCounts(counts) {
|
|
27
|
-
return new Map(counts);
|
|
28
|
-
};
|
|
29
|
-
var createElementMap = function createElementMap(entries) {
|
|
30
|
-
return new Map(entries);
|
|
31
|
-
};
|
|
32
|
-
var createExpectedResult = function createExpectedResult(time, viewportPercentage, entries) {
|
|
33
|
-
return {
|
|
34
|
-
time: time,
|
|
35
|
-
viewportPercentage: viewportPercentage,
|
|
36
|
-
entries: entries
|
|
37
|
-
};
|
|
38
|
-
};
|
|
39
|
-
var MockDOMRect = /*#__PURE__*/function () {
|
|
40
|
-
function MockDOMRect(x, y, width, height) {
|
|
41
|
-
(0, _classCallCheck2.default)(this, MockDOMRect);
|
|
42
|
-
this.x = x;
|
|
43
|
-
this.y = y;
|
|
44
|
-
this.width = width;
|
|
45
|
-
this.height = height;
|
|
46
|
-
}
|
|
47
|
-
return (0, _createClass2.default)(MockDOMRect, [{
|
|
48
|
-
key: "bottom",
|
|
49
|
-
get: function get() {
|
|
50
|
-
return this.y + this.height;
|
|
51
|
-
}
|
|
52
|
-
}, {
|
|
53
|
-
key: "left",
|
|
54
|
-
get: function get() {
|
|
55
|
-
return this.x;
|
|
56
|
-
}
|
|
57
|
-
}, {
|
|
58
|
-
key: "right",
|
|
59
|
-
get: function get() {
|
|
60
|
-
return this.x + this.width;
|
|
61
|
-
}
|
|
62
|
-
}, {
|
|
63
|
-
key: "top",
|
|
64
|
-
get: function get() {
|
|
65
|
-
return this.y;
|
|
66
|
-
}
|
|
67
|
-
}, {
|
|
68
|
-
key: "toJSON",
|
|
69
|
-
value: function toJSON() {
|
|
70
|
-
return {
|
|
71
|
-
x: this.x,
|
|
72
|
-
y: this.y,
|
|
73
|
-
width: this.width,
|
|
74
|
-
height: this.height
|
|
75
|
-
};
|
|
76
|
-
}
|
|
77
|
-
}]);
|
|
78
|
-
}();
|
|
79
|
-
describe('calculatePercentilesWithDebugInfo', function () {
|
|
80
|
-
it('should correctly calculate percentiles with accumulated elements from timestamps', function () {
|
|
81
|
-
var timePixelCounts = createTimePixelCounts([[100, 10], [200, 20], [300, 10], [400, 10]]);
|
|
82
|
-
var elementMap = createElementMap([[100, [createViewportEntry('div'), createViewportEntry('span')]], [200, [createViewportEntry('img')]], [300, [createViewportEntry('p'), createViewportEntry('a')]], [400, [createViewportEntry('img')]]]);
|
|
83
|
-
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')])];
|
|
84
|
-
var result = (0, _index.calculatePercentilesWithDebugInfo)(timePixelCounts, elementMap, 50, 0);
|
|
85
|
-
expect(result).toEqual(expected);
|
|
86
|
-
});
|
|
87
|
-
it('should handle empty entries gracefully', function () {
|
|
88
|
-
var timePixelCounts = new Map();
|
|
89
|
-
var elementMap = new Map();
|
|
90
|
-
var expected = [];
|
|
91
|
-
var result = (0, _index.calculatePercentilesWithDebugInfo)(timePixelCounts, elementMap, 100, 0);
|
|
92
|
-
expect(result).toEqual(expected);
|
|
93
|
-
});
|
|
94
|
-
it('should handle non-sequential timestamps', function () {
|
|
95
|
-
var timePixelCounts = createTimePixelCounts([[300, 70], [100, 30]]);
|
|
96
|
-
var elementMap = createElementMap([[300, [createViewportEntry('p'), createViewportEntry('a')]], [100, [createViewportEntry('div')]]]);
|
|
97
|
-
var expected = [createExpectedResult(100, 30, [createViewportEntry('div')]), createExpectedResult(300, 100, [createViewportEntry('p'), createViewportEntry('a')])];
|
|
98
|
-
var result = (0, _index.calculatePercentilesWithDebugInfo)(timePixelCounts, elementMap, 100, 0);
|
|
99
|
-
expect(result).toEqual(expected);
|
|
100
|
-
});
|
|
101
|
-
it('should correctly calculate percentiles with startTime offset', function () {
|
|
102
|
-
var timePixelCounts = createTimePixelCounts([[100, 10], [200, 20], [300, 10], [400, 10]]);
|
|
103
|
-
var elementMap = createElementMap([[100, [createViewportEntry('div'), createViewportEntry('span')]], [200, [createViewportEntry('img')]], [300, [createViewportEntry('p'), createViewportEntry('a')]], [400, [createViewportEntry('img')]]]);
|
|
104
|
-
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')])];
|
|
105
|
-
var result = (0, _index.calculatePercentilesWithDebugInfo)(timePixelCounts, elementMap, 50, 50);
|
|
106
|
-
expect(result).toEqual(expected);
|
|
107
|
-
});
|
|
108
|
-
});
|
|
@@ -1,75 +0,0 @@
|
|
|
1
|
-
import { calculatePercentilesWithDebugInfo } from './index';
|
|
2
|
-
|
|
3
|
-
// Test utilities
|
|
4
|
-
const createMockRect = (x = 0, y = 0, width = 100, height = 100) => new MockDOMRect(x, y, width, height);
|
|
5
|
-
const createViewportEntry = (elementName, rect = createMockRect(), visible = true, type = 'mutation:element') => ({
|
|
6
|
-
elementName,
|
|
7
|
-
rect,
|
|
8
|
-
visible,
|
|
9
|
-
type
|
|
10
|
-
});
|
|
11
|
-
const createTimePixelCounts = counts => new Map(counts);
|
|
12
|
-
const createElementMap = entries => new Map(entries);
|
|
13
|
-
const createExpectedResult = (time, viewportPercentage, entries) => ({
|
|
14
|
-
time,
|
|
15
|
-
viewportPercentage,
|
|
16
|
-
entries
|
|
17
|
-
});
|
|
18
|
-
class MockDOMRect {
|
|
19
|
-
constructor(x, y, width, height) {
|
|
20
|
-
this.x = x;
|
|
21
|
-
this.y = y;
|
|
22
|
-
this.width = width;
|
|
23
|
-
this.height = height;
|
|
24
|
-
}
|
|
25
|
-
get bottom() {
|
|
26
|
-
return this.y + this.height;
|
|
27
|
-
}
|
|
28
|
-
get left() {
|
|
29
|
-
return this.x;
|
|
30
|
-
}
|
|
31
|
-
get right() {
|
|
32
|
-
return this.x + this.width;
|
|
33
|
-
}
|
|
34
|
-
get top() {
|
|
35
|
-
return this.y;
|
|
36
|
-
}
|
|
37
|
-
toJSON() {
|
|
38
|
-
return {
|
|
39
|
-
x: this.x,
|
|
40
|
-
y: this.y,
|
|
41
|
-
width: this.width,
|
|
42
|
-
height: this.height
|
|
43
|
-
};
|
|
44
|
-
}
|
|
45
|
-
}
|
|
46
|
-
describe('calculatePercentilesWithDebugInfo', () => {
|
|
47
|
-
it('should correctly calculate percentiles with accumulated elements from timestamps', () => {
|
|
48
|
-
const timePixelCounts = createTimePixelCounts([[100, 10], [200, 20], [300, 10], [400, 10]]);
|
|
49
|
-
const elementMap = createElementMap([[100, [createViewportEntry('div'), createViewportEntry('span')]], [200, [createViewportEntry('img')]], [300, [createViewportEntry('p'), createViewportEntry('a')]], [400, [createViewportEntry('img')]]]);
|
|
50
|
-
const 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')])];
|
|
51
|
-
const result = calculatePercentilesWithDebugInfo(timePixelCounts, elementMap, 50, 0);
|
|
52
|
-
expect(result).toEqual(expected);
|
|
53
|
-
});
|
|
54
|
-
it('should handle empty entries gracefully', () => {
|
|
55
|
-
const timePixelCounts = new Map();
|
|
56
|
-
const elementMap = new Map();
|
|
57
|
-
const expected = [];
|
|
58
|
-
const result = calculatePercentilesWithDebugInfo(timePixelCounts, elementMap, 100, 0);
|
|
59
|
-
expect(result).toEqual(expected);
|
|
60
|
-
});
|
|
61
|
-
it('should handle non-sequential timestamps', () => {
|
|
62
|
-
const timePixelCounts = createTimePixelCounts([[300, 70], [100, 30]]);
|
|
63
|
-
const elementMap = createElementMap([[300, [createViewportEntry('p'), createViewportEntry('a')]], [100, [createViewportEntry('div')]]]);
|
|
64
|
-
const expected = [createExpectedResult(100, 30, [createViewportEntry('div')]), createExpectedResult(300, 100, [createViewportEntry('p'), createViewportEntry('a')])];
|
|
65
|
-
const result = calculatePercentilesWithDebugInfo(timePixelCounts, elementMap, 100, 0);
|
|
66
|
-
expect(result).toEqual(expected);
|
|
67
|
-
});
|
|
68
|
-
it('should correctly calculate percentiles with startTime offset', () => {
|
|
69
|
-
const timePixelCounts = createTimePixelCounts([[100, 10], [200, 20], [300, 10], [400, 10]]);
|
|
70
|
-
const elementMap = createElementMap([[100, [createViewportEntry('div'), createViewportEntry('span')]], [200, [createViewportEntry('img')]], [300, [createViewportEntry('p'), createViewportEntry('a')]], [400, [createViewportEntry('img')]]]);
|
|
71
|
-
const 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')])];
|
|
72
|
-
const result = calculatePercentilesWithDebugInfo(timePixelCounts, elementMap, 50, 50);
|
|
73
|
-
expect(result).toEqual(expected);
|
|
74
|
-
});
|
|
75
|
-
});
|
|
@@ -1,106 +0,0 @@
|
|
|
1
|
-
import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
|
|
2
|
-
import _createClass from "@babel/runtime/helpers/createClass";
|
|
3
|
-
import { calculatePercentilesWithDebugInfo } from './index';
|
|
4
|
-
|
|
5
|
-
// Test utilities
|
|
6
|
-
var createMockRect = function createMockRect() {
|
|
7
|
-
var x = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 0;
|
|
8
|
-
var y = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
|
|
9
|
-
var width = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 100;
|
|
10
|
-
var height = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : 100;
|
|
11
|
-
return new MockDOMRect(x, y, width, height);
|
|
12
|
-
};
|
|
13
|
-
var createViewportEntry = function createViewportEntry(elementName) {
|
|
14
|
-
var rect = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : createMockRect();
|
|
15
|
-
var visible = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : true;
|
|
16
|
-
var type = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : 'mutation:element';
|
|
17
|
-
return {
|
|
18
|
-
elementName: elementName,
|
|
19
|
-
rect: rect,
|
|
20
|
-
visible: visible,
|
|
21
|
-
type: type
|
|
22
|
-
};
|
|
23
|
-
};
|
|
24
|
-
var createTimePixelCounts = function createTimePixelCounts(counts) {
|
|
25
|
-
return new Map(counts);
|
|
26
|
-
};
|
|
27
|
-
var createElementMap = function createElementMap(entries) {
|
|
28
|
-
return new Map(entries);
|
|
29
|
-
};
|
|
30
|
-
var createExpectedResult = function createExpectedResult(time, viewportPercentage, entries) {
|
|
31
|
-
return {
|
|
32
|
-
time: time,
|
|
33
|
-
viewportPercentage: viewportPercentage,
|
|
34
|
-
entries: entries
|
|
35
|
-
};
|
|
36
|
-
};
|
|
37
|
-
var MockDOMRect = /*#__PURE__*/function () {
|
|
38
|
-
function MockDOMRect(x, y, width, height) {
|
|
39
|
-
_classCallCheck(this, MockDOMRect);
|
|
40
|
-
this.x = x;
|
|
41
|
-
this.y = y;
|
|
42
|
-
this.width = width;
|
|
43
|
-
this.height = height;
|
|
44
|
-
}
|
|
45
|
-
return _createClass(MockDOMRect, [{
|
|
46
|
-
key: "bottom",
|
|
47
|
-
get: function get() {
|
|
48
|
-
return this.y + this.height;
|
|
49
|
-
}
|
|
50
|
-
}, {
|
|
51
|
-
key: "left",
|
|
52
|
-
get: function get() {
|
|
53
|
-
return this.x;
|
|
54
|
-
}
|
|
55
|
-
}, {
|
|
56
|
-
key: "right",
|
|
57
|
-
get: function get() {
|
|
58
|
-
return this.x + this.width;
|
|
59
|
-
}
|
|
60
|
-
}, {
|
|
61
|
-
key: "top",
|
|
62
|
-
get: function get() {
|
|
63
|
-
return this.y;
|
|
64
|
-
}
|
|
65
|
-
}, {
|
|
66
|
-
key: "toJSON",
|
|
67
|
-
value: function toJSON() {
|
|
68
|
-
return {
|
|
69
|
-
x: this.x,
|
|
70
|
-
y: this.y,
|
|
71
|
-
width: this.width,
|
|
72
|
-
height: this.height
|
|
73
|
-
};
|
|
74
|
-
}
|
|
75
|
-
}]);
|
|
76
|
-
}();
|
|
77
|
-
describe('calculatePercentilesWithDebugInfo', function () {
|
|
78
|
-
it('should correctly calculate percentiles with accumulated elements from timestamps', function () {
|
|
79
|
-
var timePixelCounts = createTimePixelCounts([[100, 10], [200, 20], [300, 10], [400, 10]]);
|
|
80
|
-
var elementMap = createElementMap([[100, [createViewportEntry('div'), createViewportEntry('span')]], [200, [createViewportEntry('img')]], [300, [createViewportEntry('p'), createViewportEntry('a')]], [400, [createViewportEntry('img')]]]);
|
|
81
|
-
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')])];
|
|
82
|
-
var result = calculatePercentilesWithDebugInfo(timePixelCounts, elementMap, 50, 0);
|
|
83
|
-
expect(result).toEqual(expected);
|
|
84
|
-
});
|
|
85
|
-
it('should handle empty entries gracefully', function () {
|
|
86
|
-
var timePixelCounts = new Map();
|
|
87
|
-
var elementMap = new Map();
|
|
88
|
-
var expected = [];
|
|
89
|
-
var result = calculatePercentilesWithDebugInfo(timePixelCounts, elementMap, 100, 0);
|
|
90
|
-
expect(result).toEqual(expected);
|
|
91
|
-
});
|
|
92
|
-
it('should handle non-sequential timestamps', function () {
|
|
93
|
-
var timePixelCounts = createTimePixelCounts([[300, 70], [100, 30]]);
|
|
94
|
-
var elementMap = createElementMap([[300, [createViewportEntry('p'), createViewportEntry('a')]], [100, [createViewportEntry('div')]]]);
|
|
95
|
-
var expected = [createExpectedResult(100, 30, [createViewportEntry('div')]), createExpectedResult(300, 100, [createViewportEntry('p'), createViewportEntry('a')])];
|
|
96
|
-
var result = calculatePercentilesWithDebugInfo(timePixelCounts, elementMap, 100, 0);
|
|
97
|
-
expect(result).toEqual(expected);
|
|
98
|
-
});
|
|
99
|
-
it('should correctly calculate percentiles with startTime offset', function () {
|
|
100
|
-
var timePixelCounts = createTimePixelCounts([[100, 10], [200, 20], [300, 10], [400, 10]]);
|
|
101
|
-
var elementMap = createElementMap([[100, [createViewportEntry('div'), createViewportEntry('span')]], [200, [createViewportEntry('img')]], [300, [createViewportEntry('p'), createViewportEntry('a')]], [400, [createViewportEntry('img')]]]);
|
|
102
|
-
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')])];
|
|
103
|
-
var result = calculatePercentilesWithDebugInfo(timePixelCounts, elementMap, 50, 50);
|
|
104
|
-
expect(result).toEqual(expected);
|
|
105
|
-
});
|
|
106
|
-
});
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export {};
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export {};
|