@atlaskit/react-ufo 3.13.0 → 3.13.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 +8 -0
- package/dist/cjs/config/index.js +15 -20
- package/dist/cjs/create-payload/utils/get-vc-metrics.js +5 -44
- package/dist/cjs/vc/index.js +49 -101
- package/dist/cjs/vc/vc-observer/getVCRevisionsData.js +13 -67
- package/dist/cjs/vc/vc-observer/index.js +27 -107
- package/dist/es2019/config/index.js +18 -23
- package/dist/es2019/create-payload/utils/get-vc-metrics.js +12 -41
- package/dist/es2019/vc/index.js +44 -88
- package/dist/es2019/vc/vc-observer/getVCRevisionsData.js +15 -71
- package/dist/es2019/vc/vc-observer/index.js +5 -87
- package/dist/esm/config/index.js +15 -20
- package/dist/esm/create-payload/utils/get-vc-metrics.js +6 -45
- package/dist/esm/vc/index.js +49 -101
- package/dist/esm/vc/vc-observer/getVCRevisionsData.js +13 -67
- package/dist/esm/vc/vc-observer/index.js +27 -107
- package/dist/types/common/vc/types.d.ts +0 -2
- package/dist/types/create-post-interaction-log-payload/index.d.ts +1 -1
- package/dist/types/vc/vc-observer/getVCRevisionsData.d.ts +2 -17
- package/dist/types/vc/vc-observer/index.d.ts +0 -4
- package/dist/types-ts4.5/common/vc/types.d.ts +0 -2
- package/dist/types-ts4.5/create-post-interaction-log-payload/index.d.ts +1 -1
- package/dist/types-ts4.5/vc/vc-observer/getVCRevisionsData.d.ts +2 -17
- package/dist/types-ts4.5/vc/vc-observer/index.d.ts +0 -4
- package/package.json +1 -4
- package/dist/cjs/vc/vc-observer/heatmap/heatmap.js +0 -281
- package/dist/cjs/vc/vc-observer/revisions/ViewportUpdateClassifier.js +0 -68
- package/dist/cjs/vc/vc-observer/revisions/fy25_01.js +0 -76
- package/dist/cjs/vc/vc-observer/revisions/fy25_02.js +0 -59
- package/dist/cjs/vc/vc-observer/revisions/revisions.js +0 -24
- package/dist/cjs/vc/vc-observer/revisions/types.js +0 -5
- package/dist/es2019/vc/vc-observer/heatmap/heatmap.js +0 -247
- package/dist/es2019/vc/vc-observer/revisions/ViewportUpdateClassifier.js +0 -48
- package/dist/es2019/vc/vc-observer/revisions/fy25_01.js +0 -55
- package/dist/es2019/vc/vc-observer/revisions/fy25_02.js +0 -35
- package/dist/es2019/vc/vc-observer/revisions/revisions.js +0 -18
- package/dist/es2019/vc/vc-observer/revisions/types.js +0 -1
- package/dist/esm/vc/vc-observer/heatmap/heatmap.js +0 -274
- package/dist/esm/vc/vc-observer/revisions/ViewportUpdateClassifier.js +0 -61
- package/dist/esm/vc/vc-observer/revisions/fy25_01.js +0 -69
- package/dist/esm/vc/vc-observer/revisions/fy25_02.js +0 -52
- package/dist/esm/vc/vc-observer/revisions/revisions.js +0 -18
- package/dist/esm/vc/vc-observer/revisions/types.js +0 -1
- package/dist/types/vc/vc-observer/heatmap/heatmap.d.ts +0 -79
- package/dist/types/vc/vc-observer/revisions/ViewportUpdateClassifier.d.ts +0 -31
- package/dist/types/vc/vc-observer/revisions/fy25_01.d.ts +0 -13
- package/dist/types/vc/vc-observer/revisions/fy25_02.d.ts +0 -16
- package/dist/types/vc/vc-observer/revisions/revisions.d.ts +0 -2
- package/dist/types/vc/vc-observer/revisions/types.d.ts +0 -28
- package/dist/types-ts4.5/vc/vc-observer/heatmap/heatmap.d.ts +0 -79
- package/dist/types-ts4.5/vc/vc-observer/revisions/ViewportUpdateClassifier.d.ts +0 -31
- package/dist/types-ts4.5/vc/vc-observer/revisions/fy25_01.d.ts +0 -13
- package/dist/types-ts4.5/vc/vc-observer/revisions/fy25_02.d.ts +0 -16
- package/dist/types-ts4.5/vc/vc-observer/revisions/revisions.d.ts +0 -2
- package/dist/types-ts4.5/vc/vc-observer/revisions/types.d.ts +0 -28
|
@@ -1,247 +0,0 @@
|
|
|
1
|
-
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
2
|
-
import { getPageVisibilityState } from '../../../hidden-timing';
|
|
3
|
-
const UNUSED_SECTOR = 0;
|
|
4
|
-
export class MultiRevisionHeatmap {
|
|
5
|
-
constructor({
|
|
6
|
-
viewport,
|
|
7
|
-
revisions,
|
|
8
|
-
arraySize,
|
|
9
|
-
devToolsEnabled
|
|
10
|
-
}) {
|
|
11
|
-
_defineProperty(this, "arraySize", {
|
|
12
|
-
w: 200,
|
|
13
|
-
h: 200
|
|
14
|
-
});
|
|
15
|
-
_defineProperty(this, "mapPixelsToHeatmap", (left, top, width, height) => {
|
|
16
|
-
const {
|
|
17
|
-
w,
|
|
18
|
-
h
|
|
19
|
-
} = this.viewport;
|
|
20
|
-
const l = Math.floor(left / w * this.arraySize.w);
|
|
21
|
-
const t = Math.floor(top / h * this.arraySize.h);
|
|
22
|
-
const r = Math.ceil((left + width) / w * this.arraySize.w);
|
|
23
|
-
const b = Math.ceil((top + height) / h * this.arraySize.h);
|
|
24
|
-
|
|
25
|
-
// correct values to min - 0, max - arraySize
|
|
26
|
-
const result = {
|
|
27
|
-
l: Math.max(0, l),
|
|
28
|
-
t: Math.max(0, t),
|
|
29
|
-
r: Math.min(this.arraySize.w, r),
|
|
30
|
-
b: Math.min(this.arraySize.h, b)
|
|
31
|
-
};
|
|
32
|
-
return result;
|
|
33
|
-
});
|
|
34
|
-
_defineProperty(this, "getElementRatio", mappedValues => {
|
|
35
|
-
const {
|
|
36
|
-
r,
|
|
37
|
-
l,
|
|
38
|
-
b,
|
|
39
|
-
t
|
|
40
|
-
} = mappedValues;
|
|
41
|
-
return (r - l) * (b - t) / (this.arraySize.w * this.arraySize.h);
|
|
42
|
-
});
|
|
43
|
-
this.viewport = viewport;
|
|
44
|
-
this.revisions = revisions;
|
|
45
|
-
if (arraySize) {
|
|
46
|
-
this.arraySize = arraySize;
|
|
47
|
-
}
|
|
48
|
-
this.heatmaps = new Array(revisions.length);
|
|
49
|
-
this.componentsLogs = new Array(revisions.length);
|
|
50
|
-
this.vcRatios = new Array(revisions.length);
|
|
51
|
-
this.devToolsEnabled = devToolsEnabled || false;
|
|
52
|
-
revisions.forEach(({}, i) => {
|
|
53
|
-
this.heatmaps[i] = this.getCleanHeatmap();
|
|
54
|
-
this.componentsLogs[i] = {};
|
|
55
|
-
this.vcRatios[i] = {};
|
|
56
|
-
});
|
|
57
|
-
}
|
|
58
|
-
handleUpdate({
|
|
59
|
-
time,
|
|
60
|
-
type,
|
|
61
|
-
classification,
|
|
62
|
-
intersectionRect,
|
|
63
|
-
element,
|
|
64
|
-
targetName,
|
|
65
|
-
ignoreReason,
|
|
66
|
-
onError,
|
|
67
|
-
attributeName,
|
|
68
|
-
oldValue,
|
|
69
|
-
newValue
|
|
70
|
-
}) {
|
|
71
|
-
const mappedValues = this.mapPixelsToHeatmap(intersectionRect.left, intersectionRect.top, intersectionRect.width, intersectionRect.height);
|
|
72
|
-
const result = this.applyChangesToHeatMap(mappedValues, time, classification);
|
|
73
|
-
if (result !== true) {
|
|
74
|
-
onError(result);
|
|
75
|
-
}
|
|
76
|
-
const componentRatio = this.getElementRatio(mappedValues);
|
|
77
|
-
this.revisions.forEach((_, i) => {
|
|
78
|
-
if (classification[i]) {
|
|
79
|
-
this.vcRatios[i][targetName] = componentRatio;
|
|
80
|
-
}
|
|
81
|
-
if (!this.componentsLogs[i][time]) {
|
|
82
|
-
this.componentsLogs[i][time] = [];
|
|
83
|
-
}
|
|
84
|
-
this.componentsLogs[i][time].push({
|
|
85
|
-
__debug__element: this.devToolsEnabled ? new WeakRef(element) : null,
|
|
86
|
-
intersectionRect,
|
|
87
|
-
targetName,
|
|
88
|
-
ignoreReason,
|
|
89
|
-
attributeName,
|
|
90
|
-
oldValue,
|
|
91
|
-
newValue
|
|
92
|
-
});
|
|
93
|
-
});
|
|
94
|
-
}
|
|
95
|
-
getData() {
|
|
96
|
-
return {
|
|
97
|
-
heatmaps: this.heatmaps
|
|
98
|
-
};
|
|
99
|
-
}
|
|
100
|
-
getPayloadShapedData(args) {
|
|
101
|
-
const pageVisibilityUpToTTAI = getPageVisibilityState(args.interactionStart, args.ttai);
|
|
102
|
-
const result = this.processData(args);
|
|
103
|
-
const payload = this.revisions.map((rev, i) => {
|
|
104
|
-
var _vcDetails$;
|
|
105
|
-
const vcDetails = {};
|
|
106
|
-
args.VCParts.forEach(VCPart => {
|
|
107
|
-
vcDetails[VCPart] = {
|
|
108
|
-
t: result[i].VC[VCPart] || 0,
|
|
109
|
-
e: Array.from(result[i].VCBox[VCPart] || [])
|
|
110
|
-
};
|
|
111
|
-
});
|
|
112
|
-
return {
|
|
113
|
-
revision: rev.name,
|
|
114
|
-
clean: args.clean,
|
|
115
|
-
'metric:vc90': args.clean && !args.isEventAborted && pageVisibilityUpToTTAI === 'visible' ? vcDetails === null || vcDetails === void 0 ? void 0 : (_vcDetails$ = vcDetails['90']) === null || _vcDetails$ === void 0 ? void 0 : _vcDetails$.t : null,
|
|
116
|
-
vcDetails
|
|
117
|
-
};
|
|
118
|
-
});
|
|
119
|
-
return payload;
|
|
120
|
-
}
|
|
121
|
-
processData({
|
|
122
|
-
VCParts,
|
|
123
|
-
VCCalculationMethods,
|
|
124
|
-
filterComponentsLog,
|
|
125
|
-
ttai,
|
|
126
|
-
ssr = UNUSED_SECTOR
|
|
127
|
-
}) {
|
|
128
|
-
return this.heatmaps.map((heatmap, i) => {
|
|
129
|
-
const lastUpdate = {};
|
|
130
|
-
let totalPainted = 0;
|
|
131
|
-
let componentsLog = this.componentsLogs[i];
|
|
132
|
-
if (ssr !== UNUSED_SECTOR) {
|
|
133
|
-
var _window$document;
|
|
134
|
-
const element = {
|
|
135
|
-
__debug__element: new WeakRef((_window$document = window.document) === null || _window$document === void 0 ? void 0 : _window$document.body),
|
|
136
|
-
intersectionRect: {
|
|
137
|
-
top: 0,
|
|
138
|
-
left: 0,
|
|
139
|
-
right: 0,
|
|
140
|
-
bottom: 0,
|
|
141
|
-
x: 0,
|
|
142
|
-
y: 0,
|
|
143
|
-
width: this.viewport.w,
|
|
144
|
-
height: this.viewport.h,
|
|
145
|
-
toJSON() {
|
|
146
|
-
return {};
|
|
147
|
-
}
|
|
148
|
-
},
|
|
149
|
-
targetName: 'SSR'
|
|
150
|
-
};
|
|
151
|
-
if (!componentsLog[ssr]) {
|
|
152
|
-
componentsLog[ssr] = [];
|
|
153
|
-
}
|
|
154
|
-
componentsLog[ssr].push(element);
|
|
155
|
-
}
|
|
156
|
-
for (let i = 0; i < heatmap.length; i++) {
|
|
157
|
-
const rounded = Math.floor(heatmap[i] === UNUSED_SECTOR && ssr !== UNUSED_SECTOR ? ssr : heatmap[i]);
|
|
158
|
-
totalPainted += rounded !== UNUSED_SECTOR ? 1 : 0;
|
|
159
|
-
if (rounded !== UNUSED_SECTOR) {
|
|
160
|
-
lastUpdate[rounded] = lastUpdate[rounded] ? lastUpdate[rounded] + 1 : 1;
|
|
161
|
-
}
|
|
162
|
-
}
|
|
163
|
-
const entries = Object.entries(lastUpdate).map(a => [parseInt(a[0], 10), a[1]]).sort((a, b) => a[0] > b[0] ? 1 : -1);
|
|
164
|
-
|
|
165
|
-
// @todo remove it once fixed as described: https://product-fabric.atlassian.net/browse/AFO-3443
|
|
166
|
-
componentsLog = filterComponentsLog[i]({
|
|
167
|
-
componentsLog,
|
|
168
|
-
ttai
|
|
169
|
-
});
|
|
170
|
-
const {
|
|
171
|
-
VC,
|
|
172
|
-
VCBox
|
|
173
|
-
} = VCCalculationMethods[i]({
|
|
174
|
-
VCParts,
|
|
175
|
-
componentsLog,
|
|
176
|
-
entries,
|
|
177
|
-
totalPainted
|
|
178
|
-
});
|
|
179
|
-
const VCEntries = entries.reduce((acc, [timestamp, entryPainted], i) => {
|
|
180
|
-
var _acc$abs, _componentsLog$timest;
|
|
181
|
-
const currentlyPainted = entryPainted + (((_acc$abs = acc.abs[i - 1]) === null || _acc$abs === void 0 ? void 0 : _acc$abs[1]) || 0);
|
|
182
|
-
const currentlyPaintedRatio = Math.round(currentlyPainted / totalPainted * 1000) / 10;
|
|
183
|
-
const logEntry = (_componentsLog$timest = componentsLog[timestamp]) === null || _componentsLog$timest === void 0 ? void 0 : _componentsLog$timest.map(v => v.targetName);
|
|
184
|
-
acc.abs.push([timestamp, currentlyPainted]);
|
|
185
|
-
acc.rel.push({
|
|
186
|
-
time: timestamp,
|
|
187
|
-
vc: currentlyPaintedRatio,
|
|
188
|
-
elements: logEntry
|
|
189
|
-
});
|
|
190
|
-
return acc;
|
|
191
|
-
}, {
|
|
192
|
-
abs: [],
|
|
193
|
-
rel: []
|
|
194
|
-
});
|
|
195
|
-
return {
|
|
196
|
-
VC,
|
|
197
|
-
VCBox,
|
|
198
|
-
VCEntries,
|
|
199
|
-
totalPainted
|
|
200
|
-
};
|
|
201
|
-
});
|
|
202
|
-
}
|
|
203
|
-
applyChangesToHeatMap(a, time, classification) {
|
|
204
|
-
const {
|
|
205
|
-
l,
|
|
206
|
-
t,
|
|
207
|
-
r,
|
|
208
|
-
b
|
|
209
|
-
} = a;
|
|
210
|
-
const size = classification.length;
|
|
211
|
-
for (let row = t; row < b; row++) {
|
|
212
|
-
if (this.heatmaps[0][row] === undefined) {
|
|
213
|
-
try {
|
|
214
|
-
return {
|
|
215
|
-
error: `index - ${row}`,
|
|
216
|
-
time
|
|
217
|
-
};
|
|
218
|
-
} catch (e) {
|
|
219
|
-
return {
|
|
220
|
-
error: 'row error',
|
|
221
|
-
time
|
|
222
|
-
};
|
|
223
|
-
}
|
|
224
|
-
} else {
|
|
225
|
-
for (let heatmapIndex = 0; heatmapIndex < size; heatmapIndex++) {
|
|
226
|
-
if (classification[heatmapIndex]) {
|
|
227
|
-
this.heatmaps[heatmapIndex].fill(time, this.getIndex(l, row), this.getIndex(r, row));
|
|
228
|
-
}
|
|
229
|
-
}
|
|
230
|
-
}
|
|
231
|
-
}
|
|
232
|
-
return true;
|
|
233
|
-
}
|
|
234
|
-
getIndex(x, y) {
|
|
235
|
-
return x + this.arraySize.w * y;
|
|
236
|
-
}
|
|
237
|
-
getCleanHeatmap() {
|
|
238
|
-
return new Int32Array(this.arraySize.w * this.arraySize.h);
|
|
239
|
-
}
|
|
240
|
-
static makeVCReturnObj(VCParts) {
|
|
241
|
-
const vc = {};
|
|
242
|
-
VCParts.forEach(v => {
|
|
243
|
-
vc[v] = null;
|
|
244
|
-
});
|
|
245
|
-
return vc;
|
|
246
|
-
}
|
|
247
|
-
}
|
|
@@ -1,48 +0,0 @@
|
|
|
1
|
-
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
2
|
-
export class ViewportUpdateClassifier {
|
|
3
|
-
constructor() {
|
|
4
|
-
_defineProperty(this, "types", []);
|
|
5
|
-
_defineProperty(this, "filters", []);
|
|
6
|
-
_defineProperty(this, "removedFilters", []);
|
|
7
|
-
_defineProperty(this, "__combinedTypes", []);
|
|
8
|
-
_defineProperty(this, "__combinedFilters", []);
|
|
9
|
-
}
|
|
10
|
-
VCCalculationMethod(_) {
|
|
11
|
-
return {
|
|
12
|
-
VC: {},
|
|
13
|
-
VCBox: {}
|
|
14
|
-
};
|
|
15
|
-
}
|
|
16
|
-
|
|
17
|
-
// @todo remove it once fixed as described: https://product-fabric.atlassian.net/browse/AFO-3443
|
|
18
|
-
filterComponentsLog({
|
|
19
|
-
componentsLog
|
|
20
|
-
}) {
|
|
21
|
-
return componentsLog;
|
|
22
|
-
}
|
|
23
|
-
mergeConfig() {
|
|
24
|
-
this.__combinedTypes = [...this.types, ...((this === null || this === void 0 ? void 0 : this.__combinedTypes) || [])];
|
|
25
|
-
const previousFilters = this.removedFilters.length === 0 ? this.__combinedFilters : this.__combinedFilters.filter(filter => !this.removedFilters.includes(filter.name));
|
|
26
|
-
this.__combinedFilters = [...this.filters, ...previousFilters];
|
|
27
|
-
}
|
|
28
|
-
classifyUpdate({
|
|
29
|
-
element,
|
|
30
|
-
type,
|
|
31
|
-
tags,
|
|
32
|
-
ignoreReason
|
|
33
|
-
}) {
|
|
34
|
-
if (!this.__combinedTypes.includes(type)) {
|
|
35
|
-
return false;
|
|
36
|
-
}
|
|
37
|
-
return this.__combinedFilters.every(({
|
|
38
|
-
filter,
|
|
39
|
-
name
|
|
40
|
-
}) => {
|
|
41
|
-
return filter({
|
|
42
|
-
type,
|
|
43
|
-
tags,
|
|
44
|
-
ignoreReason
|
|
45
|
-
});
|
|
46
|
-
});
|
|
47
|
-
}
|
|
48
|
-
}
|
|
@@ -1,55 +0,0 @@
|
|
|
1
|
-
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
2
|
-
import { ViewportUpdateClassifier } from './ViewportUpdateClassifier';
|
|
3
|
-
const legacyIgnoreReasons = ['image', 'ssr-hydration'];
|
|
4
|
-
export class FY25_01Classifier extends ViewportUpdateClassifier {
|
|
5
|
-
VCCalculationMethod({
|
|
6
|
-
VCParts,
|
|
7
|
-
entries,
|
|
8
|
-
totalPainted,
|
|
9
|
-
componentsLog
|
|
10
|
-
}) {
|
|
11
|
-
const VC = {};
|
|
12
|
-
const VCBox = {};
|
|
13
|
-
entries.reduce((acc = 0, v) => {
|
|
14
|
-
let VCRatio = v[1] / totalPainted + acc;
|
|
15
|
-
const time = v[0];
|
|
16
|
-
|
|
17
|
-
// @todo apply fix to include small changes into accumulator
|
|
18
|
-
const preciseCurrRatio = Math.round(100 * (v[1] / totalPainted));
|
|
19
|
-
const preciseAccRatio = Math.round(acc * 100);
|
|
20
|
-
VCRatio = (preciseCurrRatio + preciseAccRatio) / 100;
|
|
21
|
-
VCParts.forEach(value => {
|
|
22
|
-
if ((VC[value] === null || VC[value] === undefined) && VCRatio >= value / 100) {
|
|
23
|
-
var _componentsLog$time;
|
|
24
|
-
VC[value] = time;
|
|
25
|
-
VCBox[value] = new Set();
|
|
26
|
-
(_componentsLog$time = componentsLog[time]) === null || _componentsLog$time === void 0 ? void 0 : _componentsLog$time.forEach(v => {
|
|
27
|
-
var _VCBox$value;
|
|
28
|
-
return (_VCBox$value = VCBox[value]) === null || _VCBox$value === void 0 ? void 0 : _VCBox$value.add(v.targetName);
|
|
29
|
-
});
|
|
30
|
-
}
|
|
31
|
-
});
|
|
32
|
-
return VCRatio;
|
|
33
|
-
}, 0);
|
|
34
|
-
return {
|
|
35
|
-
VC,
|
|
36
|
-
VCBox
|
|
37
|
-
};
|
|
38
|
-
}
|
|
39
|
-
constructor() {
|
|
40
|
-
super();
|
|
41
|
-
_defineProperty(this, "revision", 'fy25.01');
|
|
42
|
-
_defineProperty(this, "types", ['html', 'text']);
|
|
43
|
-
_defineProperty(this, "filters", [{
|
|
44
|
-
name: 'default-ignore-reasons',
|
|
45
|
-
filter: ({
|
|
46
|
-
type,
|
|
47
|
-
ignoreReason
|
|
48
|
-
}) => {
|
|
49
|
-
return !ignoreReason || !legacyIgnoreReasons.includes(ignoreReason);
|
|
50
|
-
}
|
|
51
|
-
}]);
|
|
52
|
-
this.mergeConfig();
|
|
53
|
-
}
|
|
54
|
-
}
|
|
55
|
-
export const revFY25_01Classifier = new FY25_01Classifier();
|
|
@@ -1,35 +0,0 @@
|
|
|
1
|
-
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
2
|
-
import { FY25_01Classifier } from './fy25_01';
|
|
3
|
-
export class FY25_02Classifier extends FY25_01Classifier {
|
|
4
|
-
// @todo remove it once fixed as described: https://product-fabric.atlassian.net/browse/AFO-3443
|
|
5
|
-
filterComponentsLog({
|
|
6
|
-
componentsLog,
|
|
7
|
-
ttai
|
|
8
|
-
}) {
|
|
9
|
-
const _componentsLog = {};
|
|
10
|
-
Object.entries(componentsLog).forEach(([_timestamp, value]) => {
|
|
11
|
-
const timestamp = Number(_timestamp);
|
|
12
|
-
if (Math.ceil(ttai) >= timestamp) {
|
|
13
|
-
_componentsLog[timestamp] = value;
|
|
14
|
-
}
|
|
15
|
-
});
|
|
16
|
-
return _componentsLog;
|
|
17
|
-
}
|
|
18
|
-
constructor() {
|
|
19
|
-
super();
|
|
20
|
-
_defineProperty(this, "revision", 'fy25.02');
|
|
21
|
-
_defineProperty(this, "types", ['attr']);
|
|
22
|
-
_defineProperty(this, "filters", [{
|
|
23
|
-
name: 'not-visible',
|
|
24
|
-
filter: ({
|
|
25
|
-
type,
|
|
26
|
-
ignoreReason
|
|
27
|
-
}) => {
|
|
28
|
-
return !(ignoreReason !== null && ignoreReason !== void 0 && ignoreReason.includes('not-visible')) && ignoreReason !== 'non-visual-style';
|
|
29
|
-
}
|
|
30
|
-
}]);
|
|
31
|
-
_defineProperty(this, "removedFilters", []);
|
|
32
|
-
this.mergeConfig();
|
|
33
|
-
}
|
|
34
|
-
}
|
|
35
|
-
export const revFY25_02Classifier = new FY25_02Classifier();
|
|
@@ -1,18 +0,0 @@
|
|
|
1
|
-
import { isVCRevisionEnabled } from '../../../config';
|
|
2
|
-
import { revFY25_01Classifier } from './fy25_01';
|
|
3
|
-
import { revFY25_02Classifier } from './fy25_02';
|
|
4
|
-
export function getRevisions() {
|
|
5
|
-
if (!isVCRevisionEnabled('fy25.01')) {
|
|
6
|
-
return [{
|
|
7
|
-
name: 'fy25.02',
|
|
8
|
-
classifier: revFY25_02Classifier
|
|
9
|
-
}];
|
|
10
|
-
}
|
|
11
|
-
return [{
|
|
12
|
-
name: 'fy25.01',
|
|
13
|
-
classifier: revFY25_01Classifier
|
|
14
|
-
}, {
|
|
15
|
-
name: 'fy25.02',
|
|
16
|
-
classifier: revFY25_02Classifier
|
|
17
|
-
}];
|
|
18
|
-
}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export {};
|
|
@@ -1,274 +0,0 @@
|
|
|
1
|
-
import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
|
|
2
|
-
import _objectDestructuringEmpty from "@babel/runtime/helpers/objectDestructuringEmpty";
|
|
3
|
-
import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
|
|
4
|
-
import _createClass from "@babel/runtime/helpers/createClass";
|
|
5
|
-
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
6
|
-
import { getPageVisibilityState } from '../../../hidden-timing';
|
|
7
|
-
var UNUSED_SECTOR = 0;
|
|
8
|
-
export var MultiRevisionHeatmap = /*#__PURE__*/function () {
|
|
9
|
-
function MultiRevisionHeatmap(_ref) {
|
|
10
|
-
var _this = this;
|
|
11
|
-
var viewport = _ref.viewport,
|
|
12
|
-
revisions = _ref.revisions,
|
|
13
|
-
arraySize = _ref.arraySize,
|
|
14
|
-
devToolsEnabled = _ref.devToolsEnabled;
|
|
15
|
-
_classCallCheck(this, MultiRevisionHeatmap);
|
|
16
|
-
_defineProperty(this, "arraySize", {
|
|
17
|
-
w: 200,
|
|
18
|
-
h: 200
|
|
19
|
-
});
|
|
20
|
-
_defineProperty(this, "mapPixelsToHeatmap", function (left, top, width, height) {
|
|
21
|
-
var _this$viewport = _this.viewport,
|
|
22
|
-
w = _this$viewport.w,
|
|
23
|
-
h = _this$viewport.h;
|
|
24
|
-
var l = Math.floor(left / w * _this.arraySize.w);
|
|
25
|
-
var t = Math.floor(top / h * _this.arraySize.h);
|
|
26
|
-
var r = Math.ceil((left + width) / w * _this.arraySize.w);
|
|
27
|
-
var b = Math.ceil((top + height) / h * _this.arraySize.h);
|
|
28
|
-
|
|
29
|
-
// correct values to min - 0, max - arraySize
|
|
30
|
-
var result = {
|
|
31
|
-
l: Math.max(0, l),
|
|
32
|
-
t: Math.max(0, t),
|
|
33
|
-
r: Math.min(_this.arraySize.w, r),
|
|
34
|
-
b: Math.min(_this.arraySize.h, b)
|
|
35
|
-
};
|
|
36
|
-
return result;
|
|
37
|
-
});
|
|
38
|
-
_defineProperty(this, "getElementRatio", function (mappedValues) {
|
|
39
|
-
var r = mappedValues.r,
|
|
40
|
-
l = mappedValues.l,
|
|
41
|
-
b = mappedValues.b,
|
|
42
|
-
t = mappedValues.t;
|
|
43
|
-
return (r - l) * (b - t) / (_this.arraySize.w * _this.arraySize.h);
|
|
44
|
-
});
|
|
45
|
-
this.viewport = viewport;
|
|
46
|
-
this.revisions = revisions;
|
|
47
|
-
if (arraySize) {
|
|
48
|
-
this.arraySize = arraySize;
|
|
49
|
-
}
|
|
50
|
-
this.heatmaps = new Array(revisions.length);
|
|
51
|
-
this.componentsLogs = new Array(revisions.length);
|
|
52
|
-
this.vcRatios = new Array(revisions.length);
|
|
53
|
-
this.devToolsEnabled = devToolsEnabled || false;
|
|
54
|
-
revisions.forEach(function (_ref2, i) {
|
|
55
|
-
_objectDestructuringEmpty(_ref2);
|
|
56
|
-
_this.heatmaps[i] = _this.getCleanHeatmap();
|
|
57
|
-
_this.componentsLogs[i] = {};
|
|
58
|
-
_this.vcRatios[i] = {};
|
|
59
|
-
});
|
|
60
|
-
}
|
|
61
|
-
return _createClass(MultiRevisionHeatmap, [{
|
|
62
|
-
key: "handleUpdate",
|
|
63
|
-
value: function handleUpdate(_ref3) {
|
|
64
|
-
var _this2 = this;
|
|
65
|
-
var time = _ref3.time,
|
|
66
|
-
type = _ref3.type,
|
|
67
|
-
classification = _ref3.classification,
|
|
68
|
-
intersectionRect = _ref3.intersectionRect,
|
|
69
|
-
element = _ref3.element,
|
|
70
|
-
targetName = _ref3.targetName,
|
|
71
|
-
ignoreReason = _ref3.ignoreReason,
|
|
72
|
-
onError = _ref3.onError,
|
|
73
|
-
attributeName = _ref3.attributeName,
|
|
74
|
-
oldValue = _ref3.oldValue,
|
|
75
|
-
newValue = _ref3.newValue;
|
|
76
|
-
var mappedValues = this.mapPixelsToHeatmap(intersectionRect.left, intersectionRect.top, intersectionRect.width, intersectionRect.height);
|
|
77
|
-
var result = this.applyChangesToHeatMap(mappedValues, time, classification);
|
|
78
|
-
if (result !== true) {
|
|
79
|
-
onError(result);
|
|
80
|
-
}
|
|
81
|
-
var componentRatio = this.getElementRatio(mappedValues);
|
|
82
|
-
this.revisions.forEach(function (_, i) {
|
|
83
|
-
if (classification[i]) {
|
|
84
|
-
_this2.vcRatios[i][targetName] = componentRatio;
|
|
85
|
-
}
|
|
86
|
-
if (!_this2.componentsLogs[i][time]) {
|
|
87
|
-
_this2.componentsLogs[i][time] = [];
|
|
88
|
-
}
|
|
89
|
-
_this2.componentsLogs[i][time].push({
|
|
90
|
-
__debug__element: _this2.devToolsEnabled ? new WeakRef(element) : null,
|
|
91
|
-
intersectionRect: intersectionRect,
|
|
92
|
-
targetName: targetName,
|
|
93
|
-
ignoreReason: ignoreReason,
|
|
94
|
-
attributeName: attributeName,
|
|
95
|
-
oldValue: oldValue,
|
|
96
|
-
newValue: newValue
|
|
97
|
-
});
|
|
98
|
-
});
|
|
99
|
-
}
|
|
100
|
-
}, {
|
|
101
|
-
key: "getData",
|
|
102
|
-
value: function getData() {
|
|
103
|
-
return {
|
|
104
|
-
heatmaps: this.heatmaps
|
|
105
|
-
};
|
|
106
|
-
}
|
|
107
|
-
}, {
|
|
108
|
-
key: "getPayloadShapedData",
|
|
109
|
-
value: function getPayloadShapedData(args) {
|
|
110
|
-
var pageVisibilityUpToTTAI = getPageVisibilityState(args.interactionStart, args.ttai);
|
|
111
|
-
var result = this.processData(args);
|
|
112
|
-
var payload = this.revisions.map(function (rev, i) {
|
|
113
|
-
var _vcDetails$;
|
|
114
|
-
var vcDetails = {};
|
|
115
|
-
args.VCParts.forEach(function (VCPart) {
|
|
116
|
-
vcDetails[VCPart] = {
|
|
117
|
-
t: result[i].VC[VCPart] || 0,
|
|
118
|
-
e: Array.from(result[i].VCBox[VCPart] || [])
|
|
119
|
-
};
|
|
120
|
-
});
|
|
121
|
-
return {
|
|
122
|
-
revision: rev.name,
|
|
123
|
-
clean: args.clean,
|
|
124
|
-
'metric:vc90': args.clean && !args.isEventAborted && pageVisibilityUpToTTAI === 'visible' ? vcDetails === null || vcDetails === void 0 || (_vcDetails$ = vcDetails['90']) === null || _vcDetails$ === void 0 ? void 0 : _vcDetails$.t : null,
|
|
125
|
-
vcDetails: vcDetails
|
|
126
|
-
};
|
|
127
|
-
});
|
|
128
|
-
return payload;
|
|
129
|
-
}
|
|
130
|
-
}, {
|
|
131
|
-
key: "processData",
|
|
132
|
-
value: function processData(_ref4) {
|
|
133
|
-
var _this3 = this;
|
|
134
|
-
var VCParts = _ref4.VCParts,
|
|
135
|
-
VCCalculationMethods = _ref4.VCCalculationMethods,
|
|
136
|
-
filterComponentsLog = _ref4.filterComponentsLog,
|
|
137
|
-
ttai = _ref4.ttai,
|
|
138
|
-
_ref4$ssr = _ref4.ssr,
|
|
139
|
-
ssr = _ref4$ssr === void 0 ? UNUSED_SECTOR : _ref4$ssr;
|
|
140
|
-
return this.heatmaps.map(function (heatmap, i) {
|
|
141
|
-
var lastUpdate = {};
|
|
142
|
-
var totalPainted = 0;
|
|
143
|
-
var componentsLog = _this3.componentsLogs[i];
|
|
144
|
-
if (ssr !== UNUSED_SECTOR) {
|
|
145
|
-
var _window$document;
|
|
146
|
-
var element = {
|
|
147
|
-
__debug__element: new WeakRef((_window$document = window.document) === null || _window$document === void 0 ? void 0 : _window$document.body),
|
|
148
|
-
intersectionRect: {
|
|
149
|
-
top: 0,
|
|
150
|
-
left: 0,
|
|
151
|
-
right: 0,
|
|
152
|
-
bottom: 0,
|
|
153
|
-
x: 0,
|
|
154
|
-
y: 0,
|
|
155
|
-
width: _this3.viewport.w,
|
|
156
|
-
height: _this3.viewport.h,
|
|
157
|
-
toJSON: function toJSON() {
|
|
158
|
-
return {};
|
|
159
|
-
}
|
|
160
|
-
},
|
|
161
|
-
targetName: 'SSR'
|
|
162
|
-
};
|
|
163
|
-
if (!componentsLog[ssr]) {
|
|
164
|
-
componentsLog[ssr] = [];
|
|
165
|
-
}
|
|
166
|
-
componentsLog[ssr].push(element);
|
|
167
|
-
}
|
|
168
|
-
for (var _i = 0; _i < heatmap.length; _i++) {
|
|
169
|
-
var rounded = Math.floor(heatmap[_i] === UNUSED_SECTOR && ssr !== UNUSED_SECTOR ? ssr : heatmap[_i]);
|
|
170
|
-
totalPainted += rounded !== UNUSED_SECTOR ? 1 : 0;
|
|
171
|
-
if (rounded !== UNUSED_SECTOR) {
|
|
172
|
-
lastUpdate[rounded] = lastUpdate[rounded] ? lastUpdate[rounded] + 1 : 1;
|
|
173
|
-
}
|
|
174
|
-
}
|
|
175
|
-
var entries = Object.entries(lastUpdate).map(function (a) {
|
|
176
|
-
return [parseInt(a[0], 10), a[1]];
|
|
177
|
-
}).sort(function (a, b) {
|
|
178
|
-
return a[0] > b[0] ? 1 : -1;
|
|
179
|
-
});
|
|
180
|
-
|
|
181
|
-
// @todo remove it once fixed as described: https://product-fabric.atlassian.net/browse/AFO-3443
|
|
182
|
-
componentsLog = filterComponentsLog[i]({
|
|
183
|
-
componentsLog: componentsLog,
|
|
184
|
-
ttai: ttai
|
|
185
|
-
});
|
|
186
|
-
var _VCCalculationMethods = VCCalculationMethods[i]({
|
|
187
|
-
VCParts: VCParts,
|
|
188
|
-
componentsLog: componentsLog,
|
|
189
|
-
entries: entries,
|
|
190
|
-
totalPainted: totalPainted
|
|
191
|
-
}),
|
|
192
|
-
VC = _VCCalculationMethods.VC,
|
|
193
|
-
VCBox = _VCCalculationMethods.VCBox;
|
|
194
|
-
var VCEntries = entries.reduce(function (acc, _ref5, i) {
|
|
195
|
-
var _acc$abs, _componentsLog$timest;
|
|
196
|
-
var _ref6 = _slicedToArray(_ref5, 2),
|
|
197
|
-
timestamp = _ref6[0],
|
|
198
|
-
entryPainted = _ref6[1];
|
|
199
|
-
var currentlyPainted = entryPainted + (((_acc$abs = acc.abs[i - 1]) === null || _acc$abs === void 0 ? void 0 : _acc$abs[1]) || 0);
|
|
200
|
-
var currentlyPaintedRatio = Math.round(currentlyPainted / totalPainted * 1000) / 10;
|
|
201
|
-
var logEntry = (_componentsLog$timest = componentsLog[timestamp]) === null || _componentsLog$timest === void 0 ? void 0 : _componentsLog$timest.map(function (v) {
|
|
202
|
-
return v.targetName;
|
|
203
|
-
});
|
|
204
|
-
acc.abs.push([timestamp, currentlyPainted]);
|
|
205
|
-
acc.rel.push({
|
|
206
|
-
time: timestamp,
|
|
207
|
-
vc: currentlyPaintedRatio,
|
|
208
|
-
elements: logEntry
|
|
209
|
-
});
|
|
210
|
-
return acc;
|
|
211
|
-
}, {
|
|
212
|
-
abs: [],
|
|
213
|
-
rel: []
|
|
214
|
-
});
|
|
215
|
-
return {
|
|
216
|
-
VC: VC,
|
|
217
|
-
VCBox: VCBox,
|
|
218
|
-
VCEntries: VCEntries,
|
|
219
|
-
totalPainted: totalPainted
|
|
220
|
-
};
|
|
221
|
-
});
|
|
222
|
-
}
|
|
223
|
-
}, {
|
|
224
|
-
key: "applyChangesToHeatMap",
|
|
225
|
-
value: function applyChangesToHeatMap(a, time, classification) {
|
|
226
|
-
var l = a.l,
|
|
227
|
-
t = a.t,
|
|
228
|
-
r = a.r,
|
|
229
|
-
b = a.b;
|
|
230
|
-
var size = classification.length;
|
|
231
|
-
for (var row = t; row < b; row++) {
|
|
232
|
-
if (this.heatmaps[0][row] === undefined) {
|
|
233
|
-
try {
|
|
234
|
-
return {
|
|
235
|
-
error: "index - ".concat(row),
|
|
236
|
-
time: time
|
|
237
|
-
};
|
|
238
|
-
} catch (e) {
|
|
239
|
-
return {
|
|
240
|
-
error: 'row error',
|
|
241
|
-
time: time
|
|
242
|
-
};
|
|
243
|
-
}
|
|
244
|
-
} else {
|
|
245
|
-
for (var heatmapIndex = 0; heatmapIndex < size; heatmapIndex++) {
|
|
246
|
-
if (classification[heatmapIndex]) {
|
|
247
|
-
this.heatmaps[heatmapIndex].fill(time, this.getIndex(l, row), this.getIndex(r, row));
|
|
248
|
-
}
|
|
249
|
-
}
|
|
250
|
-
}
|
|
251
|
-
}
|
|
252
|
-
return true;
|
|
253
|
-
}
|
|
254
|
-
}, {
|
|
255
|
-
key: "getIndex",
|
|
256
|
-
value: function getIndex(x, y) {
|
|
257
|
-
return x + this.arraySize.w * y;
|
|
258
|
-
}
|
|
259
|
-
}, {
|
|
260
|
-
key: "getCleanHeatmap",
|
|
261
|
-
value: function getCleanHeatmap() {
|
|
262
|
-
return new Int32Array(this.arraySize.w * this.arraySize.h);
|
|
263
|
-
}
|
|
264
|
-
}], [{
|
|
265
|
-
key: "makeVCReturnObj",
|
|
266
|
-
value: function makeVCReturnObj(VCParts) {
|
|
267
|
-
var vc = {};
|
|
268
|
-
VCParts.forEach(function (v) {
|
|
269
|
-
vc[v] = null;
|
|
270
|
-
});
|
|
271
|
-
return vc;
|
|
272
|
-
}
|
|
273
|
-
}]);
|
|
274
|
-
}();
|