@screeb/rrweb 1.0.20 → 2.1.6-screeb.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/README.md +107 -48
- package/dist/assets/image-bitmap-data-url-worker-IJpC7g_b.js.map +1 -0
- package/dist/entries/assets/image-bitmap-data-url-worker-IJpC7g_b.js.map +1 -0
- package/dist/entries/rrweb-record.cjs +5001 -0
- package/dist/entries/rrweb-record.cjs.map +1 -0
- package/dist/entries/rrweb-record.js +5001 -0
- package/dist/entries/rrweb-record.js.map +1 -0
- package/dist/entries/rrweb-record.umd.cjs +5027 -0
- package/dist/entries/rrweb-record.umd.cjs.map +7 -0
- package/dist/entries/rrweb-record.umd.min.cjs +109 -0
- package/dist/entries/rrweb-record.umd.min.cjs.map +7 -0
- package/dist/entries/rrweb.d.ts +372 -0
- package/dist/rrweb.cjs +10981 -3655
- package/dist/rrweb.cjs.map +1 -1
- package/dist/rrweb.d.cts +80 -172
- package/dist/rrweb.d.ts +80 -172
- package/dist/rrweb.js +10981 -3654
- package/dist/rrweb.js.map +1 -1
- package/dist/rrweb.umd.cjs +11733 -4550
- package/dist/rrweb.umd.cjs.map +4 -4
- package/dist/rrweb.umd.min.cjs +143 -6
- package/dist/rrweb.umd.min.cjs.map +4 -4
- package/dist/style.min.css +1 -1
- package/dist/style.min.css.map +1 -1
- package/dist/umd/rrweb-record.js +5027 -0
- package/dist/umd/rrweb-record.min.js +109 -0
- package/package.json +46 -33
- package/umd/rrweb.js +17661 -0
- package/umd/rrweb.min.js +173 -0
- package/LICENSE +0 -42
- package/dist/ts3.8/rrweb.d.ts +0 -481
|
@@ -0,0 +1,5001 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __defProp = Object.defineProperty;
|
|
3
|
+
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
4
|
+
var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
|
|
5
|
+
var _a;
|
|
6
|
+
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
7
|
+
var EventType = /* @__PURE__ */ ((EventType2) => {
|
|
8
|
+
EventType2[EventType2["DomContentLoaded"] = 0] = "DomContentLoaded";
|
|
9
|
+
EventType2[EventType2["Load"] = 1] = "Load";
|
|
10
|
+
EventType2[EventType2["FullSnapshot"] = 2] = "FullSnapshot";
|
|
11
|
+
EventType2[EventType2["IncrementalSnapshot"] = 3] = "IncrementalSnapshot";
|
|
12
|
+
EventType2[EventType2["Meta"] = 4] = "Meta";
|
|
13
|
+
EventType2[EventType2["Custom"] = 5] = "Custom";
|
|
14
|
+
EventType2[EventType2["Plugin"] = 6] = "Plugin";
|
|
15
|
+
EventType2[EventType2["Asset"] = 7] = "Asset";
|
|
16
|
+
return EventType2;
|
|
17
|
+
})(EventType || {});
|
|
18
|
+
var IncrementalSource = /* @__PURE__ */ ((IncrementalSource2) => {
|
|
19
|
+
IncrementalSource2[IncrementalSource2["Mutation"] = 0] = "Mutation";
|
|
20
|
+
IncrementalSource2[IncrementalSource2["MouseMove"] = 1] = "MouseMove";
|
|
21
|
+
IncrementalSource2[IncrementalSource2["MouseInteraction"] = 2] = "MouseInteraction";
|
|
22
|
+
IncrementalSource2[IncrementalSource2["Scroll"] = 3] = "Scroll";
|
|
23
|
+
IncrementalSource2[IncrementalSource2["ViewportResize"] = 4] = "ViewportResize";
|
|
24
|
+
IncrementalSource2[IncrementalSource2["Input"] = 5] = "Input";
|
|
25
|
+
IncrementalSource2[IncrementalSource2["TouchMove"] = 6] = "TouchMove";
|
|
26
|
+
IncrementalSource2[IncrementalSource2["MediaInteraction"] = 7] = "MediaInteraction";
|
|
27
|
+
IncrementalSource2[IncrementalSource2["StyleSheetRule"] = 8] = "StyleSheetRule";
|
|
28
|
+
IncrementalSource2[IncrementalSource2["CanvasMutation"] = 9] = "CanvasMutation";
|
|
29
|
+
IncrementalSource2[IncrementalSource2["Font"] = 10] = "Font";
|
|
30
|
+
IncrementalSource2[IncrementalSource2["Log"] = 11] = "Log";
|
|
31
|
+
IncrementalSource2[IncrementalSource2["Drag"] = 12] = "Drag";
|
|
32
|
+
IncrementalSource2[IncrementalSource2["StyleDeclaration"] = 13] = "StyleDeclaration";
|
|
33
|
+
IncrementalSource2[IncrementalSource2["Selection"] = 14] = "Selection";
|
|
34
|
+
IncrementalSource2[IncrementalSource2["AdoptedStyleSheet"] = 15] = "AdoptedStyleSheet";
|
|
35
|
+
IncrementalSource2[IncrementalSource2["CustomElement"] = 16] = "CustomElement";
|
|
36
|
+
return IncrementalSource2;
|
|
37
|
+
})(IncrementalSource || {});
|
|
38
|
+
var MouseInteractions = /* @__PURE__ */ ((MouseInteractions2) => {
|
|
39
|
+
MouseInteractions2[MouseInteractions2["MouseUp"] = 0] = "MouseUp";
|
|
40
|
+
MouseInteractions2[MouseInteractions2["MouseDown"] = 1] = "MouseDown";
|
|
41
|
+
MouseInteractions2[MouseInteractions2["Click"] = 2] = "Click";
|
|
42
|
+
MouseInteractions2[MouseInteractions2["ContextMenu"] = 3] = "ContextMenu";
|
|
43
|
+
MouseInteractions2[MouseInteractions2["DblClick"] = 4] = "DblClick";
|
|
44
|
+
MouseInteractions2[MouseInteractions2["Focus"] = 5] = "Focus";
|
|
45
|
+
MouseInteractions2[MouseInteractions2["Blur"] = 6] = "Blur";
|
|
46
|
+
MouseInteractions2[MouseInteractions2["TouchStart"] = 7] = "TouchStart";
|
|
47
|
+
MouseInteractions2[MouseInteractions2["TouchMove_Departed"] = 8] = "TouchMove_Departed";
|
|
48
|
+
MouseInteractions2[MouseInteractions2["TouchEnd"] = 9] = "TouchEnd";
|
|
49
|
+
MouseInteractions2[MouseInteractions2["TouchCancel"] = 10] = "TouchCancel";
|
|
50
|
+
return MouseInteractions2;
|
|
51
|
+
})(MouseInteractions || {});
|
|
52
|
+
var PointerTypes = /* @__PURE__ */ ((PointerTypes2) => {
|
|
53
|
+
PointerTypes2[PointerTypes2["Mouse"] = 0] = "Mouse";
|
|
54
|
+
PointerTypes2[PointerTypes2["Pen"] = 1] = "Pen";
|
|
55
|
+
PointerTypes2[PointerTypes2["Touch"] = 2] = "Touch";
|
|
56
|
+
return PointerTypes2;
|
|
57
|
+
})(PointerTypes || {});
|
|
58
|
+
var CanvasContext = /* @__PURE__ */ ((CanvasContext2) => {
|
|
59
|
+
CanvasContext2[CanvasContext2["2D"] = 0] = "2D";
|
|
60
|
+
CanvasContext2[CanvasContext2["WebGL"] = 1] = "WebGL";
|
|
61
|
+
CanvasContext2[CanvasContext2["WebGL2"] = 2] = "WebGL2";
|
|
62
|
+
return CanvasContext2;
|
|
63
|
+
})(CanvasContext || {});
|
|
64
|
+
var MediaInteractions = /* @__PURE__ */ ((MediaInteractions2) => {
|
|
65
|
+
MediaInteractions2[MediaInteractions2["Play"] = 0] = "Play";
|
|
66
|
+
MediaInteractions2[MediaInteractions2["Pause"] = 1] = "Pause";
|
|
67
|
+
MediaInteractions2[MediaInteractions2["Seeked"] = 2] = "Seeked";
|
|
68
|
+
MediaInteractions2[MediaInteractions2["VolumeChange"] = 3] = "VolumeChange";
|
|
69
|
+
MediaInteractions2[MediaInteractions2["RateChange"] = 4] = "RateChange";
|
|
70
|
+
return MediaInteractions2;
|
|
71
|
+
})(MediaInteractions || {});
|
|
72
|
+
var NodeType = /* @__PURE__ */ ((NodeType2) => {
|
|
73
|
+
NodeType2[NodeType2["Document"] = 0] = "Document";
|
|
74
|
+
NodeType2[NodeType2["DocumentType"] = 1] = "DocumentType";
|
|
75
|
+
NodeType2[NodeType2["Element"] = 2] = "Element";
|
|
76
|
+
NodeType2[NodeType2["Text"] = 3] = "Text";
|
|
77
|
+
NodeType2[NodeType2["CDATA"] = 4] = "CDATA";
|
|
78
|
+
NodeType2[NodeType2["Comment"] = 5] = "Comment";
|
|
79
|
+
return NodeType2;
|
|
80
|
+
})(NodeType || {});
|
|
81
|
+
const testableAccessors = {
|
|
82
|
+
Node: [
|
|
83
|
+
"childNodes",
|
|
84
|
+
"parentNode",
|
|
85
|
+
"parentElement",
|
|
86
|
+
"textContent",
|
|
87
|
+
"ownerDocument",
|
|
88
|
+
"firstChild",
|
|
89
|
+
"lastChild",
|
|
90
|
+
"nextSibling",
|
|
91
|
+
"previousSibling"
|
|
92
|
+
],
|
|
93
|
+
ShadowRoot: ["host", "styleSheets"],
|
|
94
|
+
Element: ["shadowRoot", "querySelector", "querySelectorAll"],
|
|
95
|
+
MutationObserver: []
|
|
96
|
+
};
|
|
97
|
+
const testableMethods = {
|
|
98
|
+
Node: ["contains", "getRootNode"],
|
|
99
|
+
ShadowRoot: ["getSelection"],
|
|
100
|
+
Element: [],
|
|
101
|
+
MutationObserver: ["constructor"]
|
|
102
|
+
};
|
|
103
|
+
const untaintedBasePrototype = {};
|
|
104
|
+
const untaintedBaseIframeCleanup = {};
|
|
105
|
+
const isAngularZonePresent = () => {
|
|
106
|
+
return !!globalThis.Zone;
|
|
107
|
+
};
|
|
108
|
+
function getUntaintedPrototype(key) {
|
|
109
|
+
if (untaintedBasePrototype[key])
|
|
110
|
+
return untaintedBasePrototype[key];
|
|
111
|
+
const defaultObj = globalThis[key];
|
|
112
|
+
const defaultPrototype = defaultObj.prototype;
|
|
113
|
+
const accessorNames = key in testableAccessors ? testableAccessors[key] : void 0;
|
|
114
|
+
const isUntaintedAccessors = Boolean(
|
|
115
|
+
accessorNames && // @ts-expect-error 2345
|
|
116
|
+
accessorNames.every(
|
|
117
|
+
(accessor) => {
|
|
118
|
+
var _a2, _b;
|
|
119
|
+
return Boolean(
|
|
120
|
+
(_b = (_a2 = Object.getOwnPropertyDescriptor(defaultPrototype, accessor)) == null ? void 0 : _a2.get) == null ? void 0 : _b.toString().includes("[native code]")
|
|
121
|
+
);
|
|
122
|
+
}
|
|
123
|
+
)
|
|
124
|
+
);
|
|
125
|
+
const methodNames = key in testableMethods ? testableMethods[key] : void 0;
|
|
126
|
+
const isUntaintedMethods = Boolean(
|
|
127
|
+
methodNames && methodNames.every(
|
|
128
|
+
// @ts-expect-error 2345
|
|
129
|
+
(method) => {
|
|
130
|
+
var _a2;
|
|
131
|
+
return typeof defaultPrototype[method] === "function" && ((_a2 = defaultPrototype[method]) == null ? void 0 : _a2.toString().includes("[native code]"));
|
|
132
|
+
}
|
|
133
|
+
)
|
|
134
|
+
);
|
|
135
|
+
if (isUntaintedAccessors && isUntaintedMethods && !isAngularZonePresent()) {
|
|
136
|
+
untaintedBasePrototype[key] = defaultObj.prototype;
|
|
137
|
+
return defaultObj.prototype;
|
|
138
|
+
}
|
|
139
|
+
try {
|
|
140
|
+
const iframeEl = document.createElement("iframe");
|
|
141
|
+
iframeEl.style.display = "none";
|
|
142
|
+
document.body.appendChild(iframeEl);
|
|
143
|
+
const win = iframeEl.contentWindow;
|
|
144
|
+
if (!win) return defaultObj.prototype;
|
|
145
|
+
const untaintedObject = win[key].prototype;
|
|
146
|
+
if (!untaintedObject) {
|
|
147
|
+
iframeEl.remove();
|
|
148
|
+
return defaultPrototype;
|
|
149
|
+
}
|
|
150
|
+
const ua = navigator.userAgent;
|
|
151
|
+
if (ua.includes("Safari") && !ua.includes("Chrome")) {
|
|
152
|
+
iframeEl.classList.add("rr-block");
|
|
153
|
+
iframeEl.setAttribute("__rrwebUntaintedMutationObserver", "");
|
|
154
|
+
untaintedBaseIframeCleanup[key] = () => iframeEl.remove();
|
|
155
|
+
} else {
|
|
156
|
+
iframeEl.remove();
|
|
157
|
+
}
|
|
158
|
+
return untaintedBasePrototype[key] = untaintedObject;
|
|
159
|
+
} catch {
|
|
160
|
+
return defaultPrototype;
|
|
161
|
+
}
|
|
162
|
+
}
|
|
163
|
+
const untaintedAccessorCache = {};
|
|
164
|
+
function getUntaintedAccessor(key, instance, accessor) {
|
|
165
|
+
var _a2, _b;
|
|
166
|
+
const cached = (_a2 = untaintedAccessorCache[key]) == null ? void 0 : _a2[accessor];
|
|
167
|
+
if (cached) return cached.call(instance);
|
|
168
|
+
const untaintedPrototype = getUntaintedPrototype(key);
|
|
169
|
+
const untaintedAccessor = (_b = Object.getOwnPropertyDescriptor(
|
|
170
|
+
untaintedPrototype,
|
|
171
|
+
accessor
|
|
172
|
+
)) == null ? void 0 : _b.get;
|
|
173
|
+
if (!untaintedAccessor) return instance[accessor];
|
|
174
|
+
(untaintedAccessorCache[key] || (untaintedAccessorCache[key] = {}))[accessor] = untaintedAccessor;
|
|
175
|
+
return untaintedAccessor.call(instance);
|
|
176
|
+
}
|
|
177
|
+
const untaintedMethodCache = {};
|
|
178
|
+
function getUntaintedMethod(key, instance, method) {
|
|
179
|
+
const cacheKey = `${key}.${String(method)}`;
|
|
180
|
+
if (untaintedMethodCache[cacheKey])
|
|
181
|
+
return untaintedMethodCache[cacheKey].bind(
|
|
182
|
+
instance
|
|
183
|
+
);
|
|
184
|
+
const untaintedPrototype = getUntaintedPrototype(key);
|
|
185
|
+
const untaintedMethod = untaintedPrototype[method];
|
|
186
|
+
if (typeof untaintedMethod !== "function") return instance[method];
|
|
187
|
+
untaintedMethodCache[cacheKey] = untaintedMethod;
|
|
188
|
+
return untaintedMethod.bind(instance);
|
|
189
|
+
}
|
|
190
|
+
function ownerDocument(n) {
|
|
191
|
+
return getUntaintedAccessor("Node", n, "ownerDocument");
|
|
192
|
+
}
|
|
193
|
+
function childNodes(n) {
|
|
194
|
+
return getUntaintedAccessor("Node", n, "childNodes");
|
|
195
|
+
}
|
|
196
|
+
function parentNode(n) {
|
|
197
|
+
return getUntaintedAccessor("Node", n, "parentNode");
|
|
198
|
+
}
|
|
199
|
+
function parentElement(n) {
|
|
200
|
+
return getUntaintedAccessor("Node", n, "parentElement");
|
|
201
|
+
}
|
|
202
|
+
function textContent(n) {
|
|
203
|
+
return getUntaintedAccessor("Node", n, "textContent");
|
|
204
|
+
}
|
|
205
|
+
function firstChild(n) {
|
|
206
|
+
return getUntaintedAccessor("Node", n, "firstChild");
|
|
207
|
+
}
|
|
208
|
+
function lastChild(n) {
|
|
209
|
+
return getUntaintedAccessor("Node", n, "lastChild");
|
|
210
|
+
}
|
|
211
|
+
function nextSibling(n) {
|
|
212
|
+
return getUntaintedAccessor("Node", n, "nextSibling");
|
|
213
|
+
}
|
|
214
|
+
function previousSibling(n) {
|
|
215
|
+
return getUntaintedAccessor("Node", n, "previousSibling");
|
|
216
|
+
}
|
|
217
|
+
function contains(n, other) {
|
|
218
|
+
return getUntaintedMethod("Node", n, "contains")(other);
|
|
219
|
+
}
|
|
220
|
+
function getRootNode(n) {
|
|
221
|
+
return getUntaintedMethod("Node", n, "getRootNode")();
|
|
222
|
+
}
|
|
223
|
+
function host(n) {
|
|
224
|
+
if (!n || !("host" in n)) return null;
|
|
225
|
+
return getUntaintedAccessor("ShadowRoot", n, "host");
|
|
226
|
+
}
|
|
227
|
+
function styleSheets(n) {
|
|
228
|
+
return n.styleSheets;
|
|
229
|
+
}
|
|
230
|
+
function shadowRoot(n) {
|
|
231
|
+
if (!n || !("shadowRoot" in n)) return null;
|
|
232
|
+
return getUntaintedAccessor("Element", n, "shadowRoot");
|
|
233
|
+
}
|
|
234
|
+
function querySelector(n, selectors) {
|
|
235
|
+
return getUntaintedAccessor("Element", n, "querySelector")(selectors);
|
|
236
|
+
}
|
|
237
|
+
function querySelectorAll(n, selectors) {
|
|
238
|
+
return getUntaintedAccessor("Element", n, "querySelectorAll")(selectors);
|
|
239
|
+
}
|
|
240
|
+
function mutationObserverCtor() {
|
|
241
|
+
return [
|
|
242
|
+
getUntaintedPrototype("MutationObserver").constructor,
|
|
243
|
+
untaintedBaseIframeCleanup["MutationObserver"] ?? (() => {
|
|
244
|
+
})
|
|
245
|
+
];
|
|
246
|
+
}
|
|
247
|
+
let nowTimestamp = Date.now;
|
|
248
|
+
if (!/* @__PURE__ */ /[1-9][0-9]{12}/.test(Date.now().toString())) {
|
|
249
|
+
nowTimestamp = () => (/* @__PURE__ */ new Date()).getTime();
|
|
250
|
+
}
|
|
251
|
+
function patch(source, name, replacement) {
|
|
252
|
+
try {
|
|
253
|
+
if (!(name in source)) {
|
|
254
|
+
return () => {
|
|
255
|
+
};
|
|
256
|
+
}
|
|
257
|
+
const original = source[name];
|
|
258
|
+
const wrapped = replacement(original);
|
|
259
|
+
if (typeof wrapped === "function") {
|
|
260
|
+
wrapped.prototype = wrapped.prototype || {};
|
|
261
|
+
Object.defineProperties(wrapped, {
|
|
262
|
+
__rrweb_original__: {
|
|
263
|
+
enumerable: false,
|
|
264
|
+
value: original
|
|
265
|
+
}
|
|
266
|
+
});
|
|
267
|
+
}
|
|
268
|
+
source[name] = wrapped;
|
|
269
|
+
return () => {
|
|
270
|
+
source[name] = original;
|
|
271
|
+
};
|
|
272
|
+
} catch {
|
|
273
|
+
return () => {
|
|
274
|
+
};
|
|
275
|
+
}
|
|
276
|
+
}
|
|
277
|
+
const index = {
|
|
278
|
+
ownerDocument,
|
|
279
|
+
childNodes,
|
|
280
|
+
parentNode,
|
|
281
|
+
parentElement,
|
|
282
|
+
textContent,
|
|
283
|
+
firstChild,
|
|
284
|
+
lastChild,
|
|
285
|
+
nextSibling,
|
|
286
|
+
previousSibling,
|
|
287
|
+
contains,
|
|
288
|
+
getRootNode,
|
|
289
|
+
host,
|
|
290
|
+
styleSheets,
|
|
291
|
+
shadowRoot,
|
|
292
|
+
querySelector,
|
|
293
|
+
querySelectorAll,
|
|
294
|
+
nowTimestamp,
|
|
295
|
+
mutationObserverCtor,
|
|
296
|
+
patch
|
|
297
|
+
};
|
|
298
|
+
function isElement(n) {
|
|
299
|
+
return n.nodeType === n.ELEMENT_NODE;
|
|
300
|
+
}
|
|
301
|
+
function isShadowRoot(n) {
|
|
302
|
+
const hostEl = (
|
|
303
|
+
// anchor and textarea elements also have a `host` property
|
|
304
|
+
// but only shadow roots have a `mode` property
|
|
305
|
+
n && "host" in n && "mode" in n && index.host(n) || null
|
|
306
|
+
);
|
|
307
|
+
return Boolean(
|
|
308
|
+
hostEl && "shadowRoot" in hostEl && index.shadowRoot(hostEl) === n
|
|
309
|
+
);
|
|
310
|
+
}
|
|
311
|
+
function isNativeShadowDom(shadowRoot2) {
|
|
312
|
+
return Object.prototype.toString.call(shadowRoot2) === "[object ShadowRoot]";
|
|
313
|
+
}
|
|
314
|
+
function fixBrowserCompatibilityIssuesInCSS(cssText) {
|
|
315
|
+
if (cssText.includes(" background-clip: text;") && !cssText.includes(" -webkit-background-clip: text;")) {
|
|
316
|
+
cssText = cssText.replace(
|
|
317
|
+
/\sbackground-clip:\s*text;/g,
|
|
318
|
+
" -webkit-background-clip: text; background-clip: text;"
|
|
319
|
+
);
|
|
320
|
+
}
|
|
321
|
+
return cssText;
|
|
322
|
+
}
|
|
323
|
+
function escapeImportStatement(rule) {
|
|
324
|
+
const { cssText } = rule;
|
|
325
|
+
if (cssText.split('"').length < 3) return cssText;
|
|
326
|
+
const statement = ["@import", `url(${JSON.stringify(rule.href)})`];
|
|
327
|
+
if (rule.layerName === "") {
|
|
328
|
+
statement.push(`layer`);
|
|
329
|
+
} else if (rule.layerName) {
|
|
330
|
+
statement.push(`layer(${rule.layerName})`);
|
|
331
|
+
}
|
|
332
|
+
if (rule.supportsText) {
|
|
333
|
+
statement.push(`supports(${rule.supportsText})`);
|
|
334
|
+
}
|
|
335
|
+
if (rule.media.length) {
|
|
336
|
+
statement.push(rule.media.mediaText);
|
|
337
|
+
}
|
|
338
|
+
return statement.join(" ") + ";";
|
|
339
|
+
}
|
|
340
|
+
function stringifyStylesheet(s) {
|
|
341
|
+
try {
|
|
342
|
+
const rules = s.rules || s.cssRules;
|
|
343
|
+
if (!rules) {
|
|
344
|
+
return null;
|
|
345
|
+
}
|
|
346
|
+
let sheetHref = s.href;
|
|
347
|
+
if (!sheetHref && s.ownerNode) {
|
|
348
|
+
sheetHref = s.ownerNode.baseURI;
|
|
349
|
+
}
|
|
350
|
+
const stringifiedRules = Array.from(
|
|
351
|
+
rules,
|
|
352
|
+
(rule) => stringifyRule(rule, sheetHref)
|
|
353
|
+
).join("");
|
|
354
|
+
return fixBrowserCompatibilityIssuesInCSS(stringifiedRules);
|
|
355
|
+
} catch (error) {
|
|
356
|
+
return null;
|
|
357
|
+
}
|
|
358
|
+
}
|
|
359
|
+
function stringifyRule(rule, sheetHref) {
|
|
360
|
+
if (isCSSImportRule(rule)) {
|
|
361
|
+
let importStringified;
|
|
362
|
+
try {
|
|
363
|
+
importStringified = // for same-origin stylesheets,
|
|
364
|
+
// we can access the imported stylesheet rules directly
|
|
365
|
+
stringifyStylesheet(rule.styleSheet) || // work around browser issues with the raw string `@import url(...)` statement
|
|
366
|
+
escapeImportStatement(rule);
|
|
367
|
+
} catch (error) {
|
|
368
|
+
importStringified = rule.cssText;
|
|
369
|
+
}
|
|
370
|
+
if (rule.styleSheet.href) {
|
|
371
|
+
return absolutifyURLs(importStringified, rule.styleSheet.href);
|
|
372
|
+
}
|
|
373
|
+
return importStringified;
|
|
374
|
+
} else {
|
|
375
|
+
let ruleStringified = rule.cssText;
|
|
376
|
+
if (isCSSStyleRule(rule) && rule.selectorText.includes(":")) {
|
|
377
|
+
ruleStringified = fixSafariColons(ruleStringified);
|
|
378
|
+
}
|
|
379
|
+
if (sheetHref) {
|
|
380
|
+
return absolutifyURLs(ruleStringified, sheetHref);
|
|
381
|
+
}
|
|
382
|
+
return ruleStringified;
|
|
383
|
+
}
|
|
384
|
+
}
|
|
385
|
+
function fixSafariColons(cssStringified) {
|
|
386
|
+
const regex = /(\[(?:[\w-]+)[^\\])(:(?:[\w-]+)\])/gm;
|
|
387
|
+
return cssStringified.replace(regex, "$1\\$2");
|
|
388
|
+
}
|
|
389
|
+
function isCSSImportRule(rule) {
|
|
390
|
+
return "styleSheet" in rule;
|
|
391
|
+
}
|
|
392
|
+
function isCSSStyleRule(rule) {
|
|
393
|
+
return "selectorText" in rule;
|
|
394
|
+
}
|
|
395
|
+
class Mirror {
|
|
396
|
+
constructor() {
|
|
397
|
+
__publicField(this, "idNodeMap", /* @__PURE__ */ new Map());
|
|
398
|
+
__publicField(this, "nodeMetaMap", /* @__PURE__ */ new WeakMap());
|
|
399
|
+
}
|
|
400
|
+
getId(n) {
|
|
401
|
+
var _a2;
|
|
402
|
+
if (!n) return -1;
|
|
403
|
+
const id = (_a2 = this.getMeta(n)) == null ? void 0 : _a2.id;
|
|
404
|
+
return id ?? -1;
|
|
405
|
+
}
|
|
406
|
+
getNode(id) {
|
|
407
|
+
return this.idNodeMap.get(id) || null;
|
|
408
|
+
}
|
|
409
|
+
getIds() {
|
|
410
|
+
return Array.from(this.idNodeMap.keys());
|
|
411
|
+
}
|
|
412
|
+
getMeta(n) {
|
|
413
|
+
return this.nodeMetaMap.get(n) || null;
|
|
414
|
+
}
|
|
415
|
+
// removes the node from idNodeMap
|
|
416
|
+
// doesn't remove the node from nodeMetaMap
|
|
417
|
+
removeNodeFromMap(n) {
|
|
418
|
+
const id = this.getId(n);
|
|
419
|
+
this.idNodeMap.delete(id);
|
|
420
|
+
if (n.childNodes) {
|
|
421
|
+
n.childNodes.forEach(
|
|
422
|
+
(childNode) => this.removeNodeFromMap(childNode)
|
|
423
|
+
);
|
|
424
|
+
}
|
|
425
|
+
}
|
|
426
|
+
has(id) {
|
|
427
|
+
return this.idNodeMap.has(id);
|
|
428
|
+
}
|
|
429
|
+
hasNode(node) {
|
|
430
|
+
return this.nodeMetaMap.has(node);
|
|
431
|
+
}
|
|
432
|
+
add(n, meta) {
|
|
433
|
+
const id = meta.id;
|
|
434
|
+
this.idNodeMap.set(id, n);
|
|
435
|
+
this.nodeMetaMap.set(n, meta);
|
|
436
|
+
}
|
|
437
|
+
replace(id, n) {
|
|
438
|
+
const oldNode = this.getNode(id);
|
|
439
|
+
if (oldNode) {
|
|
440
|
+
const meta = this.nodeMetaMap.get(oldNode);
|
|
441
|
+
if (meta) this.nodeMetaMap.set(n, meta);
|
|
442
|
+
}
|
|
443
|
+
this.idNodeMap.set(id, n);
|
|
444
|
+
}
|
|
445
|
+
reset() {
|
|
446
|
+
this.idNodeMap = /* @__PURE__ */ new Map();
|
|
447
|
+
this.nodeMetaMap = /* @__PURE__ */ new WeakMap();
|
|
448
|
+
}
|
|
449
|
+
}
|
|
450
|
+
function createMirror() {
|
|
451
|
+
return new Mirror();
|
|
452
|
+
}
|
|
453
|
+
function maskInputValue({
|
|
454
|
+
element,
|
|
455
|
+
maskInputOptions,
|
|
456
|
+
tagName,
|
|
457
|
+
type,
|
|
458
|
+
value,
|
|
459
|
+
maskInputFn
|
|
460
|
+
}) {
|
|
461
|
+
let text = value || "";
|
|
462
|
+
const actualType = type && toLowerCase(type);
|
|
463
|
+
if (maskInputOptions[tagName.toLowerCase()] || actualType && maskInputOptions[actualType]) {
|
|
464
|
+
if (maskInputFn) {
|
|
465
|
+
text = maskInputFn(text, element);
|
|
466
|
+
} else {
|
|
467
|
+
text = "*".repeat(text.length);
|
|
468
|
+
}
|
|
469
|
+
}
|
|
470
|
+
return text;
|
|
471
|
+
}
|
|
472
|
+
function toLowerCase(str) {
|
|
473
|
+
return str.toLowerCase();
|
|
474
|
+
}
|
|
475
|
+
const ORIGINAL_ATTRIBUTE_NAME = "__rrweb_original__";
|
|
476
|
+
function is2DCanvasBlank(canvas) {
|
|
477
|
+
const ctx = canvas.getContext("2d");
|
|
478
|
+
if (!ctx) return true;
|
|
479
|
+
const chunkSize = 50;
|
|
480
|
+
for (let x = 0; x < canvas.width; x += chunkSize) {
|
|
481
|
+
for (let y = 0; y < canvas.height; y += chunkSize) {
|
|
482
|
+
const getImageData = ctx.getImageData;
|
|
483
|
+
const originalGetImageData = ORIGINAL_ATTRIBUTE_NAME in getImageData ? getImageData[ORIGINAL_ATTRIBUTE_NAME] : getImageData;
|
|
484
|
+
const pixelBuffer = new Uint32Array(
|
|
485
|
+
// eslint-disable-next-line @typescript-eslint/no-unsafe-argument, @typescript-eslint/no-unsafe-member-access
|
|
486
|
+
originalGetImageData.call(
|
|
487
|
+
ctx,
|
|
488
|
+
x,
|
|
489
|
+
y,
|
|
490
|
+
Math.min(chunkSize, canvas.width - x),
|
|
491
|
+
Math.min(chunkSize, canvas.height - y)
|
|
492
|
+
).data.buffer
|
|
493
|
+
);
|
|
494
|
+
if (pixelBuffer.some((pixel) => pixel !== 0)) return false;
|
|
495
|
+
}
|
|
496
|
+
}
|
|
497
|
+
return true;
|
|
498
|
+
}
|
|
499
|
+
function getInputType(element) {
|
|
500
|
+
const type = element.type;
|
|
501
|
+
return element.hasAttribute("data-rr-is-password") ? "password" : type ? (
|
|
502
|
+
// eslint-disable-next-line @typescript-eslint/no-unnecessary-type-assertion
|
|
503
|
+
toLowerCase(type)
|
|
504
|
+
) : null;
|
|
505
|
+
}
|
|
506
|
+
function extractFileExtension(path, baseURL) {
|
|
507
|
+
let url;
|
|
508
|
+
try {
|
|
509
|
+
url = new URL(path, baseURL ?? window.location.href);
|
|
510
|
+
} catch (err) {
|
|
511
|
+
return null;
|
|
512
|
+
}
|
|
513
|
+
const regex = /\.([0-9a-z]+)(?:$)/i;
|
|
514
|
+
const match = url.pathname.match(regex);
|
|
515
|
+
return (match == null ? void 0 : match[1]) ?? null;
|
|
516
|
+
}
|
|
517
|
+
function extractOrigin(url) {
|
|
518
|
+
let origin = "";
|
|
519
|
+
if (url.indexOf("//") > -1) {
|
|
520
|
+
origin = url.split("/").slice(0, 3).join("/");
|
|
521
|
+
} else {
|
|
522
|
+
origin = url.split("/")[0];
|
|
523
|
+
}
|
|
524
|
+
origin = origin.split("?")[0];
|
|
525
|
+
return origin;
|
|
526
|
+
}
|
|
527
|
+
const URL_IN_CSS_REF = /url\((?:(')([^']*)'|(")(.*?)"|([^)]*))\)/gm;
|
|
528
|
+
const URL_PROTOCOL_MATCH = /^(?:[a-z+]+:)?\/\//i;
|
|
529
|
+
const URL_WWW_MATCH = /^www\..*/i;
|
|
530
|
+
const DATA_URI = /^(data:)([^,]*),(.*)/i;
|
|
531
|
+
function absolutifyURLs(cssText, href) {
|
|
532
|
+
return (cssText || "").replace(
|
|
533
|
+
URL_IN_CSS_REF,
|
|
534
|
+
(origin, quote1, path1, quote2, path2, path3) => {
|
|
535
|
+
const filePath = path1 || path2 || path3;
|
|
536
|
+
const maybeQuote = quote1 || quote2 || "";
|
|
537
|
+
if (!filePath) {
|
|
538
|
+
return origin;
|
|
539
|
+
}
|
|
540
|
+
if (URL_PROTOCOL_MATCH.test(filePath) || URL_WWW_MATCH.test(filePath)) {
|
|
541
|
+
return `url(${maybeQuote}${filePath}${maybeQuote})`;
|
|
542
|
+
}
|
|
543
|
+
if (DATA_URI.test(filePath)) {
|
|
544
|
+
return `url(${maybeQuote}${filePath}${maybeQuote})`;
|
|
545
|
+
}
|
|
546
|
+
if (filePath[0] === "/") {
|
|
547
|
+
return `url(${maybeQuote}${extractOrigin(href) + filePath}${maybeQuote})`;
|
|
548
|
+
}
|
|
549
|
+
const filePathNoHash = filePath.split("#")[0];
|
|
550
|
+
const maybeHash = filePath.substring(filePathNoHash.length);
|
|
551
|
+
const stack = href.split("#")[0].split("/");
|
|
552
|
+
const parts = filePathNoHash.split("/");
|
|
553
|
+
stack.pop();
|
|
554
|
+
for (const part of parts) {
|
|
555
|
+
if (part === ".") {
|
|
556
|
+
continue;
|
|
557
|
+
} else if (part === "..") {
|
|
558
|
+
stack.pop();
|
|
559
|
+
} else {
|
|
560
|
+
stack.push(part);
|
|
561
|
+
}
|
|
562
|
+
}
|
|
563
|
+
return `url(${maybeQuote}${stack.join("/")}${maybeHash}${maybeQuote})`;
|
|
564
|
+
}
|
|
565
|
+
);
|
|
566
|
+
}
|
|
567
|
+
function normalizeCssString(cssText, _testNoPxNorm = false) {
|
|
568
|
+
if (_testNoPxNorm) {
|
|
569
|
+
return cssText.replace(/(\/\*[^*]*\*\/)|[\s;]/g, "");
|
|
570
|
+
} else {
|
|
571
|
+
return cssText.replace(/(\/\*[^*]*\*\/)|[\s;]/g, "").replace(/0px/g, "0");
|
|
572
|
+
}
|
|
573
|
+
}
|
|
574
|
+
function splitCssText(cssText, style, _testNoPxNorm = false) {
|
|
575
|
+
const childNodes2 = Array.from(style.childNodes);
|
|
576
|
+
const splits = [];
|
|
577
|
+
let iterCount = 0;
|
|
578
|
+
if (childNodes2.length > 1 && cssText && typeof cssText === "string") {
|
|
579
|
+
let cssTextNorm = normalizeCssString(cssText, _testNoPxNorm);
|
|
580
|
+
const normFactor = cssTextNorm.length / cssText.length;
|
|
581
|
+
for (let i = 1; i < childNodes2.length; i++) {
|
|
582
|
+
if (childNodes2[i].textContent && typeof childNodes2[i].textContent === "string") {
|
|
583
|
+
const textContentNorm = normalizeCssString(
|
|
584
|
+
childNodes2[i].textContent,
|
|
585
|
+
_testNoPxNorm
|
|
586
|
+
);
|
|
587
|
+
const jLimit = 100;
|
|
588
|
+
let j = 3;
|
|
589
|
+
for (; j < textContentNorm.length; j++) {
|
|
590
|
+
if (
|
|
591
|
+
// keep consuming css identifiers (to get a decent chunk more quickly)
|
|
592
|
+
textContentNorm[j].match(/[a-zA-Z0-9]/) || // substring needs to be unique to this section
|
|
593
|
+
textContentNorm.indexOf(textContentNorm.substring(0, j), 1) !== -1
|
|
594
|
+
) {
|
|
595
|
+
continue;
|
|
596
|
+
}
|
|
597
|
+
break;
|
|
598
|
+
}
|
|
599
|
+
for (; j < textContentNorm.length; j++) {
|
|
600
|
+
let startSubstring = textContentNorm.substring(0, j);
|
|
601
|
+
let cssNormSplits = cssTextNorm.split(startSubstring);
|
|
602
|
+
let splitNorm = -1;
|
|
603
|
+
if (cssNormSplits.length === 2) {
|
|
604
|
+
splitNorm = cssNormSplits[0].length;
|
|
605
|
+
} else if (cssNormSplits.length > 2 && cssNormSplits[0] === "" && childNodes2[i - 1].textContent !== "") {
|
|
606
|
+
splitNorm = cssTextNorm.indexOf(startSubstring, 1);
|
|
607
|
+
} else if (cssNormSplits.length === 1) {
|
|
608
|
+
startSubstring = startSubstring.substring(
|
|
609
|
+
0,
|
|
610
|
+
startSubstring.length - 1
|
|
611
|
+
);
|
|
612
|
+
cssNormSplits = cssTextNorm.split(startSubstring);
|
|
613
|
+
if (cssNormSplits.length <= 1) {
|
|
614
|
+
splits.push(cssText);
|
|
615
|
+
return splits;
|
|
616
|
+
}
|
|
617
|
+
j = jLimit + 1;
|
|
618
|
+
} else if (j === textContentNorm.length - 1) {
|
|
619
|
+
splitNorm = cssTextNorm.indexOf(startSubstring);
|
|
620
|
+
}
|
|
621
|
+
if (cssNormSplits.length >= 2 && j > jLimit) {
|
|
622
|
+
const prevTextContent = childNodes2[i - 1].textContent;
|
|
623
|
+
if (prevTextContent && typeof prevTextContent === "string") {
|
|
624
|
+
const prevMinLength = normalizeCssString(prevTextContent).length;
|
|
625
|
+
splitNorm = cssTextNorm.indexOf(startSubstring, prevMinLength);
|
|
626
|
+
}
|
|
627
|
+
if (splitNorm === -1) {
|
|
628
|
+
splitNorm = cssNormSplits[0].length;
|
|
629
|
+
}
|
|
630
|
+
}
|
|
631
|
+
if (splitNorm !== -1) {
|
|
632
|
+
let k = Math.floor(splitNorm / normFactor);
|
|
633
|
+
for (; k > 0 && k < cssText.length; ) {
|
|
634
|
+
iterCount += 1;
|
|
635
|
+
if (iterCount > 50 * childNodes2.length) {
|
|
636
|
+
splits.push(cssText);
|
|
637
|
+
return splits;
|
|
638
|
+
}
|
|
639
|
+
const normPart = normalizeCssString(
|
|
640
|
+
cssText.substring(0, k),
|
|
641
|
+
_testNoPxNorm
|
|
642
|
+
);
|
|
643
|
+
if (normPart.length === splitNorm) {
|
|
644
|
+
splits.push(cssText.substring(0, k));
|
|
645
|
+
cssText = cssText.substring(k);
|
|
646
|
+
cssTextNorm = cssTextNorm.substring(splitNorm);
|
|
647
|
+
break;
|
|
648
|
+
} else if (normPart.length < splitNorm) {
|
|
649
|
+
k += Math.max(
|
|
650
|
+
1,
|
|
651
|
+
Math.floor((splitNorm - normPart.length) / normFactor)
|
|
652
|
+
);
|
|
653
|
+
} else {
|
|
654
|
+
k -= Math.max(
|
|
655
|
+
1,
|
|
656
|
+
Math.floor((normPart.length - splitNorm) * normFactor)
|
|
657
|
+
);
|
|
658
|
+
}
|
|
659
|
+
}
|
|
660
|
+
break;
|
|
661
|
+
}
|
|
662
|
+
}
|
|
663
|
+
}
|
|
664
|
+
}
|
|
665
|
+
}
|
|
666
|
+
splits.push(cssText);
|
|
667
|
+
return splits;
|
|
668
|
+
}
|
|
669
|
+
function markCssSplits(cssText, style) {
|
|
670
|
+
return splitCssText(cssText, style).join("/* rr_split */");
|
|
671
|
+
}
|
|
672
|
+
let _id = 1;
|
|
673
|
+
const tagNameRegex = new RegExp("[^a-z0-9-_:]");
|
|
674
|
+
const IGNORED_NODE = -2;
|
|
675
|
+
function genId() {
|
|
676
|
+
return _id++;
|
|
677
|
+
}
|
|
678
|
+
function getValidTagName(element) {
|
|
679
|
+
if (Object.prototype.toString.call(element) === "[object HTMLFormElement]") {
|
|
680
|
+
return "form";
|
|
681
|
+
}
|
|
682
|
+
const processedTagName = toLowerCase(element.tagName);
|
|
683
|
+
if (tagNameRegex.test(processedTagName)) {
|
|
684
|
+
return "div";
|
|
685
|
+
}
|
|
686
|
+
return processedTagName;
|
|
687
|
+
}
|
|
688
|
+
let canvasService;
|
|
689
|
+
let canvasCtx;
|
|
690
|
+
const SRCSET_NOT_SPACES = /^[^ \t\n\r\u000c]+/;
|
|
691
|
+
const SRCSET_COMMAS_OR_SPACES = /^[, \t\n\r\u000c]+/;
|
|
692
|
+
function getAbsoluteSrcsetString(doc, attributeValue) {
|
|
693
|
+
if (attributeValue.trim() === "") {
|
|
694
|
+
return attributeValue;
|
|
695
|
+
}
|
|
696
|
+
let pos = 0;
|
|
697
|
+
function collectCharacters(regEx) {
|
|
698
|
+
let chars2;
|
|
699
|
+
const match = regEx.exec(attributeValue.substring(pos));
|
|
700
|
+
if (match) {
|
|
701
|
+
chars2 = match[0];
|
|
702
|
+
pos += chars2.length;
|
|
703
|
+
return chars2;
|
|
704
|
+
}
|
|
705
|
+
return "";
|
|
706
|
+
}
|
|
707
|
+
const output = [];
|
|
708
|
+
while (true) {
|
|
709
|
+
collectCharacters(SRCSET_COMMAS_OR_SPACES);
|
|
710
|
+
if (pos >= attributeValue.length) {
|
|
711
|
+
break;
|
|
712
|
+
}
|
|
713
|
+
let url = collectCharacters(SRCSET_NOT_SPACES);
|
|
714
|
+
if (url.slice(-1) === ",") {
|
|
715
|
+
url = absoluteToDoc(doc, url.substring(0, url.length - 1));
|
|
716
|
+
output.push(url);
|
|
717
|
+
} else {
|
|
718
|
+
let descriptorsStr = "";
|
|
719
|
+
url = absoluteToDoc(doc, url);
|
|
720
|
+
let inParens = false;
|
|
721
|
+
while (true) {
|
|
722
|
+
const c = attributeValue.charAt(pos);
|
|
723
|
+
if (c === "") {
|
|
724
|
+
output.push((url + descriptorsStr).trim());
|
|
725
|
+
break;
|
|
726
|
+
} else if (!inParens) {
|
|
727
|
+
if (c === ",") {
|
|
728
|
+
pos += 1;
|
|
729
|
+
output.push((url + descriptorsStr).trim());
|
|
730
|
+
break;
|
|
731
|
+
} else if (c === "(") {
|
|
732
|
+
inParens = true;
|
|
733
|
+
}
|
|
734
|
+
} else {
|
|
735
|
+
if (c === ")") {
|
|
736
|
+
inParens = false;
|
|
737
|
+
}
|
|
738
|
+
}
|
|
739
|
+
descriptorsStr += c;
|
|
740
|
+
pos += 1;
|
|
741
|
+
}
|
|
742
|
+
}
|
|
743
|
+
}
|
|
744
|
+
return output.join(", ");
|
|
745
|
+
}
|
|
746
|
+
const cachedDocument = /* @__PURE__ */ new WeakMap();
|
|
747
|
+
function absoluteToDoc(doc, attributeValue) {
|
|
748
|
+
if (!attributeValue || attributeValue.trim() === "") {
|
|
749
|
+
return attributeValue;
|
|
750
|
+
}
|
|
751
|
+
return getHref(doc, attributeValue);
|
|
752
|
+
}
|
|
753
|
+
function isSVGElement(el) {
|
|
754
|
+
return Boolean(el.tagName === "svg" || el.ownerSVGElement);
|
|
755
|
+
}
|
|
756
|
+
function getHref(doc, customHref) {
|
|
757
|
+
let a = cachedDocument.get(doc);
|
|
758
|
+
if (!a) {
|
|
759
|
+
a = doc.createElement("a");
|
|
760
|
+
cachedDocument.set(doc, a);
|
|
761
|
+
}
|
|
762
|
+
if (!customHref) {
|
|
763
|
+
customHref = "";
|
|
764
|
+
} else if (customHref.startsWith("blob:") || customHref.startsWith("data:")) {
|
|
765
|
+
return customHref;
|
|
766
|
+
}
|
|
767
|
+
a.setAttribute("href", customHref);
|
|
768
|
+
return a.href;
|
|
769
|
+
}
|
|
770
|
+
function transformAttribute(doc, tagName, name, value) {
|
|
771
|
+
if (!value) {
|
|
772
|
+
return value;
|
|
773
|
+
}
|
|
774
|
+
if (name === "src" || name === "href" && !(tagName === "use" && value[0] === "#")) {
|
|
775
|
+
return absoluteToDoc(doc, value);
|
|
776
|
+
} else if (name === "xlink:href" && value[0] !== "#") {
|
|
777
|
+
return absoluteToDoc(doc, value);
|
|
778
|
+
} else if (name === "background" && ["table", "td", "th"].includes(tagName)) {
|
|
779
|
+
return absoluteToDoc(doc, value);
|
|
780
|
+
} else if (name === "srcset") {
|
|
781
|
+
return getAbsoluteSrcsetString(doc, value);
|
|
782
|
+
} else if (name === "style") {
|
|
783
|
+
return absolutifyURLs(value, getHref(doc));
|
|
784
|
+
} else if (tagName === "object" && name === "data") {
|
|
785
|
+
return absoluteToDoc(doc, value);
|
|
786
|
+
}
|
|
787
|
+
return value;
|
|
788
|
+
}
|
|
789
|
+
function ignoreAttribute(tagName, name, _value) {
|
|
790
|
+
return ["video", "audio"].includes(tagName) && toLowerCase(name) === "autoplay";
|
|
791
|
+
}
|
|
792
|
+
function _isBlockedElement(element, blockClass, blockSelector) {
|
|
793
|
+
try {
|
|
794
|
+
if (typeof blockClass === "string") {
|
|
795
|
+
if (element.classList.contains(blockClass)) {
|
|
796
|
+
return true;
|
|
797
|
+
}
|
|
798
|
+
} else {
|
|
799
|
+
for (let eIndex = element.classList.length; eIndex--; ) {
|
|
800
|
+
const className = element.classList[eIndex];
|
|
801
|
+
if (blockClass.test(className)) {
|
|
802
|
+
return true;
|
|
803
|
+
}
|
|
804
|
+
}
|
|
805
|
+
}
|
|
806
|
+
if (blockSelector) {
|
|
807
|
+
return element.matches(blockSelector);
|
|
808
|
+
}
|
|
809
|
+
} catch (e) {
|
|
810
|
+
}
|
|
811
|
+
return false;
|
|
812
|
+
}
|
|
813
|
+
function classMatchesRegex(node, regex, checkAncestors) {
|
|
814
|
+
if (!node) return false;
|
|
815
|
+
if (node.nodeType !== node.ELEMENT_NODE) {
|
|
816
|
+
if (!checkAncestors) return false;
|
|
817
|
+
return classMatchesRegex(index.parentNode(node), regex, checkAncestors);
|
|
818
|
+
}
|
|
819
|
+
for (let eIndex = node.classList.length; eIndex--; ) {
|
|
820
|
+
const className = node.classList[eIndex];
|
|
821
|
+
if (regex.test(className)) {
|
|
822
|
+
return true;
|
|
823
|
+
}
|
|
824
|
+
}
|
|
825
|
+
if (!checkAncestors) return false;
|
|
826
|
+
return classMatchesRegex(index.parentNode(node), regex, checkAncestors);
|
|
827
|
+
}
|
|
828
|
+
function needMaskingText(node, maskTextClass, maskTextSelector, checkAncestors) {
|
|
829
|
+
let el;
|
|
830
|
+
if (isElement(node)) {
|
|
831
|
+
el = node;
|
|
832
|
+
if (!index.childNodes(el).length) {
|
|
833
|
+
return false;
|
|
834
|
+
}
|
|
835
|
+
} else if (index.parentElement(node) === null) {
|
|
836
|
+
return false;
|
|
837
|
+
} else {
|
|
838
|
+
el = index.parentElement(node);
|
|
839
|
+
}
|
|
840
|
+
try {
|
|
841
|
+
if (typeof maskTextClass === "string") {
|
|
842
|
+
if (checkAncestors) {
|
|
843
|
+
if (el.closest(`.${maskTextClass}`)) return true;
|
|
844
|
+
} else {
|
|
845
|
+
if (el.classList.contains(maskTextClass)) return true;
|
|
846
|
+
}
|
|
847
|
+
} else {
|
|
848
|
+
if (classMatchesRegex(el, maskTextClass, checkAncestors)) return true;
|
|
849
|
+
}
|
|
850
|
+
if (maskTextSelector) {
|
|
851
|
+
if (checkAncestors) {
|
|
852
|
+
if (el.closest(maskTextSelector)) return true;
|
|
853
|
+
} else {
|
|
854
|
+
if (el.matches(maskTextSelector)) return true;
|
|
855
|
+
}
|
|
856
|
+
}
|
|
857
|
+
} catch (e) {
|
|
858
|
+
}
|
|
859
|
+
return false;
|
|
860
|
+
}
|
|
861
|
+
function onceIframeLoaded(iframeEl, listener, iframeLoadTimeout) {
|
|
862
|
+
const win = iframeEl.contentWindow;
|
|
863
|
+
if (!win) {
|
|
864
|
+
return;
|
|
865
|
+
}
|
|
866
|
+
let fired = false;
|
|
867
|
+
let readyState;
|
|
868
|
+
try {
|
|
869
|
+
readyState = win.document.readyState;
|
|
870
|
+
} catch (error) {
|
|
871
|
+
return;
|
|
872
|
+
}
|
|
873
|
+
if (readyState !== "complete") {
|
|
874
|
+
const timer = setTimeout(() => {
|
|
875
|
+
if (!fired) {
|
|
876
|
+
listener();
|
|
877
|
+
fired = true;
|
|
878
|
+
}
|
|
879
|
+
}, iframeLoadTimeout);
|
|
880
|
+
iframeEl.addEventListener("load", () => {
|
|
881
|
+
clearTimeout(timer);
|
|
882
|
+
fired = true;
|
|
883
|
+
listener();
|
|
884
|
+
});
|
|
885
|
+
return;
|
|
886
|
+
}
|
|
887
|
+
const blankUrl = "about:blank";
|
|
888
|
+
if (win.location.href !== blankUrl || iframeEl.src === blankUrl || iframeEl.src === "") {
|
|
889
|
+
setTimeout(listener, 0);
|
|
890
|
+
return iframeEl.addEventListener("load", listener);
|
|
891
|
+
}
|
|
892
|
+
iframeEl.addEventListener("load", listener);
|
|
893
|
+
}
|
|
894
|
+
function onceStylesheetLoaded(link, listener, styleSheetLoadTimeout) {
|
|
895
|
+
let fired = false;
|
|
896
|
+
let styleSheetLoaded;
|
|
897
|
+
try {
|
|
898
|
+
styleSheetLoaded = link.sheet;
|
|
899
|
+
} catch (error) {
|
|
900
|
+
return;
|
|
901
|
+
}
|
|
902
|
+
if (styleSheetLoaded) return;
|
|
903
|
+
const timer = setTimeout(() => {
|
|
904
|
+
if (!fired) {
|
|
905
|
+
listener();
|
|
906
|
+
fired = true;
|
|
907
|
+
}
|
|
908
|
+
}, styleSheetLoadTimeout);
|
|
909
|
+
link.addEventListener("load", () => {
|
|
910
|
+
clearTimeout(timer);
|
|
911
|
+
fired = true;
|
|
912
|
+
listener();
|
|
913
|
+
});
|
|
914
|
+
}
|
|
915
|
+
function serializeNode(n, options) {
|
|
916
|
+
const {
|
|
917
|
+
doc,
|
|
918
|
+
mirror: mirror2,
|
|
919
|
+
blockClass,
|
|
920
|
+
blockSelector,
|
|
921
|
+
needsMask,
|
|
922
|
+
inlineStylesheet,
|
|
923
|
+
maskInputOptions = {},
|
|
924
|
+
maskTextFn,
|
|
925
|
+
maskInputFn,
|
|
926
|
+
dataURLOptions = {},
|
|
927
|
+
inlineImages,
|
|
928
|
+
recordCanvas,
|
|
929
|
+
keepIframeSrcFn,
|
|
930
|
+
newlyAddedElement = false,
|
|
931
|
+
cssCaptured = false
|
|
932
|
+
} = options;
|
|
933
|
+
const rootId = getRootId(doc, mirror2);
|
|
934
|
+
switch (n.nodeType) {
|
|
935
|
+
case n.DOCUMENT_NODE:
|
|
936
|
+
if (n.compatMode !== "CSS1Compat") {
|
|
937
|
+
return {
|
|
938
|
+
type: NodeType.Document,
|
|
939
|
+
childNodes: [],
|
|
940
|
+
compatMode: n.compatMode
|
|
941
|
+
// probably "BackCompat"
|
|
942
|
+
};
|
|
943
|
+
} else {
|
|
944
|
+
return {
|
|
945
|
+
type: NodeType.Document,
|
|
946
|
+
childNodes: []
|
|
947
|
+
};
|
|
948
|
+
}
|
|
949
|
+
case n.DOCUMENT_TYPE_NODE:
|
|
950
|
+
return {
|
|
951
|
+
type: NodeType.DocumentType,
|
|
952
|
+
name: n.name,
|
|
953
|
+
publicId: n.publicId,
|
|
954
|
+
systemId: n.systemId,
|
|
955
|
+
rootId
|
|
956
|
+
};
|
|
957
|
+
case n.ELEMENT_NODE:
|
|
958
|
+
return serializeElementNode(n, {
|
|
959
|
+
doc,
|
|
960
|
+
blockClass,
|
|
961
|
+
blockSelector,
|
|
962
|
+
inlineStylesheet,
|
|
963
|
+
maskInputOptions,
|
|
964
|
+
maskInputFn,
|
|
965
|
+
dataURLOptions,
|
|
966
|
+
inlineImages,
|
|
967
|
+
recordCanvas,
|
|
968
|
+
keepIframeSrcFn,
|
|
969
|
+
newlyAddedElement,
|
|
970
|
+
rootId
|
|
971
|
+
});
|
|
972
|
+
case n.TEXT_NODE:
|
|
973
|
+
return serializeTextNode(n, {
|
|
974
|
+
doc,
|
|
975
|
+
needsMask,
|
|
976
|
+
maskTextFn,
|
|
977
|
+
rootId,
|
|
978
|
+
cssCaptured
|
|
979
|
+
});
|
|
980
|
+
case n.CDATA_SECTION_NODE:
|
|
981
|
+
return {
|
|
982
|
+
type: NodeType.CDATA,
|
|
983
|
+
textContent: "",
|
|
984
|
+
rootId
|
|
985
|
+
};
|
|
986
|
+
case n.COMMENT_NODE:
|
|
987
|
+
return {
|
|
988
|
+
type: NodeType.Comment,
|
|
989
|
+
textContent: index.textContent(n) || "",
|
|
990
|
+
rootId
|
|
991
|
+
};
|
|
992
|
+
default:
|
|
993
|
+
return false;
|
|
994
|
+
}
|
|
995
|
+
}
|
|
996
|
+
function getRootId(doc, mirror2) {
|
|
997
|
+
if (!mirror2.hasNode(doc)) return void 0;
|
|
998
|
+
const docId = mirror2.getId(doc);
|
|
999
|
+
return docId === 1 ? void 0 : docId;
|
|
1000
|
+
}
|
|
1001
|
+
function serializeTextNode(n, options) {
|
|
1002
|
+
const { needsMask, maskTextFn, rootId, cssCaptured } = options;
|
|
1003
|
+
const parent = index.parentNode(n);
|
|
1004
|
+
const parentTagName = parent && parent.tagName;
|
|
1005
|
+
let textContent2 = "";
|
|
1006
|
+
const isStyle = parentTagName === "STYLE" ? true : void 0;
|
|
1007
|
+
const isScript = parentTagName === "SCRIPT" ? true : void 0;
|
|
1008
|
+
if (isScript) {
|
|
1009
|
+
textContent2 = "SCRIPT_PLACEHOLDER";
|
|
1010
|
+
} else if (!cssCaptured) {
|
|
1011
|
+
textContent2 = index.textContent(n);
|
|
1012
|
+
if (isStyle && textContent2) {
|
|
1013
|
+
textContent2 = absolutifyURLs(textContent2, getHref(options.doc));
|
|
1014
|
+
}
|
|
1015
|
+
}
|
|
1016
|
+
if (!isStyle && !isScript && textContent2 && needsMask) {
|
|
1017
|
+
textContent2 = maskTextFn ? maskTextFn(textContent2, index.parentElement(n)) : textContent2.replace(/[\S]/g, "*");
|
|
1018
|
+
}
|
|
1019
|
+
return {
|
|
1020
|
+
type: NodeType.Text,
|
|
1021
|
+
textContent: textContent2 || "",
|
|
1022
|
+
rootId
|
|
1023
|
+
};
|
|
1024
|
+
}
|
|
1025
|
+
function serializeElementNode(n, options) {
|
|
1026
|
+
const {
|
|
1027
|
+
doc,
|
|
1028
|
+
blockClass,
|
|
1029
|
+
blockSelector,
|
|
1030
|
+
inlineStylesheet,
|
|
1031
|
+
maskInputOptions = {},
|
|
1032
|
+
maskInputFn,
|
|
1033
|
+
dataURLOptions = {},
|
|
1034
|
+
inlineImages,
|
|
1035
|
+
recordCanvas,
|
|
1036
|
+
keepIframeSrcFn,
|
|
1037
|
+
newlyAddedElement = false,
|
|
1038
|
+
rootId
|
|
1039
|
+
} = options;
|
|
1040
|
+
const needBlock = _isBlockedElement(n, blockClass, blockSelector);
|
|
1041
|
+
const tagName = getValidTagName(n);
|
|
1042
|
+
let attributes = {};
|
|
1043
|
+
const len = n.attributes.length;
|
|
1044
|
+
for (let i = 0; i < len; i++) {
|
|
1045
|
+
const attr = n.attributes[i];
|
|
1046
|
+
if (!ignoreAttribute(tagName, attr.name, attr.value)) {
|
|
1047
|
+
attributes[attr.name] = transformAttribute(
|
|
1048
|
+
doc,
|
|
1049
|
+
tagName,
|
|
1050
|
+
toLowerCase(attr.name),
|
|
1051
|
+
attr.value
|
|
1052
|
+
);
|
|
1053
|
+
}
|
|
1054
|
+
}
|
|
1055
|
+
if (tagName === "link" && inlineStylesheet) {
|
|
1056
|
+
const stylesheet = Array.from(doc.styleSheets).find((s) => {
|
|
1057
|
+
return s.href === n.href;
|
|
1058
|
+
});
|
|
1059
|
+
let cssText = null;
|
|
1060
|
+
if (stylesheet) {
|
|
1061
|
+
cssText = stringifyStylesheet(stylesheet);
|
|
1062
|
+
}
|
|
1063
|
+
if (cssText) {
|
|
1064
|
+
delete attributes.rel;
|
|
1065
|
+
delete attributes.href;
|
|
1066
|
+
attributes._cssText = cssText;
|
|
1067
|
+
}
|
|
1068
|
+
}
|
|
1069
|
+
if (tagName === "style" && n.sheet) {
|
|
1070
|
+
let cssText = stringifyStylesheet(
|
|
1071
|
+
n.sheet
|
|
1072
|
+
);
|
|
1073
|
+
if (cssText) {
|
|
1074
|
+
if (n.childNodes.length > 1) {
|
|
1075
|
+
cssText = markCssSplits(cssText, n);
|
|
1076
|
+
}
|
|
1077
|
+
attributes._cssText = cssText;
|
|
1078
|
+
}
|
|
1079
|
+
}
|
|
1080
|
+
if (["input", "textarea", "select"].includes(tagName)) {
|
|
1081
|
+
const value = n.value;
|
|
1082
|
+
const checked = n.checked;
|
|
1083
|
+
if (attributes.type !== "radio" && attributes.type !== "checkbox" && attributes.type !== "submit" && attributes.type !== "button" && value) {
|
|
1084
|
+
attributes.value = maskInputValue({
|
|
1085
|
+
element: n,
|
|
1086
|
+
type: getInputType(n),
|
|
1087
|
+
tagName,
|
|
1088
|
+
value,
|
|
1089
|
+
maskInputOptions,
|
|
1090
|
+
maskInputFn
|
|
1091
|
+
});
|
|
1092
|
+
} else if (checked) {
|
|
1093
|
+
attributes.checked = checked;
|
|
1094
|
+
}
|
|
1095
|
+
}
|
|
1096
|
+
if (tagName === "option") {
|
|
1097
|
+
if (n.selected && !maskInputOptions["select"]) {
|
|
1098
|
+
attributes.selected = true;
|
|
1099
|
+
} else {
|
|
1100
|
+
delete attributes.selected;
|
|
1101
|
+
}
|
|
1102
|
+
}
|
|
1103
|
+
if (tagName === "dialog" && n.open) {
|
|
1104
|
+
attributes.rr_open_mode = n.matches("dialog:modal") ? "modal" : "non-modal";
|
|
1105
|
+
}
|
|
1106
|
+
if (tagName === "canvas" && recordCanvas) {
|
|
1107
|
+
if (n.__context === "2d") {
|
|
1108
|
+
if (!is2DCanvasBlank(n)) {
|
|
1109
|
+
attributes.rr_dataURL = n.toDataURL(
|
|
1110
|
+
dataURLOptions.type,
|
|
1111
|
+
dataURLOptions.quality
|
|
1112
|
+
);
|
|
1113
|
+
}
|
|
1114
|
+
} else if (!("__context" in n)) {
|
|
1115
|
+
const canvasDataURL = n.toDataURL(
|
|
1116
|
+
dataURLOptions.type,
|
|
1117
|
+
dataURLOptions.quality
|
|
1118
|
+
);
|
|
1119
|
+
const blankCanvas = doc.createElement("canvas");
|
|
1120
|
+
blankCanvas.width = n.width;
|
|
1121
|
+
blankCanvas.height = n.height;
|
|
1122
|
+
const blankCanvasDataURL = blankCanvas.toDataURL(
|
|
1123
|
+
dataURLOptions.type,
|
|
1124
|
+
dataURLOptions.quality
|
|
1125
|
+
);
|
|
1126
|
+
if (canvasDataURL !== blankCanvasDataURL) {
|
|
1127
|
+
attributes.rr_dataURL = canvasDataURL;
|
|
1128
|
+
}
|
|
1129
|
+
}
|
|
1130
|
+
}
|
|
1131
|
+
if (tagName === "img" && inlineImages) {
|
|
1132
|
+
if (!canvasService) {
|
|
1133
|
+
canvasService = doc.createElement("canvas");
|
|
1134
|
+
canvasCtx = canvasService.getContext("2d");
|
|
1135
|
+
}
|
|
1136
|
+
const image = n;
|
|
1137
|
+
const imageSrc = image.currentSrc || image.getAttribute("src") || "<unknown-src>";
|
|
1138
|
+
const priorCrossOrigin = image.crossOrigin;
|
|
1139
|
+
const recordInlineImage = () => {
|
|
1140
|
+
image.removeEventListener("load", recordInlineImage);
|
|
1141
|
+
try {
|
|
1142
|
+
canvasService.width = image.naturalWidth;
|
|
1143
|
+
canvasService.height = image.naturalHeight;
|
|
1144
|
+
canvasCtx.drawImage(image, 0, 0);
|
|
1145
|
+
attributes.rr_dataURL = canvasService.toDataURL(
|
|
1146
|
+
dataURLOptions.type,
|
|
1147
|
+
dataURLOptions.quality
|
|
1148
|
+
);
|
|
1149
|
+
} catch (err) {
|
|
1150
|
+
if (image.crossOrigin !== "anonymous") {
|
|
1151
|
+
image.crossOrigin = "anonymous";
|
|
1152
|
+
if (image.complete && image.naturalWidth !== 0)
|
|
1153
|
+
recordInlineImage();
|
|
1154
|
+
else image.addEventListener("load", recordInlineImage);
|
|
1155
|
+
return;
|
|
1156
|
+
} else {
|
|
1157
|
+
console.warn(
|
|
1158
|
+
`Cannot inline img src=${imageSrc}! Error: ${err}`
|
|
1159
|
+
);
|
|
1160
|
+
}
|
|
1161
|
+
}
|
|
1162
|
+
if (image.crossOrigin === "anonymous") {
|
|
1163
|
+
priorCrossOrigin ? attributes.crossOrigin = priorCrossOrigin : image.removeAttribute("crossorigin");
|
|
1164
|
+
}
|
|
1165
|
+
};
|
|
1166
|
+
if (image.complete && image.naturalWidth !== 0) recordInlineImage();
|
|
1167
|
+
else image.addEventListener("load", recordInlineImage);
|
|
1168
|
+
}
|
|
1169
|
+
if (["audio", "video"].includes(tagName)) {
|
|
1170
|
+
const mediaAttributes = attributes;
|
|
1171
|
+
mediaAttributes.rr_mediaState = n.paused ? "paused" : "played";
|
|
1172
|
+
mediaAttributes.rr_mediaCurrentTime = n.currentTime;
|
|
1173
|
+
mediaAttributes.rr_mediaPlaybackRate = n.playbackRate;
|
|
1174
|
+
mediaAttributes.rr_mediaMuted = n.muted;
|
|
1175
|
+
mediaAttributes.rr_mediaLoop = n.loop;
|
|
1176
|
+
mediaAttributes.rr_mediaVolume = n.volume;
|
|
1177
|
+
}
|
|
1178
|
+
if (!newlyAddedElement) {
|
|
1179
|
+
if (n.scrollLeft) {
|
|
1180
|
+
attributes.rr_scrollLeft = n.scrollLeft;
|
|
1181
|
+
}
|
|
1182
|
+
if (n.scrollTop) {
|
|
1183
|
+
attributes.rr_scrollTop = n.scrollTop;
|
|
1184
|
+
}
|
|
1185
|
+
}
|
|
1186
|
+
if (needBlock) {
|
|
1187
|
+
const { width, height } = n.getBoundingClientRect();
|
|
1188
|
+
attributes = {
|
|
1189
|
+
class: attributes.class,
|
|
1190
|
+
rr_width: `${width}px`,
|
|
1191
|
+
rr_height: `${height}px`
|
|
1192
|
+
};
|
|
1193
|
+
}
|
|
1194
|
+
if (tagName === "iframe" && !keepIframeSrcFn(attributes.src)) {
|
|
1195
|
+
if (!n.contentDocument) {
|
|
1196
|
+
attributes.rr_src = attributes.src;
|
|
1197
|
+
}
|
|
1198
|
+
delete attributes.src;
|
|
1199
|
+
}
|
|
1200
|
+
let isCustomElement;
|
|
1201
|
+
try {
|
|
1202
|
+
if (customElements.get(tagName)) isCustomElement = true;
|
|
1203
|
+
} catch (e) {
|
|
1204
|
+
}
|
|
1205
|
+
return {
|
|
1206
|
+
type: NodeType.Element,
|
|
1207
|
+
tagName,
|
|
1208
|
+
attributes,
|
|
1209
|
+
childNodes: [],
|
|
1210
|
+
isSVG: isSVGElement(n) || void 0,
|
|
1211
|
+
needBlock,
|
|
1212
|
+
rootId,
|
|
1213
|
+
isCustom: isCustomElement
|
|
1214
|
+
};
|
|
1215
|
+
}
|
|
1216
|
+
function lowerIfExists(maybeAttr) {
|
|
1217
|
+
if (maybeAttr === void 0 || maybeAttr === null) {
|
|
1218
|
+
return "";
|
|
1219
|
+
} else {
|
|
1220
|
+
return maybeAttr.toLowerCase();
|
|
1221
|
+
}
|
|
1222
|
+
}
|
|
1223
|
+
function slimDOMDefaults(_slimDOMOptions) {
|
|
1224
|
+
if (_slimDOMOptions === true || _slimDOMOptions === "all") {
|
|
1225
|
+
return {
|
|
1226
|
+
script: true,
|
|
1227
|
+
comment: true,
|
|
1228
|
+
headFavicon: true,
|
|
1229
|
+
headWhitespace: true,
|
|
1230
|
+
headMetaSocial: true,
|
|
1231
|
+
headMetaRobots: true,
|
|
1232
|
+
headMetaHttpEquiv: true,
|
|
1233
|
+
headMetaVerification: true,
|
|
1234
|
+
// the following are off for slimDOMOptions === true,
|
|
1235
|
+
// as they destroy some (hidden) info:
|
|
1236
|
+
headMetaAuthorship: _slimDOMOptions === "all",
|
|
1237
|
+
headMetaDescKeywords: _slimDOMOptions === "all",
|
|
1238
|
+
headTitleMutations: _slimDOMOptions === "all"
|
|
1239
|
+
};
|
|
1240
|
+
} else if (_slimDOMOptions) {
|
|
1241
|
+
return _slimDOMOptions;
|
|
1242
|
+
}
|
|
1243
|
+
return {};
|
|
1244
|
+
}
|
|
1245
|
+
function slimDOMExcluded(sn, slimDOMOptions) {
|
|
1246
|
+
if (slimDOMOptions.comment && sn.type === NodeType.Comment) {
|
|
1247
|
+
return true;
|
|
1248
|
+
} else if (sn.type === NodeType.Element) {
|
|
1249
|
+
if (slimDOMOptions.script && // script tag
|
|
1250
|
+
(sn.tagName === "script" || // (module)preload link
|
|
1251
|
+
sn.tagName === "link" && (sn.attributes.rel === "preload" && sn.attributes.as === "script" || sn.attributes.rel === "modulepreload") || // prefetch link
|
|
1252
|
+
sn.tagName === "link" && sn.attributes.rel === "prefetch" && typeof sn.attributes.href === "string" && extractFileExtension(sn.attributes.href) === "js")) {
|
|
1253
|
+
return true;
|
|
1254
|
+
} else if (slimDOMOptions.headFavicon && (sn.tagName === "link" && sn.attributes.rel === "shortcut icon" || sn.tagName === "meta" && (lowerIfExists(sn.attributes.name).match(
|
|
1255
|
+
/^msapplication-tile(image|color)$/
|
|
1256
|
+
) || lowerIfExists(sn.attributes.name) === "application-name" || lowerIfExists(sn.attributes.rel) === "icon" || lowerIfExists(sn.attributes.rel) === "apple-touch-icon" || lowerIfExists(sn.attributes.rel) === "shortcut icon"))) {
|
|
1257
|
+
return true;
|
|
1258
|
+
} else if (sn.tagName === "meta") {
|
|
1259
|
+
if (slimDOMOptions.headMetaDescKeywords && lowerIfExists(sn.attributes.name).match(/^description|keywords$/)) {
|
|
1260
|
+
return true;
|
|
1261
|
+
} else if (slimDOMOptions.headMetaSocial && (lowerIfExists(sn.attributes.property).match(/^(og|twitter|fb):/) || // og = opengraph (facebook)
|
|
1262
|
+
lowerIfExists(sn.attributes.name).match(/^(og|twitter):/) || lowerIfExists(sn.attributes.name) === "pinterest")) {
|
|
1263
|
+
return true;
|
|
1264
|
+
} else if (slimDOMOptions.headMetaRobots && (lowerIfExists(sn.attributes.name) === "robots" || lowerIfExists(sn.attributes.name) === "googlebot" || lowerIfExists(sn.attributes.name) === "bingbot")) {
|
|
1265
|
+
return true;
|
|
1266
|
+
} else if (slimDOMOptions.headMetaHttpEquiv && sn.attributes["http-equiv"] !== void 0) {
|
|
1267
|
+
return true;
|
|
1268
|
+
} else if (slimDOMOptions.headMetaAuthorship && (lowerIfExists(sn.attributes.name) === "author" || lowerIfExists(sn.attributes.name) === "generator" || lowerIfExists(sn.attributes.name) === "framework" || lowerIfExists(sn.attributes.name) === "publisher" || lowerIfExists(sn.attributes.name) === "progid" || lowerIfExists(sn.attributes.property).match(/^article:/) || lowerIfExists(sn.attributes.property).match(/^product:/))) {
|
|
1269
|
+
return true;
|
|
1270
|
+
} else if (slimDOMOptions.headMetaVerification && (lowerIfExists(sn.attributes.name) === "google-site-verification" || lowerIfExists(sn.attributes.name) === "yandex-verification" || lowerIfExists(sn.attributes.name) === "csrf-token" || lowerIfExists(sn.attributes.name) === "p:domain_verify" || lowerIfExists(sn.attributes.name) === "verify-v1" || lowerIfExists(sn.attributes.name) === "verification" || lowerIfExists(sn.attributes.name) === "shopify-checkout-api-token")) {
|
|
1271
|
+
return true;
|
|
1272
|
+
}
|
|
1273
|
+
}
|
|
1274
|
+
}
|
|
1275
|
+
return false;
|
|
1276
|
+
}
|
|
1277
|
+
function serializeNodeWithId(n, options) {
|
|
1278
|
+
const {
|
|
1279
|
+
doc,
|
|
1280
|
+
mirror: mirror2,
|
|
1281
|
+
blockClass,
|
|
1282
|
+
blockSelector,
|
|
1283
|
+
maskTextClass,
|
|
1284
|
+
maskTextSelector,
|
|
1285
|
+
skipChild = false,
|
|
1286
|
+
inlineStylesheet = true,
|
|
1287
|
+
maskInputOptions = {},
|
|
1288
|
+
maskTextFn,
|
|
1289
|
+
maskInputFn,
|
|
1290
|
+
slimDOMOptions,
|
|
1291
|
+
dataURLOptions = {},
|
|
1292
|
+
inlineImages = false,
|
|
1293
|
+
recordCanvas = false,
|
|
1294
|
+
onSerialize,
|
|
1295
|
+
onIframeLoad,
|
|
1296
|
+
iframeLoadTimeout = 5e3,
|
|
1297
|
+
onStylesheetLoad,
|
|
1298
|
+
stylesheetLoadTimeout = 5e3,
|
|
1299
|
+
keepIframeSrcFn = () => false,
|
|
1300
|
+
newlyAddedElement = false,
|
|
1301
|
+
cssCaptured = false
|
|
1302
|
+
} = options;
|
|
1303
|
+
let { needsMask } = options;
|
|
1304
|
+
let { preserveWhiteSpace = true } = options;
|
|
1305
|
+
if (!needsMask) {
|
|
1306
|
+
const checkAncestors = needsMask === void 0;
|
|
1307
|
+
needsMask = needMaskingText(
|
|
1308
|
+
n,
|
|
1309
|
+
maskTextClass,
|
|
1310
|
+
maskTextSelector,
|
|
1311
|
+
checkAncestors
|
|
1312
|
+
);
|
|
1313
|
+
}
|
|
1314
|
+
const _serializedNode = serializeNode(n, {
|
|
1315
|
+
doc,
|
|
1316
|
+
mirror: mirror2,
|
|
1317
|
+
blockClass,
|
|
1318
|
+
blockSelector,
|
|
1319
|
+
needsMask,
|
|
1320
|
+
inlineStylesheet,
|
|
1321
|
+
maskInputOptions,
|
|
1322
|
+
maskTextFn,
|
|
1323
|
+
maskInputFn,
|
|
1324
|
+
dataURLOptions,
|
|
1325
|
+
inlineImages,
|
|
1326
|
+
recordCanvas,
|
|
1327
|
+
keepIframeSrcFn,
|
|
1328
|
+
newlyAddedElement,
|
|
1329
|
+
cssCaptured
|
|
1330
|
+
});
|
|
1331
|
+
if (!_serializedNode) {
|
|
1332
|
+
console.warn(n, "not serialized");
|
|
1333
|
+
return null;
|
|
1334
|
+
}
|
|
1335
|
+
let id;
|
|
1336
|
+
if (mirror2.hasNode(n)) {
|
|
1337
|
+
id = mirror2.getId(n);
|
|
1338
|
+
} else if (slimDOMExcluded(_serializedNode, slimDOMOptions) || !preserveWhiteSpace && _serializedNode.type === NodeType.Text && !_serializedNode.textContent.replace(/^\s+|\s+$/gm, "").length) {
|
|
1339
|
+
id = IGNORED_NODE;
|
|
1340
|
+
} else {
|
|
1341
|
+
id = genId();
|
|
1342
|
+
}
|
|
1343
|
+
const serializedNode = Object.assign(_serializedNode, { id });
|
|
1344
|
+
mirror2.add(n, serializedNode);
|
|
1345
|
+
if (id === IGNORED_NODE) {
|
|
1346
|
+
return null;
|
|
1347
|
+
}
|
|
1348
|
+
if (onSerialize) {
|
|
1349
|
+
onSerialize(n);
|
|
1350
|
+
}
|
|
1351
|
+
let recordChild = !skipChild;
|
|
1352
|
+
if (serializedNode.type === NodeType.Element) {
|
|
1353
|
+
recordChild = recordChild && !serializedNode.needBlock;
|
|
1354
|
+
delete serializedNode.needBlock;
|
|
1355
|
+
const shadowRootEl = index.shadowRoot(n);
|
|
1356
|
+
if (shadowRootEl && isNativeShadowDom(shadowRootEl))
|
|
1357
|
+
serializedNode.isShadowHost = true;
|
|
1358
|
+
}
|
|
1359
|
+
if ((serializedNode.type === NodeType.Document || serializedNode.type === NodeType.Element) && recordChild) {
|
|
1360
|
+
if (slimDOMOptions.headWhitespace && serializedNode.type === NodeType.Element && serializedNode.tagName === "head") {
|
|
1361
|
+
preserveWhiteSpace = false;
|
|
1362
|
+
}
|
|
1363
|
+
const bypassOptions = {
|
|
1364
|
+
doc,
|
|
1365
|
+
mirror: mirror2,
|
|
1366
|
+
blockClass,
|
|
1367
|
+
blockSelector,
|
|
1368
|
+
needsMask,
|
|
1369
|
+
maskTextClass,
|
|
1370
|
+
maskTextSelector,
|
|
1371
|
+
skipChild,
|
|
1372
|
+
inlineStylesheet,
|
|
1373
|
+
maskInputOptions,
|
|
1374
|
+
maskTextFn,
|
|
1375
|
+
maskInputFn,
|
|
1376
|
+
slimDOMOptions,
|
|
1377
|
+
dataURLOptions,
|
|
1378
|
+
inlineImages,
|
|
1379
|
+
recordCanvas,
|
|
1380
|
+
preserveWhiteSpace,
|
|
1381
|
+
onSerialize,
|
|
1382
|
+
onIframeLoad,
|
|
1383
|
+
iframeLoadTimeout,
|
|
1384
|
+
onStylesheetLoad,
|
|
1385
|
+
stylesheetLoadTimeout,
|
|
1386
|
+
keepIframeSrcFn,
|
|
1387
|
+
cssCaptured: false
|
|
1388
|
+
};
|
|
1389
|
+
if (serializedNode.type === NodeType.Element && serializedNode.tagName === "textarea" && serializedNode.attributes.value !== void 0) ;
|
|
1390
|
+
else {
|
|
1391
|
+
if (serializedNode.type === NodeType.Element && serializedNode.attributes._cssText !== void 0 && typeof serializedNode.attributes._cssText === "string") {
|
|
1392
|
+
bypassOptions.cssCaptured = true;
|
|
1393
|
+
}
|
|
1394
|
+
for (const childN of Array.from(index.childNodes(n))) {
|
|
1395
|
+
const serializedChildNode = serializeNodeWithId(childN, bypassOptions);
|
|
1396
|
+
if (serializedChildNode) {
|
|
1397
|
+
serializedNode.childNodes.push(serializedChildNode);
|
|
1398
|
+
}
|
|
1399
|
+
}
|
|
1400
|
+
}
|
|
1401
|
+
let shadowRootEl = null;
|
|
1402
|
+
if (isElement(n) && (shadowRootEl = index.shadowRoot(n))) {
|
|
1403
|
+
for (const childN of Array.from(index.childNodes(shadowRootEl))) {
|
|
1404
|
+
const serializedChildNode = serializeNodeWithId(childN, bypassOptions);
|
|
1405
|
+
if (serializedChildNode) {
|
|
1406
|
+
isNativeShadowDom(shadowRootEl) && (serializedChildNode.isShadow = true);
|
|
1407
|
+
serializedNode.childNodes.push(serializedChildNode);
|
|
1408
|
+
}
|
|
1409
|
+
}
|
|
1410
|
+
}
|
|
1411
|
+
}
|
|
1412
|
+
const parent = index.parentNode(n);
|
|
1413
|
+
if (parent && isShadowRoot(parent) && isNativeShadowDom(parent)) {
|
|
1414
|
+
serializedNode.isShadow = true;
|
|
1415
|
+
}
|
|
1416
|
+
if (serializedNode.type === NodeType.Element && serializedNode.tagName === "iframe") {
|
|
1417
|
+
onceIframeLoaded(
|
|
1418
|
+
n,
|
|
1419
|
+
() => {
|
|
1420
|
+
const iframeDoc = n.contentDocument;
|
|
1421
|
+
if (iframeDoc && onIframeLoad) {
|
|
1422
|
+
const serializedIframeNode = serializeNodeWithId(iframeDoc, {
|
|
1423
|
+
doc: iframeDoc,
|
|
1424
|
+
mirror: mirror2,
|
|
1425
|
+
blockClass,
|
|
1426
|
+
blockSelector,
|
|
1427
|
+
needsMask,
|
|
1428
|
+
maskTextClass,
|
|
1429
|
+
maskTextSelector,
|
|
1430
|
+
skipChild: false,
|
|
1431
|
+
inlineStylesheet,
|
|
1432
|
+
maskInputOptions,
|
|
1433
|
+
maskTextFn,
|
|
1434
|
+
maskInputFn,
|
|
1435
|
+
slimDOMOptions,
|
|
1436
|
+
dataURLOptions,
|
|
1437
|
+
inlineImages,
|
|
1438
|
+
recordCanvas,
|
|
1439
|
+
preserveWhiteSpace,
|
|
1440
|
+
onSerialize,
|
|
1441
|
+
onIframeLoad,
|
|
1442
|
+
iframeLoadTimeout,
|
|
1443
|
+
onStylesheetLoad,
|
|
1444
|
+
stylesheetLoadTimeout,
|
|
1445
|
+
keepIframeSrcFn
|
|
1446
|
+
});
|
|
1447
|
+
if (serializedIframeNode) {
|
|
1448
|
+
onIframeLoad(
|
|
1449
|
+
n,
|
|
1450
|
+
serializedIframeNode
|
|
1451
|
+
);
|
|
1452
|
+
}
|
|
1453
|
+
}
|
|
1454
|
+
},
|
|
1455
|
+
iframeLoadTimeout
|
|
1456
|
+
);
|
|
1457
|
+
}
|
|
1458
|
+
if (serializedNode.type === NodeType.Element && serializedNode.tagName === "link" && typeof serializedNode.attributes.rel === "string" && (serializedNode.attributes.rel === "stylesheet" || serializedNode.attributes.rel === "preload" && typeof serializedNode.attributes.href === "string" && extractFileExtension(serializedNode.attributes.href) === "css")) {
|
|
1459
|
+
onceStylesheetLoaded(
|
|
1460
|
+
n,
|
|
1461
|
+
() => {
|
|
1462
|
+
if (onStylesheetLoad) {
|
|
1463
|
+
const serializedLinkNode = serializeNodeWithId(n, {
|
|
1464
|
+
doc,
|
|
1465
|
+
mirror: mirror2,
|
|
1466
|
+
blockClass,
|
|
1467
|
+
blockSelector,
|
|
1468
|
+
needsMask,
|
|
1469
|
+
maskTextClass,
|
|
1470
|
+
maskTextSelector,
|
|
1471
|
+
skipChild: false,
|
|
1472
|
+
inlineStylesheet,
|
|
1473
|
+
maskInputOptions,
|
|
1474
|
+
maskTextFn,
|
|
1475
|
+
maskInputFn,
|
|
1476
|
+
slimDOMOptions,
|
|
1477
|
+
dataURLOptions,
|
|
1478
|
+
inlineImages,
|
|
1479
|
+
recordCanvas,
|
|
1480
|
+
preserveWhiteSpace,
|
|
1481
|
+
onSerialize,
|
|
1482
|
+
onIframeLoad,
|
|
1483
|
+
iframeLoadTimeout,
|
|
1484
|
+
onStylesheetLoad,
|
|
1485
|
+
stylesheetLoadTimeout,
|
|
1486
|
+
keepIframeSrcFn
|
|
1487
|
+
});
|
|
1488
|
+
if (serializedLinkNode) {
|
|
1489
|
+
onStylesheetLoad(
|
|
1490
|
+
n,
|
|
1491
|
+
serializedLinkNode
|
|
1492
|
+
);
|
|
1493
|
+
}
|
|
1494
|
+
}
|
|
1495
|
+
},
|
|
1496
|
+
stylesheetLoadTimeout
|
|
1497
|
+
);
|
|
1498
|
+
}
|
|
1499
|
+
return serializedNode;
|
|
1500
|
+
}
|
|
1501
|
+
function snapshot(n, options) {
|
|
1502
|
+
const {
|
|
1503
|
+
mirror: mirror2 = new Mirror(),
|
|
1504
|
+
blockClass = "rr-block",
|
|
1505
|
+
blockSelector = null,
|
|
1506
|
+
maskTextClass = "rr-mask",
|
|
1507
|
+
maskTextSelector = null,
|
|
1508
|
+
inlineStylesheet = true,
|
|
1509
|
+
inlineImages = false,
|
|
1510
|
+
recordCanvas = false,
|
|
1511
|
+
maskAllInputs = false,
|
|
1512
|
+
maskTextFn,
|
|
1513
|
+
maskInputFn,
|
|
1514
|
+
slimDOM = false,
|
|
1515
|
+
dataURLOptions,
|
|
1516
|
+
preserveWhiteSpace,
|
|
1517
|
+
onSerialize,
|
|
1518
|
+
onIframeLoad,
|
|
1519
|
+
iframeLoadTimeout,
|
|
1520
|
+
onStylesheetLoad,
|
|
1521
|
+
stylesheetLoadTimeout,
|
|
1522
|
+
keepIframeSrcFn = () => false
|
|
1523
|
+
} = options;
|
|
1524
|
+
const maskInputOptions = maskAllInputs === true ? {
|
|
1525
|
+
color: true,
|
|
1526
|
+
date: true,
|
|
1527
|
+
"datetime-local": true,
|
|
1528
|
+
email: true,
|
|
1529
|
+
month: true,
|
|
1530
|
+
number: true,
|
|
1531
|
+
range: true,
|
|
1532
|
+
search: true,
|
|
1533
|
+
tel: true,
|
|
1534
|
+
text: true,
|
|
1535
|
+
time: true,
|
|
1536
|
+
url: true,
|
|
1537
|
+
week: true,
|
|
1538
|
+
textarea: true,
|
|
1539
|
+
select: true,
|
|
1540
|
+
password: true
|
|
1541
|
+
} : maskAllInputs === false ? {
|
|
1542
|
+
password: true
|
|
1543
|
+
} : maskAllInputs;
|
|
1544
|
+
const slimDOMOptions = slimDOMDefaults(slimDOM);
|
|
1545
|
+
return serializeNodeWithId(n, {
|
|
1546
|
+
doc: n,
|
|
1547
|
+
mirror: mirror2,
|
|
1548
|
+
blockClass,
|
|
1549
|
+
blockSelector,
|
|
1550
|
+
maskTextClass,
|
|
1551
|
+
maskTextSelector,
|
|
1552
|
+
skipChild: false,
|
|
1553
|
+
inlineStylesheet,
|
|
1554
|
+
maskInputOptions,
|
|
1555
|
+
maskTextFn,
|
|
1556
|
+
maskInputFn,
|
|
1557
|
+
slimDOMOptions,
|
|
1558
|
+
dataURLOptions,
|
|
1559
|
+
inlineImages,
|
|
1560
|
+
recordCanvas,
|
|
1561
|
+
preserveWhiteSpace,
|
|
1562
|
+
onSerialize,
|
|
1563
|
+
onIframeLoad,
|
|
1564
|
+
iframeLoadTimeout,
|
|
1565
|
+
onStylesheetLoad,
|
|
1566
|
+
stylesheetLoadTimeout,
|
|
1567
|
+
keepIframeSrcFn,
|
|
1568
|
+
newlyAddedElement: false
|
|
1569
|
+
});
|
|
1570
|
+
}
|
|
1571
|
+
class BaseRRNode {
|
|
1572
|
+
// eslint-disable-next-line @typescript-eslint/no-unused-vars, @typescript-eslint/no-explicit-any
|
|
1573
|
+
constructor(..._args) {
|
|
1574
|
+
__publicField(this, "parentElement", null);
|
|
1575
|
+
__publicField(this, "parentNode", null);
|
|
1576
|
+
__publicField(this, "ownerDocument");
|
|
1577
|
+
__publicField(this, "firstChild", null);
|
|
1578
|
+
__publicField(this, "lastChild", null);
|
|
1579
|
+
__publicField(this, "previousSibling", null);
|
|
1580
|
+
__publicField(this, "nextSibling", null);
|
|
1581
|
+
__publicField(this, "ELEMENT_NODE", 1);
|
|
1582
|
+
__publicField(this, "TEXT_NODE", 3);
|
|
1583
|
+
// corresponding nodeType value of standard HTML Node
|
|
1584
|
+
__publicField(this, "nodeType");
|
|
1585
|
+
__publicField(this, "nodeName");
|
|
1586
|
+
__publicField(this, "RRNodeType");
|
|
1587
|
+
}
|
|
1588
|
+
get childNodes() {
|
|
1589
|
+
const childNodes2 = [];
|
|
1590
|
+
let childIterator = this.firstChild;
|
|
1591
|
+
while (childIterator) {
|
|
1592
|
+
childNodes2.push(childIterator);
|
|
1593
|
+
childIterator = childIterator.nextSibling;
|
|
1594
|
+
}
|
|
1595
|
+
return childNodes2;
|
|
1596
|
+
}
|
|
1597
|
+
contains(node) {
|
|
1598
|
+
if (!(node instanceof BaseRRNode)) return false;
|
|
1599
|
+
else if (node.ownerDocument !== this.ownerDocument) return false;
|
|
1600
|
+
else if (node === this) return true;
|
|
1601
|
+
while (node.parentNode) {
|
|
1602
|
+
if (node.parentNode === this) return true;
|
|
1603
|
+
node = node.parentNode;
|
|
1604
|
+
}
|
|
1605
|
+
return false;
|
|
1606
|
+
}
|
|
1607
|
+
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
1608
|
+
appendChild(_newChild) {
|
|
1609
|
+
throw new Error(
|
|
1610
|
+
`RRDomException: Failed to execute 'appendChild' on 'RRNode': This RRNode type does not support this method.`
|
|
1611
|
+
);
|
|
1612
|
+
}
|
|
1613
|
+
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
1614
|
+
insertBefore(_newChild, _refChild) {
|
|
1615
|
+
throw new Error(
|
|
1616
|
+
`RRDomException: Failed to execute 'insertBefore' on 'RRNode': This RRNode type does not support this method.`
|
|
1617
|
+
);
|
|
1618
|
+
}
|
|
1619
|
+
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
1620
|
+
removeChild(_node) {
|
|
1621
|
+
throw new Error(
|
|
1622
|
+
`RRDomException: Failed to execute 'removeChild' on 'RRNode': This RRNode type does not support this method.`
|
|
1623
|
+
);
|
|
1624
|
+
}
|
|
1625
|
+
toString() {
|
|
1626
|
+
return "RRNode";
|
|
1627
|
+
}
|
|
1628
|
+
}
|
|
1629
|
+
function on(type, fn, target = document) {
|
|
1630
|
+
const options = { capture: true, passive: true };
|
|
1631
|
+
target.addEventListener(type, fn, options);
|
|
1632
|
+
return () => target.removeEventListener(type, fn, options);
|
|
1633
|
+
}
|
|
1634
|
+
const DEPARTED_MIRROR_ACCESS_WARNING = "Please stop import mirror directly. Instead of that,\r\nnow you can use replayer.getMirror() to access the mirror instance of a replayer,\r\nor you can use record.mirror to access the mirror instance during recording.";
|
|
1635
|
+
let _mirror = {
|
|
1636
|
+
map: {},
|
|
1637
|
+
getId() {
|
|
1638
|
+
console.error(DEPARTED_MIRROR_ACCESS_WARNING);
|
|
1639
|
+
return -1;
|
|
1640
|
+
},
|
|
1641
|
+
getNode() {
|
|
1642
|
+
console.error(DEPARTED_MIRROR_ACCESS_WARNING);
|
|
1643
|
+
return null;
|
|
1644
|
+
},
|
|
1645
|
+
removeNodeFromMap() {
|
|
1646
|
+
console.error(DEPARTED_MIRROR_ACCESS_WARNING);
|
|
1647
|
+
},
|
|
1648
|
+
has() {
|
|
1649
|
+
console.error(DEPARTED_MIRROR_ACCESS_WARNING);
|
|
1650
|
+
return false;
|
|
1651
|
+
},
|
|
1652
|
+
reset() {
|
|
1653
|
+
console.error(DEPARTED_MIRROR_ACCESS_WARNING);
|
|
1654
|
+
}
|
|
1655
|
+
};
|
|
1656
|
+
if (typeof window !== "undefined" && window.Proxy && window.Reflect) {
|
|
1657
|
+
_mirror = new Proxy(_mirror, {
|
|
1658
|
+
get(target, prop, receiver) {
|
|
1659
|
+
if (prop === "map") {
|
|
1660
|
+
console.error(DEPARTED_MIRROR_ACCESS_WARNING);
|
|
1661
|
+
}
|
|
1662
|
+
return Reflect.get(target, prop, receiver);
|
|
1663
|
+
}
|
|
1664
|
+
});
|
|
1665
|
+
}
|
|
1666
|
+
function throttle(func, wait, options = {}) {
|
|
1667
|
+
let timeout = null;
|
|
1668
|
+
let previous = 0;
|
|
1669
|
+
return function(...args) {
|
|
1670
|
+
const now = Date.now();
|
|
1671
|
+
if (!previous && options.leading === false) {
|
|
1672
|
+
previous = now;
|
|
1673
|
+
}
|
|
1674
|
+
const remaining = wait - (now - previous);
|
|
1675
|
+
const context = this;
|
|
1676
|
+
if (remaining <= 0 || remaining > wait) {
|
|
1677
|
+
if (timeout) {
|
|
1678
|
+
clearTimeout(timeout);
|
|
1679
|
+
timeout = null;
|
|
1680
|
+
}
|
|
1681
|
+
previous = now;
|
|
1682
|
+
func.apply(context, args);
|
|
1683
|
+
} else if (!timeout && options.trailing !== false) {
|
|
1684
|
+
timeout = setTimeout(() => {
|
|
1685
|
+
previous = options.leading === false ? 0 : Date.now();
|
|
1686
|
+
timeout = null;
|
|
1687
|
+
func.apply(context, args);
|
|
1688
|
+
}, remaining);
|
|
1689
|
+
}
|
|
1690
|
+
};
|
|
1691
|
+
}
|
|
1692
|
+
function hookSetter(target, key, d, isRevoked, win = window) {
|
|
1693
|
+
const original = win.Object.getOwnPropertyDescriptor(target, key);
|
|
1694
|
+
win.Object.defineProperty(
|
|
1695
|
+
target,
|
|
1696
|
+
key,
|
|
1697
|
+
isRevoked ? d : {
|
|
1698
|
+
set(value) {
|
|
1699
|
+
setTimeout(() => {
|
|
1700
|
+
d.set.call(this, value);
|
|
1701
|
+
}, 0);
|
|
1702
|
+
if (original && original.set) {
|
|
1703
|
+
original.set.call(this, value);
|
|
1704
|
+
}
|
|
1705
|
+
}
|
|
1706
|
+
}
|
|
1707
|
+
);
|
|
1708
|
+
return () => hookSetter(target, key, original || {}, true);
|
|
1709
|
+
}
|
|
1710
|
+
function getWindowScroll(win) {
|
|
1711
|
+
var _a2, _b, _c, _d;
|
|
1712
|
+
const doc = win.document;
|
|
1713
|
+
return {
|
|
1714
|
+
left: doc.scrollingElement ? doc.scrollingElement.scrollLeft : win.pageXOffset !== void 0 ? win.pageXOffset : doc.documentElement.scrollLeft || (doc == null ? void 0 : doc.body) && ((_a2 = index.parentElement(doc.body)) == null ? void 0 : _a2.scrollLeft) || ((_b = doc == null ? void 0 : doc.body) == null ? void 0 : _b.scrollLeft) || 0,
|
|
1715
|
+
top: doc.scrollingElement ? doc.scrollingElement.scrollTop : win.pageYOffset !== void 0 ? win.pageYOffset : (doc == null ? void 0 : doc.documentElement.scrollTop) || (doc == null ? void 0 : doc.body) && ((_c = index.parentElement(doc.body)) == null ? void 0 : _c.scrollTop) || ((_d = doc == null ? void 0 : doc.body) == null ? void 0 : _d.scrollTop) || 0
|
|
1716
|
+
};
|
|
1717
|
+
}
|
|
1718
|
+
function getWindowHeight(win) {
|
|
1719
|
+
var _a2, _b;
|
|
1720
|
+
return win.innerHeight || ((_a2 = win.document.documentElement) == null ? void 0 : _a2.clientHeight) || ((_b = win.document.body) == null ? void 0 : _b.clientHeight);
|
|
1721
|
+
}
|
|
1722
|
+
function getWindowWidth(win) {
|
|
1723
|
+
var _a2, _b;
|
|
1724
|
+
return win.innerWidth || ((_a2 = win.document.documentElement) == null ? void 0 : _a2.clientWidth) || ((_b = win.document.body) == null ? void 0 : _b.clientWidth);
|
|
1725
|
+
}
|
|
1726
|
+
function closestElementOfNode(node) {
|
|
1727
|
+
if (!node) {
|
|
1728
|
+
return null;
|
|
1729
|
+
}
|
|
1730
|
+
const el = node.nodeType === node.ELEMENT_NODE ? node : index.parentElement(node);
|
|
1731
|
+
return el;
|
|
1732
|
+
}
|
|
1733
|
+
function isBlocked(node, blockClass, blockSelector, checkAncestors) {
|
|
1734
|
+
if (!node) {
|
|
1735
|
+
return false;
|
|
1736
|
+
}
|
|
1737
|
+
const el = closestElementOfNode(node);
|
|
1738
|
+
if (!el) {
|
|
1739
|
+
return false;
|
|
1740
|
+
}
|
|
1741
|
+
try {
|
|
1742
|
+
if (typeof blockClass === "string") {
|
|
1743
|
+
if (el.classList.contains(blockClass)) return true;
|
|
1744
|
+
if (checkAncestors && el.closest("." + blockClass) !== null) return true;
|
|
1745
|
+
} else {
|
|
1746
|
+
if (classMatchesRegex(el, blockClass, checkAncestors)) return true;
|
|
1747
|
+
}
|
|
1748
|
+
} catch (e) {
|
|
1749
|
+
}
|
|
1750
|
+
if (blockSelector) {
|
|
1751
|
+
if (el.matches(blockSelector)) return true;
|
|
1752
|
+
if (checkAncestors && el.closest(blockSelector) !== null) return true;
|
|
1753
|
+
}
|
|
1754
|
+
return false;
|
|
1755
|
+
}
|
|
1756
|
+
function isSerialized(n, mirror2) {
|
|
1757
|
+
return mirror2.getId(n) !== -1;
|
|
1758
|
+
}
|
|
1759
|
+
function isIgnored(n, mirror2, slimDOMOptions) {
|
|
1760
|
+
if (n.tagName === "TITLE" && slimDOMOptions.headTitleMutations) {
|
|
1761
|
+
return true;
|
|
1762
|
+
}
|
|
1763
|
+
return mirror2.getId(n) === IGNORED_NODE;
|
|
1764
|
+
}
|
|
1765
|
+
function isAncestorRemoved(target, mirror2) {
|
|
1766
|
+
if (isShadowRoot(target)) {
|
|
1767
|
+
return false;
|
|
1768
|
+
}
|
|
1769
|
+
const id = mirror2.getId(target);
|
|
1770
|
+
if (!mirror2.has(id)) {
|
|
1771
|
+
return true;
|
|
1772
|
+
}
|
|
1773
|
+
const parent = index.parentNode(target);
|
|
1774
|
+
if (parent && parent.nodeType === target.DOCUMENT_NODE) {
|
|
1775
|
+
return false;
|
|
1776
|
+
}
|
|
1777
|
+
if (!parent) {
|
|
1778
|
+
return true;
|
|
1779
|
+
}
|
|
1780
|
+
return isAncestorRemoved(parent, mirror2);
|
|
1781
|
+
}
|
|
1782
|
+
function legacy_isTouchEvent(event) {
|
|
1783
|
+
return Boolean(event.changedTouches);
|
|
1784
|
+
}
|
|
1785
|
+
function requestAnimationFrameIn(win, callback) {
|
|
1786
|
+
var _a2, _b;
|
|
1787
|
+
const zoneSymbol = (_b = (_a2 = win.Zone) == null ? void 0 : _a2.__symbol__) == null ? void 0 : _b.call(
|
|
1788
|
+
_a2,
|
|
1789
|
+
"requestAnimationFrame"
|
|
1790
|
+
);
|
|
1791
|
+
const native = zoneSymbol && win[zoneSymbol] || win.requestAnimationFrame;
|
|
1792
|
+
return native.call(win, callback);
|
|
1793
|
+
}
|
|
1794
|
+
function polyfill(win = window) {
|
|
1795
|
+
if ("NodeList" in win && !win.NodeList.prototype.forEach) {
|
|
1796
|
+
win.NodeList.prototype.forEach = Array.prototype.forEach;
|
|
1797
|
+
}
|
|
1798
|
+
if ("DOMTokenList" in win && !win.DOMTokenList.prototype.forEach) {
|
|
1799
|
+
win.DOMTokenList.prototype.forEach = Array.prototype.forEach;
|
|
1800
|
+
}
|
|
1801
|
+
}
|
|
1802
|
+
function isSerializedIframe(n, mirror2) {
|
|
1803
|
+
return Boolean(n.nodeName === "IFRAME" && mirror2.getMeta(n));
|
|
1804
|
+
}
|
|
1805
|
+
function isSerializedStylesheet(n, mirror2) {
|
|
1806
|
+
return Boolean(
|
|
1807
|
+
n.nodeName === "LINK" && n.nodeType === n.ELEMENT_NODE && n.getAttribute && n.getAttribute("rel") === "stylesheet" && mirror2.getMeta(n)
|
|
1808
|
+
);
|
|
1809
|
+
}
|
|
1810
|
+
function hasShadowRoot(n) {
|
|
1811
|
+
if (!n) return false;
|
|
1812
|
+
if (n instanceof BaseRRNode && "shadowRoot" in n) {
|
|
1813
|
+
return Boolean(n.shadowRoot);
|
|
1814
|
+
}
|
|
1815
|
+
return Boolean(index.shadowRoot(n));
|
|
1816
|
+
}
|
|
1817
|
+
class StyleSheetMirror {
|
|
1818
|
+
constructor() {
|
|
1819
|
+
__publicField(this, "id", 1);
|
|
1820
|
+
__publicField(this, "styleIDMap", /* @__PURE__ */ new WeakMap());
|
|
1821
|
+
__publicField(this, "idStyleMap", /* @__PURE__ */ new Map());
|
|
1822
|
+
}
|
|
1823
|
+
getId(stylesheet) {
|
|
1824
|
+
return this.styleIDMap.get(stylesheet) ?? -1;
|
|
1825
|
+
}
|
|
1826
|
+
has(stylesheet) {
|
|
1827
|
+
return this.styleIDMap.has(stylesheet);
|
|
1828
|
+
}
|
|
1829
|
+
/**
|
|
1830
|
+
* @returns If the stylesheet is in the mirror, returns the id of the stylesheet. If not, return the new assigned id.
|
|
1831
|
+
*/
|
|
1832
|
+
add(stylesheet, id) {
|
|
1833
|
+
if (this.has(stylesheet)) return this.getId(stylesheet);
|
|
1834
|
+
let newId;
|
|
1835
|
+
if (id === void 0) {
|
|
1836
|
+
newId = this.id++;
|
|
1837
|
+
} else newId = id;
|
|
1838
|
+
this.styleIDMap.set(stylesheet, newId);
|
|
1839
|
+
this.idStyleMap.set(newId, stylesheet);
|
|
1840
|
+
return newId;
|
|
1841
|
+
}
|
|
1842
|
+
getStyle(id) {
|
|
1843
|
+
return this.idStyleMap.get(id) || null;
|
|
1844
|
+
}
|
|
1845
|
+
reset() {
|
|
1846
|
+
this.styleIDMap = /* @__PURE__ */ new WeakMap();
|
|
1847
|
+
this.idStyleMap = /* @__PURE__ */ new Map();
|
|
1848
|
+
this.id = 1;
|
|
1849
|
+
}
|
|
1850
|
+
generateId() {
|
|
1851
|
+
return this.id++;
|
|
1852
|
+
}
|
|
1853
|
+
}
|
|
1854
|
+
function getShadowHost(n) {
|
|
1855
|
+
var _a2;
|
|
1856
|
+
let shadowHost = null;
|
|
1857
|
+
if ("getRootNode" in n && ((_a2 = index.getRootNode(n)) == null ? void 0 : _a2.nodeType) === Node.DOCUMENT_FRAGMENT_NODE && index.host(index.getRootNode(n)))
|
|
1858
|
+
shadowHost = index.host(index.getRootNode(n));
|
|
1859
|
+
return shadowHost;
|
|
1860
|
+
}
|
|
1861
|
+
function getRootShadowHost(n) {
|
|
1862
|
+
let rootShadowHost = n;
|
|
1863
|
+
let shadowHost;
|
|
1864
|
+
while (shadowHost = getShadowHost(rootShadowHost))
|
|
1865
|
+
rootShadowHost = shadowHost;
|
|
1866
|
+
return rootShadowHost;
|
|
1867
|
+
}
|
|
1868
|
+
function shadowHostInDom(n) {
|
|
1869
|
+
const doc = index.ownerDocument(n);
|
|
1870
|
+
if (!doc) return false;
|
|
1871
|
+
const shadowHost = getRootShadowHost(n);
|
|
1872
|
+
return index.contains(doc, shadowHost);
|
|
1873
|
+
}
|
|
1874
|
+
function inDom(n) {
|
|
1875
|
+
const doc = index.ownerDocument(n);
|
|
1876
|
+
if (!doc) return false;
|
|
1877
|
+
return index.contains(doc, n) || shadowHostInDom(n);
|
|
1878
|
+
}
|
|
1879
|
+
const moveKey = (id, parentId) => `${id}@${parentId}`;
|
|
1880
|
+
class MutationBuffer {
|
|
1881
|
+
constructor() {
|
|
1882
|
+
__publicField(this, "frozen", false);
|
|
1883
|
+
__publicField(this, "locked", false);
|
|
1884
|
+
__publicField(this, "texts", []);
|
|
1885
|
+
__publicField(this, "attributes", []);
|
|
1886
|
+
__publicField(this, "attributeMap", /* @__PURE__ */ new WeakMap());
|
|
1887
|
+
__publicField(this, "removes", []);
|
|
1888
|
+
__publicField(this, "mapRemoves", []);
|
|
1889
|
+
__publicField(this, "movedMap", {});
|
|
1890
|
+
/**
|
|
1891
|
+
* the browser MutationObserver emits multiple mutations after
|
|
1892
|
+
* a delay for performance reasons, making tracing added nodes hard
|
|
1893
|
+
* in our `processMutations` callback function.
|
|
1894
|
+
* For example, if we append an element el_1 into body, and then append
|
|
1895
|
+
* another element el_2 into el_1, these two mutations may be passed to the
|
|
1896
|
+
* callback function together when the two operations were done.
|
|
1897
|
+
* Generally we need to trace child nodes of newly added nodes, but in this
|
|
1898
|
+
* case if we count el_2 as el_1's child node in the first mutation record,
|
|
1899
|
+
* then we will count el_2 again in the second mutation record which was
|
|
1900
|
+
* duplicated.
|
|
1901
|
+
* To avoid of duplicate counting added nodes, we use a Set to store
|
|
1902
|
+
* added nodes and its child nodes during iterate mutation records. Then
|
|
1903
|
+
* collect added nodes from the Set which have no duplicate copy. But
|
|
1904
|
+
* this also causes newly added nodes will not be serialized with id ASAP,
|
|
1905
|
+
* which means all the id related calculation should be lazy too.
|
|
1906
|
+
*/
|
|
1907
|
+
__publicField(this, "addedSet", /* @__PURE__ */ new Set());
|
|
1908
|
+
__publicField(this, "movedSet", /* @__PURE__ */ new Set());
|
|
1909
|
+
__publicField(this, "droppedSet", /* @__PURE__ */ new Set());
|
|
1910
|
+
__publicField(this, "removesSubTreeCache", /* @__PURE__ */ new Set());
|
|
1911
|
+
__publicField(this, "mutationCb");
|
|
1912
|
+
__publicField(this, "blockClass");
|
|
1913
|
+
__publicField(this, "blockSelector");
|
|
1914
|
+
__publicField(this, "maskTextClass");
|
|
1915
|
+
__publicField(this, "maskTextSelector");
|
|
1916
|
+
__publicField(this, "inlineStylesheet");
|
|
1917
|
+
__publicField(this, "maskInputOptions");
|
|
1918
|
+
__publicField(this, "maskTextFn");
|
|
1919
|
+
__publicField(this, "maskInputFn");
|
|
1920
|
+
__publicField(this, "keepIframeSrcFn");
|
|
1921
|
+
__publicField(this, "recordCanvas");
|
|
1922
|
+
__publicField(this, "inlineImages");
|
|
1923
|
+
__publicField(this, "slimDOMOptions");
|
|
1924
|
+
__publicField(this, "dataURLOptions");
|
|
1925
|
+
__publicField(this, "doc");
|
|
1926
|
+
__publicField(this, "mirror");
|
|
1927
|
+
__publicField(this, "iframeManager");
|
|
1928
|
+
__publicField(this, "stylesheetManager");
|
|
1929
|
+
__publicField(this, "shadowDomManager");
|
|
1930
|
+
__publicField(this, "canvasManager");
|
|
1931
|
+
__publicField(this, "processedNodeManager");
|
|
1932
|
+
__publicField(this, "unattachedDoc");
|
|
1933
|
+
__publicField(this, "processMutations", (mutations) => {
|
|
1934
|
+
mutations.forEach(this.processMutation);
|
|
1935
|
+
this.emit();
|
|
1936
|
+
});
|
|
1937
|
+
__publicField(this, "emit", () => {
|
|
1938
|
+
if (this.frozen || this.locked) {
|
|
1939
|
+
return;
|
|
1940
|
+
}
|
|
1941
|
+
const adds = [];
|
|
1942
|
+
const addedIds = /* @__PURE__ */ new Set();
|
|
1943
|
+
while (this.mapRemoves.length) {
|
|
1944
|
+
this.mirror.removeNodeFromMap(this.mapRemoves.shift());
|
|
1945
|
+
}
|
|
1946
|
+
for (const n2 of this.movedSet) {
|
|
1947
|
+
const parentNode22 = index.parentNode(n2);
|
|
1948
|
+
if (this.removesSubTreeCache.has(parentNode22) && !this.movedSet.has(parentNode22)) {
|
|
1949
|
+
continue;
|
|
1950
|
+
}
|
|
1951
|
+
this.addedSet.add(n2);
|
|
1952
|
+
}
|
|
1953
|
+
let n = null;
|
|
1954
|
+
let parentNode2 = null;
|
|
1955
|
+
let parentId = -1;
|
|
1956
|
+
let nextSibling2 = null;
|
|
1957
|
+
let ancestorBad = false;
|
|
1958
|
+
const missingParents = /* @__PURE__ */ new Set();
|
|
1959
|
+
const iter = this.addedSet.values();
|
|
1960
|
+
let curr = iter.next();
|
|
1961
|
+
while (this.addedSet.size) {
|
|
1962
|
+
if (n !== null && this.addedSet.has(index.previousSibling(n))) {
|
|
1963
|
+
nextSibling2 = n;
|
|
1964
|
+
n = index.previousSibling(n);
|
|
1965
|
+
} else {
|
|
1966
|
+
if (!this.addedSet.has(curr.value)) {
|
|
1967
|
+
curr = iter.next();
|
|
1968
|
+
}
|
|
1969
|
+
n = curr.value;
|
|
1970
|
+
while (true) {
|
|
1971
|
+
parentNode2 = index.parentNode(n);
|
|
1972
|
+
if (this.addedSet.has(parentNode2)) {
|
|
1973
|
+
n = parentNode2;
|
|
1974
|
+
continue;
|
|
1975
|
+
}
|
|
1976
|
+
break;
|
|
1977
|
+
}
|
|
1978
|
+
if (missingParents.has(parentNode2)) {
|
|
1979
|
+
parentNode2 = null;
|
|
1980
|
+
} else if (parentNode2) {
|
|
1981
|
+
if (!inDom(parentNode2)) {
|
|
1982
|
+
ancestorBad = true;
|
|
1983
|
+
} else {
|
|
1984
|
+
ancestorBad = isSelfOrAncestorInSet(this.droppedSet, parentNode2) || this.removesSubTreeCache.has(parentNode2);
|
|
1985
|
+
if (ancestorBad && isSelfOrAncestorInSet(this.movedSet, n)) {
|
|
1986
|
+
ancestorBad = false;
|
|
1987
|
+
}
|
|
1988
|
+
}
|
|
1989
|
+
if (this.addedSet.has(index.lastChild(parentNode2))) {
|
|
1990
|
+
n = index.lastChild(parentNode2);
|
|
1991
|
+
nextSibling2 = null;
|
|
1992
|
+
} else {
|
|
1993
|
+
while (true) {
|
|
1994
|
+
nextSibling2 = index.nextSibling(n);
|
|
1995
|
+
if (this.addedSet.has(nextSibling2)) {
|
|
1996
|
+
n = nextSibling2;
|
|
1997
|
+
continue;
|
|
1998
|
+
}
|
|
1999
|
+
break;
|
|
2000
|
+
}
|
|
2001
|
+
}
|
|
2002
|
+
parentId = isShadowRoot(parentNode2) ? this.mirror.getId(getShadowHost(n)) : this.mirror.getId(parentNode2);
|
|
2003
|
+
if (parentId === -1 && parentNode2.nodeType === Node.DOCUMENT_FRAGMENT_NODE) {
|
|
2004
|
+
const shadowHost = index.host(parentNode2);
|
|
2005
|
+
parentId = this.mirror.getId(shadowHost);
|
|
2006
|
+
}
|
|
2007
|
+
}
|
|
2008
|
+
}
|
|
2009
|
+
this.addedSet.delete(n);
|
|
2010
|
+
if (!parentNode2 || parentId === -1) {
|
|
2011
|
+
missingParents.add(n);
|
|
2012
|
+
continue;
|
|
2013
|
+
} else if (ancestorBad) {
|
|
2014
|
+
this.droppedSet.add(n);
|
|
2015
|
+
continue;
|
|
2016
|
+
}
|
|
2017
|
+
let cssCaptured = false;
|
|
2018
|
+
if (n.nodeType === Node.TEXT_NODE) {
|
|
2019
|
+
const parentTag = parentNode2.tagName;
|
|
2020
|
+
if (parentTag === "TEXTAREA") {
|
|
2021
|
+
continue;
|
|
2022
|
+
} else if (parentTag === "STYLE" && addedIds.has(parentId)) {
|
|
2023
|
+
cssCaptured = true;
|
|
2024
|
+
}
|
|
2025
|
+
}
|
|
2026
|
+
let nextId = nextSibling2 ? this.mirror.getId(nextSibling2) : null;
|
|
2027
|
+
while (nextId === IGNORED_NODE) {
|
|
2028
|
+
nextSibling2 = nextSibling2 && index.nextSibling(nextSibling2);
|
|
2029
|
+
nextId = nextSibling2 && this.mirror.getId(nextSibling2);
|
|
2030
|
+
}
|
|
2031
|
+
if (nextId === -1) {
|
|
2032
|
+
console.warn(
|
|
2033
|
+
"Couldn't record new node. Couldn't find mirror id for nextSibling:",
|
|
2034
|
+
nextSibling2
|
|
2035
|
+
);
|
|
2036
|
+
n = null;
|
|
2037
|
+
continue;
|
|
2038
|
+
}
|
|
2039
|
+
const sn = serializeNodeWithId(n, {
|
|
2040
|
+
doc: this.doc,
|
|
2041
|
+
mirror: this.mirror,
|
|
2042
|
+
blockClass: this.blockClass,
|
|
2043
|
+
blockSelector: this.blockSelector,
|
|
2044
|
+
maskTextClass: this.maskTextClass,
|
|
2045
|
+
maskTextSelector: this.maskTextSelector,
|
|
2046
|
+
skipChild: true,
|
|
2047
|
+
newlyAddedElement: true,
|
|
2048
|
+
inlineStylesheet: this.inlineStylesheet,
|
|
2049
|
+
maskInputOptions: this.maskInputOptions,
|
|
2050
|
+
maskTextFn: this.maskTextFn,
|
|
2051
|
+
maskInputFn: this.maskInputFn,
|
|
2052
|
+
slimDOMOptions: this.slimDOMOptions,
|
|
2053
|
+
dataURLOptions: this.dataURLOptions,
|
|
2054
|
+
recordCanvas: this.recordCanvas,
|
|
2055
|
+
inlineImages: this.inlineImages,
|
|
2056
|
+
onSerialize: (currentN) => {
|
|
2057
|
+
if (isSerializedIframe(currentN, this.mirror)) {
|
|
2058
|
+
this.iframeManager.addIframe(currentN);
|
|
2059
|
+
}
|
|
2060
|
+
if (isSerializedStylesheet(currentN, this.mirror)) {
|
|
2061
|
+
this.stylesheetManager.trackLinkElement(
|
|
2062
|
+
currentN
|
|
2063
|
+
);
|
|
2064
|
+
}
|
|
2065
|
+
if (hasShadowRoot(n)) {
|
|
2066
|
+
this.shadowDomManager.addShadowRoot(
|
|
2067
|
+
index.shadowRoot(n),
|
|
2068
|
+
this.doc
|
|
2069
|
+
);
|
|
2070
|
+
}
|
|
2071
|
+
},
|
|
2072
|
+
onIframeLoad: (iframe, childSn) => {
|
|
2073
|
+
this.iframeManager.attachIframe(iframe, childSn);
|
|
2074
|
+
this.shadowDomManager.observeAttachShadow(iframe);
|
|
2075
|
+
},
|
|
2076
|
+
onStylesheetLoad: (link, childSn) => {
|
|
2077
|
+
this.stylesheetManager.attachLinkElement(link, childSn);
|
|
2078
|
+
},
|
|
2079
|
+
cssCaptured
|
|
2080
|
+
});
|
|
2081
|
+
if (sn) {
|
|
2082
|
+
adds.push({
|
|
2083
|
+
parentId,
|
|
2084
|
+
nextId,
|
|
2085
|
+
node: sn
|
|
2086
|
+
});
|
|
2087
|
+
addedIds.add(sn.id);
|
|
2088
|
+
}
|
|
2089
|
+
}
|
|
2090
|
+
const payload = {
|
|
2091
|
+
texts: this.texts.map((text) => {
|
|
2092
|
+
const n2 = text.node;
|
|
2093
|
+
const parent = index.parentNode(n2);
|
|
2094
|
+
if (parent && parent.tagName === "TEXTAREA") {
|
|
2095
|
+
this.genTextAreaValueMutation(parent);
|
|
2096
|
+
}
|
|
2097
|
+
return {
|
|
2098
|
+
id: this.mirror.getId(n2),
|
|
2099
|
+
value: text.value
|
|
2100
|
+
};
|
|
2101
|
+
}).filter((text) => !addedIds.has(text.id)).filter((text) => this.mirror.has(text.id)),
|
|
2102
|
+
attributes: this.attributes.map((attribute) => {
|
|
2103
|
+
const { attributes } = attribute;
|
|
2104
|
+
if (typeof attributes.style === "string") {
|
|
2105
|
+
const diffAsStr = JSON.stringify(attribute.styleDiff);
|
|
2106
|
+
const unchangedAsStr = JSON.stringify(attribute._unchangedStyles);
|
|
2107
|
+
if (diffAsStr.length < attributes.style.length) {
|
|
2108
|
+
if ((diffAsStr + unchangedAsStr).split("var(").length === attributes.style.split("var(").length) {
|
|
2109
|
+
attributes.style = attribute.styleDiff;
|
|
2110
|
+
}
|
|
2111
|
+
}
|
|
2112
|
+
}
|
|
2113
|
+
return {
|
|
2114
|
+
id: this.mirror.getId(attribute.node),
|
|
2115
|
+
attributes
|
|
2116
|
+
};
|
|
2117
|
+
}).filter((attribute) => !addedIds.has(attribute.id)).filter((attribute) => this.mirror.has(attribute.id)),
|
|
2118
|
+
removes: this.removes,
|
|
2119
|
+
adds
|
|
2120
|
+
};
|
|
2121
|
+
if (!payload.texts.length && !payload.attributes.length && !payload.removes.length && !payload.adds.length) {
|
|
2122
|
+
return;
|
|
2123
|
+
}
|
|
2124
|
+
this.texts = [];
|
|
2125
|
+
this.attributes = [];
|
|
2126
|
+
this.attributeMap = /* @__PURE__ */ new WeakMap();
|
|
2127
|
+
this.removes = [];
|
|
2128
|
+
this.addedSet = /* @__PURE__ */ new Set();
|
|
2129
|
+
this.movedSet = /* @__PURE__ */ new Set();
|
|
2130
|
+
this.droppedSet = /* @__PURE__ */ new Set();
|
|
2131
|
+
this.removesSubTreeCache = /* @__PURE__ */ new Set();
|
|
2132
|
+
this.movedMap = {};
|
|
2133
|
+
this.mutationCb(payload);
|
|
2134
|
+
});
|
|
2135
|
+
__publicField(this, "genTextAreaValueMutation", (textarea) => {
|
|
2136
|
+
let item = this.attributeMap.get(textarea);
|
|
2137
|
+
if (!item) {
|
|
2138
|
+
item = {
|
|
2139
|
+
node: textarea,
|
|
2140
|
+
attributes: {},
|
|
2141
|
+
styleDiff: {},
|
|
2142
|
+
_unchangedStyles: {}
|
|
2143
|
+
};
|
|
2144
|
+
this.attributes.push(item);
|
|
2145
|
+
this.attributeMap.set(textarea, item);
|
|
2146
|
+
}
|
|
2147
|
+
const value = Array.from(
|
|
2148
|
+
index.childNodes(textarea),
|
|
2149
|
+
(cn) => index.textContent(cn) || ""
|
|
2150
|
+
).join("");
|
|
2151
|
+
item.attributes.value = maskInputValue({
|
|
2152
|
+
element: textarea,
|
|
2153
|
+
maskInputOptions: this.maskInputOptions,
|
|
2154
|
+
tagName: textarea.tagName,
|
|
2155
|
+
type: getInputType(textarea),
|
|
2156
|
+
value,
|
|
2157
|
+
maskInputFn: this.maskInputFn
|
|
2158
|
+
});
|
|
2159
|
+
});
|
|
2160
|
+
__publicField(this, "processMutation", (m) => {
|
|
2161
|
+
if (isIgnored(m.target, this.mirror, this.slimDOMOptions)) {
|
|
2162
|
+
return;
|
|
2163
|
+
}
|
|
2164
|
+
switch (m.type) {
|
|
2165
|
+
case "characterData": {
|
|
2166
|
+
const value = index.textContent(m.target);
|
|
2167
|
+
if (!isBlocked(m.target, this.blockClass, this.blockSelector, false) && value !== m.oldValue) {
|
|
2168
|
+
this.texts.push({
|
|
2169
|
+
value: needMaskingText(
|
|
2170
|
+
m.target,
|
|
2171
|
+
this.maskTextClass,
|
|
2172
|
+
this.maskTextSelector,
|
|
2173
|
+
true
|
|
2174
|
+
// checkAncestors
|
|
2175
|
+
) && value ? this.maskTextFn ? this.maskTextFn(value, closestElementOfNode(m.target)) : value.replace(/[\S]/g, "*") : value,
|
|
2176
|
+
node: m.target
|
|
2177
|
+
});
|
|
2178
|
+
}
|
|
2179
|
+
break;
|
|
2180
|
+
}
|
|
2181
|
+
case "attributes": {
|
|
2182
|
+
const target = m.target;
|
|
2183
|
+
const tagNameLower = toLowerCase(target.tagName);
|
|
2184
|
+
let attributeName = m.attributeName;
|
|
2185
|
+
let value = m.target.getAttribute(attributeName);
|
|
2186
|
+
if (attributeName === "value") {
|
|
2187
|
+
const type = getInputType(target);
|
|
2188
|
+
value = maskInputValue({
|
|
2189
|
+
element: target,
|
|
2190
|
+
maskInputOptions: this.maskInputOptions,
|
|
2191
|
+
tagName: target.tagName,
|
|
2192
|
+
type,
|
|
2193
|
+
value,
|
|
2194
|
+
maskInputFn: this.maskInputFn
|
|
2195
|
+
});
|
|
2196
|
+
}
|
|
2197
|
+
if (isBlocked(m.target, this.blockClass, this.blockSelector, false) || value === m.oldValue) {
|
|
2198
|
+
return;
|
|
2199
|
+
}
|
|
2200
|
+
let item = this.attributeMap.get(m.target);
|
|
2201
|
+
if (tagNameLower === "iframe" && attributeName === "src" && !this.keepIframeSrcFn(value)) {
|
|
2202
|
+
if (!target.contentDocument) {
|
|
2203
|
+
attributeName = "rr_src";
|
|
2204
|
+
} else {
|
|
2205
|
+
return;
|
|
2206
|
+
}
|
|
2207
|
+
}
|
|
2208
|
+
if (!item) {
|
|
2209
|
+
item = {
|
|
2210
|
+
node: m.target,
|
|
2211
|
+
attributes: {},
|
|
2212
|
+
styleDiff: {},
|
|
2213
|
+
_unchangedStyles: {}
|
|
2214
|
+
};
|
|
2215
|
+
this.attributes.push(item);
|
|
2216
|
+
this.attributeMap.set(m.target, item);
|
|
2217
|
+
}
|
|
2218
|
+
if (attributeName === "type" && tagNameLower === "input" && (m.oldValue || "").toLowerCase() === "password") {
|
|
2219
|
+
target.setAttribute("data-rr-is-password", "true");
|
|
2220
|
+
}
|
|
2221
|
+
if (!ignoreAttribute(tagNameLower, attributeName)) {
|
|
2222
|
+
item.attributes[attributeName] = transformAttribute(
|
|
2223
|
+
this.doc,
|
|
2224
|
+
tagNameLower,
|
|
2225
|
+
toLowerCase(attributeName),
|
|
2226
|
+
value
|
|
2227
|
+
);
|
|
2228
|
+
if (attributeName === "style") {
|
|
2229
|
+
if (!this.unattachedDoc) {
|
|
2230
|
+
try {
|
|
2231
|
+
this.unattachedDoc = document.implementation.createHTMLDocument();
|
|
2232
|
+
} catch (e) {
|
|
2233
|
+
this.unattachedDoc = this.doc;
|
|
2234
|
+
}
|
|
2235
|
+
}
|
|
2236
|
+
const old = this.unattachedDoc.createElement("span");
|
|
2237
|
+
if (m.oldValue) {
|
|
2238
|
+
old.setAttribute("style", m.oldValue);
|
|
2239
|
+
}
|
|
2240
|
+
for (const pname of Array.from(target.style)) {
|
|
2241
|
+
const newValue = target.style.getPropertyValue(pname);
|
|
2242
|
+
const newPriority = target.style.getPropertyPriority(pname);
|
|
2243
|
+
if (newValue !== old.style.getPropertyValue(pname) || newPriority !== old.style.getPropertyPriority(pname)) {
|
|
2244
|
+
if (newPriority === "") {
|
|
2245
|
+
item.styleDiff[pname] = newValue;
|
|
2246
|
+
} else {
|
|
2247
|
+
item.styleDiff[pname] = [newValue, newPriority];
|
|
2248
|
+
}
|
|
2249
|
+
} else {
|
|
2250
|
+
item._unchangedStyles[pname] = [newValue, newPriority];
|
|
2251
|
+
}
|
|
2252
|
+
}
|
|
2253
|
+
for (const pname of Array.from(old.style)) {
|
|
2254
|
+
if (target.style.getPropertyValue(pname) === "") {
|
|
2255
|
+
item.styleDiff[pname] = false;
|
|
2256
|
+
}
|
|
2257
|
+
}
|
|
2258
|
+
} else if (attributeName === "open" && target.tagName === "DIALOG") {
|
|
2259
|
+
if (target.matches("dialog:modal")) {
|
|
2260
|
+
item.attributes["rr_open_mode"] = "modal";
|
|
2261
|
+
} else {
|
|
2262
|
+
item.attributes["rr_open_mode"] = "non-modal";
|
|
2263
|
+
}
|
|
2264
|
+
}
|
|
2265
|
+
}
|
|
2266
|
+
break;
|
|
2267
|
+
}
|
|
2268
|
+
case "childList": {
|
|
2269
|
+
if (isBlocked(m.target, this.blockClass, this.blockSelector, true))
|
|
2270
|
+
return;
|
|
2271
|
+
if (m.target.tagName === "TEXTAREA") {
|
|
2272
|
+
this.genTextAreaValueMutation(m.target);
|
|
2273
|
+
return;
|
|
2274
|
+
}
|
|
2275
|
+
m.addedNodes.forEach((n) => this.genAdds(n, m.target));
|
|
2276
|
+
m.removedNodes.forEach((n) => {
|
|
2277
|
+
const nodeId = this.mirror.getId(n);
|
|
2278
|
+
const parentId = isShadowRoot(m.target) ? this.mirror.getId(index.host(m.target)) : this.mirror.getId(m.target);
|
|
2279
|
+
if (isBlocked(m.target, this.blockClass, this.blockSelector, false) || isIgnored(n, this.mirror, this.slimDOMOptions) || !isSerialized(n, this.mirror)) {
|
|
2280
|
+
return;
|
|
2281
|
+
}
|
|
2282
|
+
if (this.addedSet.has(n)) {
|
|
2283
|
+
deepDelete(this.addedSet, n);
|
|
2284
|
+
this.droppedSet.add(n);
|
|
2285
|
+
} else if (this.addedSet.has(m.target) && nodeId === -1) ;
|
|
2286
|
+
else if (isAncestorRemoved(m.target, this.mirror)) ;
|
|
2287
|
+
else if (this.movedSet.has(n) && this.movedMap[moveKey(nodeId, parentId)]) {
|
|
2288
|
+
deepDelete(this.movedSet, n);
|
|
2289
|
+
} else {
|
|
2290
|
+
this.removes.push({
|
|
2291
|
+
parentId,
|
|
2292
|
+
id: nodeId,
|
|
2293
|
+
isShadow: isShadowRoot(m.target) && isNativeShadowDom(m.target) ? true : void 0
|
|
2294
|
+
});
|
|
2295
|
+
processRemoves(n, this.removesSubTreeCache);
|
|
2296
|
+
}
|
|
2297
|
+
this.mapRemoves.push(n);
|
|
2298
|
+
});
|
|
2299
|
+
break;
|
|
2300
|
+
}
|
|
2301
|
+
}
|
|
2302
|
+
});
|
|
2303
|
+
/**
|
|
2304
|
+
* Make sure you check if `n`'s parent is blocked before calling this function
|
|
2305
|
+
* */
|
|
2306
|
+
__publicField(this, "genAdds", (n, target) => {
|
|
2307
|
+
if (this.processedNodeManager.inOtherBuffer(n, this)) return;
|
|
2308
|
+
if (this.addedSet.has(n) || this.movedSet.has(n)) return;
|
|
2309
|
+
if (this.mirror.hasNode(n)) {
|
|
2310
|
+
if (isIgnored(n, this.mirror, this.slimDOMOptions)) {
|
|
2311
|
+
return;
|
|
2312
|
+
}
|
|
2313
|
+
this.movedSet.add(n);
|
|
2314
|
+
let targetId = null;
|
|
2315
|
+
if (target && this.mirror.hasNode(target)) {
|
|
2316
|
+
targetId = this.mirror.getId(target);
|
|
2317
|
+
}
|
|
2318
|
+
if (targetId && targetId !== -1) {
|
|
2319
|
+
this.movedMap[moveKey(this.mirror.getId(n), targetId)] = true;
|
|
2320
|
+
}
|
|
2321
|
+
} else {
|
|
2322
|
+
this.addedSet.add(n);
|
|
2323
|
+
this.droppedSet.delete(n);
|
|
2324
|
+
}
|
|
2325
|
+
if (!isBlocked(n, this.blockClass, this.blockSelector, false)) {
|
|
2326
|
+
index.childNodes(n).forEach((childN) => this.genAdds(childN));
|
|
2327
|
+
if (hasShadowRoot(n)) {
|
|
2328
|
+
index.childNodes(index.shadowRoot(n)).forEach((childN) => {
|
|
2329
|
+
this.processedNodeManager.add(childN, this);
|
|
2330
|
+
this.genAdds(childN, n);
|
|
2331
|
+
});
|
|
2332
|
+
}
|
|
2333
|
+
}
|
|
2334
|
+
});
|
|
2335
|
+
}
|
|
2336
|
+
init(options) {
|
|
2337
|
+
[
|
|
2338
|
+
"mutationCb",
|
|
2339
|
+
"blockClass",
|
|
2340
|
+
"blockSelector",
|
|
2341
|
+
"maskTextClass",
|
|
2342
|
+
"maskTextSelector",
|
|
2343
|
+
"inlineStylesheet",
|
|
2344
|
+
"maskInputOptions",
|
|
2345
|
+
"maskTextFn",
|
|
2346
|
+
"maskInputFn",
|
|
2347
|
+
"keepIframeSrcFn",
|
|
2348
|
+
"recordCanvas",
|
|
2349
|
+
"inlineImages",
|
|
2350
|
+
"slimDOMOptions",
|
|
2351
|
+
"dataURLOptions",
|
|
2352
|
+
"doc",
|
|
2353
|
+
"mirror",
|
|
2354
|
+
"iframeManager",
|
|
2355
|
+
"stylesheetManager",
|
|
2356
|
+
"shadowDomManager",
|
|
2357
|
+
"canvasManager",
|
|
2358
|
+
"processedNodeManager"
|
|
2359
|
+
].forEach((key) => {
|
|
2360
|
+
this[key] = options[key];
|
|
2361
|
+
});
|
|
2362
|
+
}
|
|
2363
|
+
freeze() {
|
|
2364
|
+
this.frozen = true;
|
|
2365
|
+
this.canvasManager.freeze();
|
|
2366
|
+
}
|
|
2367
|
+
unfreeze() {
|
|
2368
|
+
this.frozen = false;
|
|
2369
|
+
this.canvasManager.unfreeze();
|
|
2370
|
+
this.emit();
|
|
2371
|
+
}
|
|
2372
|
+
isFrozen() {
|
|
2373
|
+
return this.frozen;
|
|
2374
|
+
}
|
|
2375
|
+
lock() {
|
|
2376
|
+
this.locked = true;
|
|
2377
|
+
this.canvasManager.lock();
|
|
2378
|
+
}
|
|
2379
|
+
unlock() {
|
|
2380
|
+
this.locked = false;
|
|
2381
|
+
this.canvasManager.unlock();
|
|
2382
|
+
this.emit();
|
|
2383
|
+
}
|
|
2384
|
+
reset() {
|
|
2385
|
+
this.shadowDomManager.reset();
|
|
2386
|
+
this.canvasManager.reset();
|
|
2387
|
+
}
|
|
2388
|
+
}
|
|
2389
|
+
function deepDelete(addsSet, n) {
|
|
2390
|
+
addsSet.delete(n);
|
|
2391
|
+
index.childNodes(n).forEach((childN) => deepDelete(addsSet, childN));
|
|
2392
|
+
}
|
|
2393
|
+
function processRemoves(n, cache) {
|
|
2394
|
+
const queue = [n];
|
|
2395
|
+
while (queue.length) {
|
|
2396
|
+
const next = queue.pop();
|
|
2397
|
+
if (cache.has(next)) continue;
|
|
2398
|
+
cache.add(next);
|
|
2399
|
+
index.childNodes(next).forEach((n2) => queue.push(n2));
|
|
2400
|
+
}
|
|
2401
|
+
return;
|
|
2402
|
+
}
|
|
2403
|
+
function isSelfOrAncestorInSet(set, n) {
|
|
2404
|
+
if (set.size === 0) return false;
|
|
2405
|
+
return _isSelfOrAncestorInSet(set, n);
|
|
2406
|
+
}
|
|
2407
|
+
function _isSelfOrAncestorInSet(set, n) {
|
|
2408
|
+
if (set.has(n)) {
|
|
2409
|
+
return true;
|
|
2410
|
+
}
|
|
2411
|
+
const parent = index.parentNode(n);
|
|
2412
|
+
if (!parent) {
|
|
2413
|
+
return false;
|
|
2414
|
+
}
|
|
2415
|
+
return _isSelfOrAncestorInSet(set, parent);
|
|
2416
|
+
}
|
|
2417
|
+
let errorHandler;
|
|
2418
|
+
function registerErrorHandler(handler) {
|
|
2419
|
+
errorHandler = handler;
|
|
2420
|
+
}
|
|
2421
|
+
function unregisterErrorHandler() {
|
|
2422
|
+
errorHandler = void 0;
|
|
2423
|
+
}
|
|
2424
|
+
const callbackWrapper = (cb) => {
|
|
2425
|
+
if (!errorHandler) {
|
|
2426
|
+
return cb;
|
|
2427
|
+
}
|
|
2428
|
+
const rrwebWrapped = (...rest) => {
|
|
2429
|
+
try {
|
|
2430
|
+
return cb(...rest);
|
|
2431
|
+
} catch (error) {
|
|
2432
|
+
if (errorHandler && errorHandler(error) === true) {
|
|
2433
|
+
return;
|
|
2434
|
+
}
|
|
2435
|
+
throw error;
|
|
2436
|
+
}
|
|
2437
|
+
};
|
|
2438
|
+
return rrwebWrapped;
|
|
2439
|
+
};
|
|
2440
|
+
const mutationBuffers = [];
|
|
2441
|
+
function getEventTarget(event) {
|
|
2442
|
+
try {
|
|
2443
|
+
if ("composedPath" in event) {
|
|
2444
|
+
const path = event.composedPath();
|
|
2445
|
+
if (path.length) {
|
|
2446
|
+
return path[0];
|
|
2447
|
+
}
|
|
2448
|
+
} else if ("path" in event && event.path.length) {
|
|
2449
|
+
return event.path[0];
|
|
2450
|
+
}
|
|
2451
|
+
} catch {
|
|
2452
|
+
}
|
|
2453
|
+
return event && event.target;
|
|
2454
|
+
}
|
|
2455
|
+
function initMutationObserver(options, rootEl) {
|
|
2456
|
+
const mutationBuffer = new MutationBuffer();
|
|
2457
|
+
mutationBuffers.push(mutationBuffer);
|
|
2458
|
+
mutationBuffer.init(options);
|
|
2459
|
+
const [ObserverCtor, iframeCleanup] = mutationObserverCtor();
|
|
2460
|
+
const observer = new ObserverCtor(
|
|
2461
|
+
callbackWrapper(mutationBuffer.processMutations.bind(mutationBuffer))
|
|
2462
|
+
);
|
|
2463
|
+
observer.observe(rootEl, {
|
|
2464
|
+
attributes: true,
|
|
2465
|
+
attributeOldValue: true,
|
|
2466
|
+
characterData: true,
|
|
2467
|
+
characterDataOldValue: true,
|
|
2468
|
+
childList: true,
|
|
2469
|
+
subtree: true
|
|
2470
|
+
});
|
|
2471
|
+
return [observer, iframeCleanup];
|
|
2472
|
+
}
|
|
2473
|
+
function initMoveObserver({
|
|
2474
|
+
mousemoveCb,
|
|
2475
|
+
sampling,
|
|
2476
|
+
doc,
|
|
2477
|
+
mirror: mirror2
|
|
2478
|
+
}) {
|
|
2479
|
+
if (sampling.mousemove === false) {
|
|
2480
|
+
return () => {
|
|
2481
|
+
};
|
|
2482
|
+
}
|
|
2483
|
+
const threshold = typeof sampling.mousemove === "number" ? sampling.mousemove : 50;
|
|
2484
|
+
const callbackThreshold = typeof sampling.mousemoveCallback === "number" ? sampling.mousemoveCallback : 500;
|
|
2485
|
+
let positions = [];
|
|
2486
|
+
let timeBaseline;
|
|
2487
|
+
const wrappedCb = throttle(
|
|
2488
|
+
callbackWrapper(
|
|
2489
|
+
(source) => {
|
|
2490
|
+
const totalOffset = Date.now() - timeBaseline;
|
|
2491
|
+
mousemoveCb(
|
|
2492
|
+
positions.map((p) => {
|
|
2493
|
+
p.timeOffset -= totalOffset;
|
|
2494
|
+
return p;
|
|
2495
|
+
}),
|
|
2496
|
+
source
|
|
2497
|
+
);
|
|
2498
|
+
positions = [];
|
|
2499
|
+
timeBaseline = null;
|
|
2500
|
+
}
|
|
2501
|
+
),
|
|
2502
|
+
callbackThreshold
|
|
2503
|
+
);
|
|
2504
|
+
const updatePosition = callbackWrapper(
|
|
2505
|
+
throttle(
|
|
2506
|
+
callbackWrapper((evt) => {
|
|
2507
|
+
const target = getEventTarget(evt);
|
|
2508
|
+
const { clientX, clientY } = legacy_isTouchEvent(evt) ? evt.changedTouches[0] : evt;
|
|
2509
|
+
if (!timeBaseline) {
|
|
2510
|
+
timeBaseline = nowTimestamp();
|
|
2511
|
+
}
|
|
2512
|
+
positions.push({
|
|
2513
|
+
x: clientX,
|
|
2514
|
+
y: clientY,
|
|
2515
|
+
id: mirror2.getId(target),
|
|
2516
|
+
timeOffset: nowTimestamp() - timeBaseline
|
|
2517
|
+
});
|
|
2518
|
+
wrappedCb(
|
|
2519
|
+
typeof DragEvent !== "undefined" && evt instanceof DragEvent ? IncrementalSource.Drag : evt instanceof MouseEvent ? IncrementalSource.MouseMove : IncrementalSource.TouchMove
|
|
2520
|
+
);
|
|
2521
|
+
}),
|
|
2522
|
+
threshold,
|
|
2523
|
+
{
|
|
2524
|
+
trailing: false
|
|
2525
|
+
}
|
|
2526
|
+
)
|
|
2527
|
+
);
|
|
2528
|
+
const handlers = [
|
|
2529
|
+
on("mousemove", updatePosition, doc),
|
|
2530
|
+
on("touchmove", updatePosition, doc),
|
|
2531
|
+
on("drag", updatePosition, doc)
|
|
2532
|
+
];
|
|
2533
|
+
return callbackWrapper(() => {
|
|
2534
|
+
handlers.forEach((h) => h());
|
|
2535
|
+
});
|
|
2536
|
+
}
|
|
2537
|
+
function initMouseInteractionObserver({
|
|
2538
|
+
mouseInteractionCb,
|
|
2539
|
+
doc,
|
|
2540
|
+
win,
|
|
2541
|
+
mirror: mirror2,
|
|
2542
|
+
blockClass,
|
|
2543
|
+
blockSelector,
|
|
2544
|
+
sampling
|
|
2545
|
+
}) {
|
|
2546
|
+
if (sampling.mouseInteraction === false) {
|
|
2547
|
+
return () => {
|
|
2548
|
+
};
|
|
2549
|
+
}
|
|
2550
|
+
const disableMap = sampling.mouseInteraction === true || sampling.mouseInteraction === void 0 ? {} : sampling.mouseInteraction;
|
|
2551
|
+
const handlers = [];
|
|
2552
|
+
let currentPointerType = null;
|
|
2553
|
+
const getHandler = (eventKey) => {
|
|
2554
|
+
return (event) => {
|
|
2555
|
+
const target = getEventTarget(event);
|
|
2556
|
+
if (isBlocked(target, blockClass, blockSelector, true)) {
|
|
2557
|
+
return;
|
|
2558
|
+
}
|
|
2559
|
+
let pointerType = null;
|
|
2560
|
+
let thisEventKey = eventKey;
|
|
2561
|
+
if ("pointerType" in event) {
|
|
2562
|
+
switch (event.pointerType) {
|
|
2563
|
+
case "mouse":
|
|
2564
|
+
pointerType = PointerTypes.Mouse;
|
|
2565
|
+
break;
|
|
2566
|
+
case "touch":
|
|
2567
|
+
pointerType = PointerTypes.Touch;
|
|
2568
|
+
break;
|
|
2569
|
+
case "pen":
|
|
2570
|
+
pointerType = PointerTypes.Pen;
|
|
2571
|
+
break;
|
|
2572
|
+
}
|
|
2573
|
+
if (pointerType === PointerTypes.Touch) {
|
|
2574
|
+
if (MouseInteractions[eventKey] === MouseInteractions.MouseDown) {
|
|
2575
|
+
thisEventKey = "TouchStart";
|
|
2576
|
+
} else if (MouseInteractions[eventKey] === MouseInteractions.MouseUp) {
|
|
2577
|
+
thisEventKey = "TouchEnd";
|
|
2578
|
+
}
|
|
2579
|
+
} else if (pointerType === PointerTypes.Pen) ;
|
|
2580
|
+
} else if (legacy_isTouchEvent(event)) {
|
|
2581
|
+
pointerType = PointerTypes.Touch;
|
|
2582
|
+
}
|
|
2583
|
+
if (pointerType !== null) {
|
|
2584
|
+
currentPointerType = pointerType;
|
|
2585
|
+
if (thisEventKey.startsWith("Touch") && pointerType === PointerTypes.Touch || thisEventKey.startsWith("Mouse") && pointerType === PointerTypes.Mouse) {
|
|
2586
|
+
pointerType = null;
|
|
2587
|
+
}
|
|
2588
|
+
} else if (MouseInteractions[eventKey] === MouseInteractions.Click) {
|
|
2589
|
+
pointerType = currentPointerType;
|
|
2590
|
+
currentPointerType = null;
|
|
2591
|
+
}
|
|
2592
|
+
const e = legacy_isTouchEvent(event) ? event.changedTouches[0] : event;
|
|
2593
|
+
if (!e) {
|
|
2594
|
+
return;
|
|
2595
|
+
}
|
|
2596
|
+
const id = mirror2.getId(target);
|
|
2597
|
+
const { clientX, clientY } = e;
|
|
2598
|
+
callbackWrapper(mouseInteractionCb)({
|
|
2599
|
+
type: MouseInteractions[thisEventKey],
|
|
2600
|
+
id,
|
|
2601
|
+
x: clientX,
|
|
2602
|
+
y: clientY,
|
|
2603
|
+
...pointerType !== null && { pointerType }
|
|
2604
|
+
});
|
|
2605
|
+
};
|
|
2606
|
+
};
|
|
2607
|
+
Object.keys(MouseInteractions).filter(
|
|
2608
|
+
(key) => Number.isNaN(Number(key)) && !key.endsWith("_Departed") && disableMap[key] !== false
|
|
2609
|
+
).forEach((eventKey) => {
|
|
2610
|
+
let eventName = toLowerCase(eventKey);
|
|
2611
|
+
const handler = getHandler(eventKey);
|
|
2612
|
+
if (win.PointerEvent) {
|
|
2613
|
+
switch (MouseInteractions[eventKey]) {
|
|
2614
|
+
case MouseInteractions.MouseDown:
|
|
2615
|
+
case MouseInteractions.MouseUp:
|
|
2616
|
+
eventName = eventName.replace(
|
|
2617
|
+
"mouse",
|
|
2618
|
+
"pointer"
|
|
2619
|
+
);
|
|
2620
|
+
break;
|
|
2621
|
+
case MouseInteractions.TouchStart:
|
|
2622
|
+
case MouseInteractions.TouchEnd:
|
|
2623
|
+
return;
|
|
2624
|
+
}
|
|
2625
|
+
}
|
|
2626
|
+
handlers.push(on(eventName, handler, doc));
|
|
2627
|
+
});
|
|
2628
|
+
return callbackWrapper(() => {
|
|
2629
|
+
handlers.forEach((h) => h());
|
|
2630
|
+
});
|
|
2631
|
+
}
|
|
2632
|
+
function initScrollObserver({
|
|
2633
|
+
scrollCb,
|
|
2634
|
+
doc,
|
|
2635
|
+
mirror: mirror2,
|
|
2636
|
+
blockClass,
|
|
2637
|
+
blockSelector,
|
|
2638
|
+
sampling
|
|
2639
|
+
}) {
|
|
2640
|
+
const updatePosition = callbackWrapper(
|
|
2641
|
+
throttle(
|
|
2642
|
+
callbackWrapper((evt) => {
|
|
2643
|
+
const target = getEventTarget(evt);
|
|
2644
|
+
if (!target || isBlocked(target, blockClass, blockSelector, true)) {
|
|
2645
|
+
return;
|
|
2646
|
+
}
|
|
2647
|
+
const id = mirror2.getId(target);
|
|
2648
|
+
if (target === doc && doc.defaultView) {
|
|
2649
|
+
const scrollLeftTop = getWindowScroll(doc.defaultView);
|
|
2650
|
+
scrollCb({
|
|
2651
|
+
id,
|
|
2652
|
+
x: scrollLeftTop.left,
|
|
2653
|
+
y: scrollLeftTop.top
|
|
2654
|
+
});
|
|
2655
|
+
} else {
|
|
2656
|
+
scrollCb({
|
|
2657
|
+
id,
|
|
2658
|
+
x: target.scrollLeft,
|
|
2659
|
+
y: target.scrollTop
|
|
2660
|
+
});
|
|
2661
|
+
}
|
|
2662
|
+
}),
|
|
2663
|
+
sampling.scroll || 100
|
|
2664
|
+
)
|
|
2665
|
+
);
|
|
2666
|
+
return on("scroll", updatePosition, doc);
|
|
2667
|
+
}
|
|
2668
|
+
function initViewportResizeObserver({ viewportResizeCb, win: _win }, { win }) {
|
|
2669
|
+
let lastH = -1;
|
|
2670
|
+
let lastW = -1;
|
|
2671
|
+
const updateDimension = callbackWrapper(
|
|
2672
|
+
throttle(
|
|
2673
|
+
callbackWrapper(() => {
|
|
2674
|
+
const height = getWindowHeight(_win);
|
|
2675
|
+
const width = getWindowWidth(_win);
|
|
2676
|
+
if (lastH !== height || lastW !== width) {
|
|
2677
|
+
viewportResizeCb({
|
|
2678
|
+
width: Number(width),
|
|
2679
|
+
height: Number(height)
|
|
2680
|
+
});
|
|
2681
|
+
lastH = height;
|
|
2682
|
+
lastW = width;
|
|
2683
|
+
}
|
|
2684
|
+
}),
|
|
2685
|
+
200
|
|
2686
|
+
)
|
|
2687
|
+
);
|
|
2688
|
+
return on("resize", updateDimension, win);
|
|
2689
|
+
}
|
|
2690
|
+
const INPUT_TAGS = ["INPUT", "TEXTAREA", "SELECT"];
|
|
2691
|
+
const lastInputValueMap = /* @__PURE__ */ new WeakMap();
|
|
2692
|
+
function initInputObserver({
|
|
2693
|
+
inputCb,
|
|
2694
|
+
doc,
|
|
2695
|
+
mirror: mirror2,
|
|
2696
|
+
blockClass,
|
|
2697
|
+
blockSelector,
|
|
2698
|
+
ignoreClass,
|
|
2699
|
+
ignoreSelector,
|
|
2700
|
+
maskInputOptions,
|
|
2701
|
+
maskInputFn,
|
|
2702
|
+
sampling,
|
|
2703
|
+
userTriggeredOnInput
|
|
2704
|
+
}) {
|
|
2705
|
+
function eventHandler(event) {
|
|
2706
|
+
let target = getEventTarget(event);
|
|
2707
|
+
const userTriggered = event.isTrusted;
|
|
2708
|
+
const tagName = target && target.tagName;
|
|
2709
|
+
if (target && tagName === "OPTION") {
|
|
2710
|
+
target = index.parentElement(target);
|
|
2711
|
+
}
|
|
2712
|
+
if (!target || !tagName || INPUT_TAGS.indexOf(tagName) < 0 || isBlocked(target, blockClass, blockSelector, true)) {
|
|
2713
|
+
return;
|
|
2714
|
+
}
|
|
2715
|
+
if (target.classList.contains(ignoreClass) || ignoreSelector && target.matches(ignoreSelector)) {
|
|
2716
|
+
return;
|
|
2717
|
+
}
|
|
2718
|
+
let text = target.value;
|
|
2719
|
+
let isChecked = false;
|
|
2720
|
+
const type = getInputType(target) || "";
|
|
2721
|
+
if (type === "radio" || type === "checkbox") {
|
|
2722
|
+
isChecked = target.checked;
|
|
2723
|
+
} else if (maskInputOptions[tagName.toLowerCase()] || maskInputOptions[type]) {
|
|
2724
|
+
text = maskInputValue({
|
|
2725
|
+
element: target,
|
|
2726
|
+
maskInputOptions,
|
|
2727
|
+
tagName,
|
|
2728
|
+
type,
|
|
2729
|
+
value: text,
|
|
2730
|
+
maskInputFn
|
|
2731
|
+
});
|
|
2732
|
+
}
|
|
2733
|
+
cbWithDedup(
|
|
2734
|
+
target,
|
|
2735
|
+
userTriggeredOnInput ? { text, isChecked, userTriggered } : { text, isChecked }
|
|
2736
|
+
);
|
|
2737
|
+
const name = target.name;
|
|
2738
|
+
if (type === "radio" && name && isChecked) {
|
|
2739
|
+
doc.querySelectorAll(`input[type="radio"][name="${name}"]`).forEach((el) => {
|
|
2740
|
+
if (el !== target) {
|
|
2741
|
+
const text2 = el.value;
|
|
2742
|
+
cbWithDedup(
|
|
2743
|
+
el,
|
|
2744
|
+
userTriggeredOnInput ? { text: text2, isChecked: !isChecked, userTriggered: false } : { text: text2, isChecked: !isChecked }
|
|
2745
|
+
);
|
|
2746
|
+
}
|
|
2747
|
+
});
|
|
2748
|
+
}
|
|
2749
|
+
}
|
|
2750
|
+
function cbWithDedup(target, v) {
|
|
2751
|
+
const lastInputValue = lastInputValueMap.get(target);
|
|
2752
|
+
if (!lastInputValue || lastInputValue.text !== v.text || lastInputValue.isChecked !== v.isChecked) {
|
|
2753
|
+
lastInputValueMap.set(target, v);
|
|
2754
|
+
const id = mirror2.getId(target);
|
|
2755
|
+
callbackWrapper(inputCb)({
|
|
2756
|
+
...v,
|
|
2757
|
+
id
|
|
2758
|
+
});
|
|
2759
|
+
}
|
|
2760
|
+
}
|
|
2761
|
+
const events = sampling.input === "last" ? ["change"] : ["input", "change"];
|
|
2762
|
+
const handlers = events.map(
|
|
2763
|
+
(eventName) => on(eventName, callbackWrapper(eventHandler), doc)
|
|
2764
|
+
);
|
|
2765
|
+
const currentWindow = doc.defaultView;
|
|
2766
|
+
if (!currentWindow) {
|
|
2767
|
+
return () => {
|
|
2768
|
+
handlers.forEach((h) => h());
|
|
2769
|
+
};
|
|
2770
|
+
}
|
|
2771
|
+
const propertyDescriptor = currentWindow.Object.getOwnPropertyDescriptor(
|
|
2772
|
+
currentWindow.HTMLInputElement.prototype,
|
|
2773
|
+
"value"
|
|
2774
|
+
);
|
|
2775
|
+
const hookProperties = [
|
|
2776
|
+
[currentWindow.HTMLInputElement.prototype, "value"],
|
|
2777
|
+
[currentWindow.HTMLInputElement.prototype, "checked"],
|
|
2778
|
+
[currentWindow.HTMLSelectElement.prototype, "value"],
|
|
2779
|
+
[currentWindow.HTMLTextAreaElement.prototype, "value"],
|
|
2780
|
+
// Some UI library use selectedIndex to set select value
|
|
2781
|
+
[currentWindow.HTMLSelectElement.prototype, "selectedIndex"],
|
|
2782
|
+
[currentWindow.HTMLOptionElement.prototype, "selected"]
|
|
2783
|
+
];
|
|
2784
|
+
if (propertyDescriptor && propertyDescriptor.set) {
|
|
2785
|
+
handlers.push(
|
|
2786
|
+
...hookProperties.map(
|
|
2787
|
+
(p) => hookSetter(
|
|
2788
|
+
p[0],
|
|
2789
|
+
p[1],
|
|
2790
|
+
{
|
|
2791
|
+
set() {
|
|
2792
|
+
callbackWrapper(eventHandler)({
|
|
2793
|
+
target: this,
|
|
2794
|
+
isTrusted: false
|
|
2795
|
+
// userTriggered to false as this could well be programmatic
|
|
2796
|
+
});
|
|
2797
|
+
}
|
|
2798
|
+
},
|
|
2799
|
+
false,
|
|
2800
|
+
currentWindow
|
|
2801
|
+
)
|
|
2802
|
+
)
|
|
2803
|
+
);
|
|
2804
|
+
}
|
|
2805
|
+
return callbackWrapper(() => {
|
|
2806
|
+
handlers.forEach((h) => h());
|
|
2807
|
+
});
|
|
2808
|
+
}
|
|
2809
|
+
function getNestedCSSRulePositions(win, rule) {
|
|
2810
|
+
const positions = [];
|
|
2811
|
+
function recurse(childRule, pos) {
|
|
2812
|
+
if (hasNestedCSSRule(win, "CSSGroupingRule") && childRule.parentRule instanceof win.CSSGroupingRule || hasNestedCSSRule(win, "CSSMediaRule") && childRule.parentRule instanceof win.CSSMediaRule || hasNestedCSSRule(win, "CSSSupportsRule") && childRule.parentRule instanceof win.CSSSupportsRule || hasNestedCSSRule(win, "CSSConditionRule") && childRule.parentRule instanceof win.CSSConditionRule) {
|
|
2813
|
+
const rules = Array.from(
|
|
2814
|
+
childRule.parentRule.cssRules
|
|
2815
|
+
);
|
|
2816
|
+
const index2 = rules.indexOf(childRule);
|
|
2817
|
+
pos.unshift(index2);
|
|
2818
|
+
return recurse(childRule.parentRule, pos);
|
|
2819
|
+
} else if (childRule.parentStyleSheet) {
|
|
2820
|
+
const rules = Array.from(childRule.parentStyleSheet.cssRules);
|
|
2821
|
+
const index2 = rules.indexOf(childRule);
|
|
2822
|
+
pos.unshift(index2);
|
|
2823
|
+
}
|
|
2824
|
+
return pos;
|
|
2825
|
+
}
|
|
2826
|
+
return recurse(rule, positions);
|
|
2827
|
+
}
|
|
2828
|
+
function getIdAndStyleId(sheet, mirror2, styleMirror) {
|
|
2829
|
+
let id, styleId;
|
|
2830
|
+
if (!sheet) return {};
|
|
2831
|
+
if (sheet.ownerNode) id = mirror2.getId(sheet.ownerNode);
|
|
2832
|
+
else styleId = styleMirror.getId(sheet);
|
|
2833
|
+
return {
|
|
2834
|
+
styleId,
|
|
2835
|
+
id
|
|
2836
|
+
};
|
|
2837
|
+
}
|
|
2838
|
+
function initStyleSheetObserver({ styleSheetRuleCb, mirror: mirror2, stylesheetManager }, { win }) {
|
|
2839
|
+
if (!win.CSSStyleSheet || !win.CSSStyleSheet.prototype) {
|
|
2840
|
+
return () => {
|
|
2841
|
+
};
|
|
2842
|
+
}
|
|
2843
|
+
const insertRule = win.CSSStyleSheet.prototype.insertRule;
|
|
2844
|
+
win.CSSStyleSheet.prototype.insertRule = new Proxy(insertRule, {
|
|
2845
|
+
apply: callbackWrapper(
|
|
2846
|
+
(target, thisArg, argumentsList) => {
|
|
2847
|
+
const [rule, index2] = argumentsList;
|
|
2848
|
+
const { id, styleId } = getIdAndStyleId(
|
|
2849
|
+
thisArg,
|
|
2850
|
+
mirror2,
|
|
2851
|
+
stylesheetManager.styleMirror
|
|
2852
|
+
);
|
|
2853
|
+
if (id && id !== -1 || styleId && styleId !== -1) {
|
|
2854
|
+
styleSheetRuleCb({
|
|
2855
|
+
id,
|
|
2856
|
+
styleId,
|
|
2857
|
+
adds: [{ rule, index: index2 }]
|
|
2858
|
+
});
|
|
2859
|
+
}
|
|
2860
|
+
return target.apply(thisArg, argumentsList);
|
|
2861
|
+
}
|
|
2862
|
+
)
|
|
2863
|
+
});
|
|
2864
|
+
win.CSSStyleSheet.prototype.addRule = function(selector, styleBlock, index2 = this.cssRules.length) {
|
|
2865
|
+
const rule = `${selector} { ${styleBlock} }`;
|
|
2866
|
+
return win.CSSStyleSheet.prototype.insertRule.apply(this, [rule, index2]);
|
|
2867
|
+
};
|
|
2868
|
+
const deleteRule = win.CSSStyleSheet.prototype.deleteRule;
|
|
2869
|
+
win.CSSStyleSheet.prototype.deleteRule = new Proxy(deleteRule, {
|
|
2870
|
+
apply: callbackWrapper(
|
|
2871
|
+
(target, thisArg, argumentsList) => {
|
|
2872
|
+
const [index2] = argumentsList;
|
|
2873
|
+
const { id, styleId } = getIdAndStyleId(
|
|
2874
|
+
thisArg,
|
|
2875
|
+
mirror2,
|
|
2876
|
+
stylesheetManager.styleMirror
|
|
2877
|
+
);
|
|
2878
|
+
if (id && id !== -1 || styleId && styleId !== -1) {
|
|
2879
|
+
styleSheetRuleCb({
|
|
2880
|
+
id,
|
|
2881
|
+
styleId,
|
|
2882
|
+
removes: [{ index: index2 }]
|
|
2883
|
+
});
|
|
2884
|
+
}
|
|
2885
|
+
return target.apply(thisArg, argumentsList);
|
|
2886
|
+
}
|
|
2887
|
+
)
|
|
2888
|
+
});
|
|
2889
|
+
win.CSSStyleSheet.prototype.removeRule = function(index2) {
|
|
2890
|
+
return win.CSSStyleSheet.prototype.deleteRule.apply(this, [index2]);
|
|
2891
|
+
};
|
|
2892
|
+
let replace;
|
|
2893
|
+
if (win.CSSStyleSheet.prototype.replace) {
|
|
2894
|
+
replace = win.CSSStyleSheet.prototype.replace;
|
|
2895
|
+
win.CSSStyleSheet.prototype.replace = new Proxy(replace, {
|
|
2896
|
+
apply: callbackWrapper(
|
|
2897
|
+
(target, thisArg, argumentsList) => {
|
|
2898
|
+
const [text] = argumentsList;
|
|
2899
|
+
const { id, styleId } = getIdAndStyleId(
|
|
2900
|
+
thisArg,
|
|
2901
|
+
mirror2,
|
|
2902
|
+
stylesheetManager.styleMirror
|
|
2903
|
+
);
|
|
2904
|
+
if (id && id !== -1 || styleId && styleId !== -1) {
|
|
2905
|
+
styleSheetRuleCb({
|
|
2906
|
+
id,
|
|
2907
|
+
styleId,
|
|
2908
|
+
replace: text
|
|
2909
|
+
});
|
|
2910
|
+
}
|
|
2911
|
+
return target.apply(thisArg, argumentsList);
|
|
2912
|
+
}
|
|
2913
|
+
)
|
|
2914
|
+
});
|
|
2915
|
+
}
|
|
2916
|
+
let replaceSync;
|
|
2917
|
+
if (win.CSSStyleSheet.prototype.replaceSync) {
|
|
2918
|
+
replaceSync = win.CSSStyleSheet.prototype.replaceSync;
|
|
2919
|
+
win.CSSStyleSheet.prototype.replaceSync = new Proxy(replaceSync, {
|
|
2920
|
+
apply: callbackWrapper(
|
|
2921
|
+
(target, thisArg, argumentsList) => {
|
|
2922
|
+
const [text] = argumentsList;
|
|
2923
|
+
const { id, styleId } = getIdAndStyleId(
|
|
2924
|
+
thisArg,
|
|
2925
|
+
mirror2,
|
|
2926
|
+
stylesheetManager.styleMirror
|
|
2927
|
+
);
|
|
2928
|
+
if (id && id !== -1 || styleId && styleId !== -1) {
|
|
2929
|
+
styleSheetRuleCb({
|
|
2930
|
+
id,
|
|
2931
|
+
styleId,
|
|
2932
|
+
replaceSync: text
|
|
2933
|
+
});
|
|
2934
|
+
}
|
|
2935
|
+
return target.apply(thisArg, argumentsList);
|
|
2936
|
+
}
|
|
2937
|
+
)
|
|
2938
|
+
});
|
|
2939
|
+
}
|
|
2940
|
+
const supportedNestedCSSRuleTypes = {};
|
|
2941
|
+
if (canMonkeyPatchNestedCSSRule(win, "CSSGroupingRule")) {
|
|
2942
|
+
supportedNestedCSSRuleTypes.CSSGroupingRule = win.CSSGroupingRule;
|
|
2943
|
+
} else {
|
|
2944
|
+
if (canMonkeyPatchNestedCSSRule(win, "CSSMediaRule")) {
|
|
2945
|
+
supportedNestedCSSRuleTypes.CSSMediaRule = win.CSSMediaRule;
|
|
2946
|
+
}
|
|
2947
|
+
if (canMonkeyPatchNestedCSSRule(win, "CSSConditionRule")) {
|
|
2948
|
+
supportedNestedCSSRuleTypes.CSSConditionRule = win.CSSConditionRule;
|
|
2949
|
+
}
|
|
2950
|
+
if (canMonkeyPatchNestedCSSRule(win, "CSSSupportsRule")) {
|
|
2951
|
+
supportedNestedCSSRuleTypes.CSSSupportsRule = win.CSSSupportsRule;
|
|
2952
|
+
}
|
|
2953
|
+
}
|
|
2954
|
+
const unmodifiedFunctions = {};
|
|
2955
|
+
Object.entries(supportedNestedCSSRuleTypes).forEach(([typeKey, type]) => {
|
|
2956
|
+
unmodifiedFunctions[typeKey] = {
|
|
2957
|
+
// eslint-disable-next-line @typescript-eslint/unbound-method
|
|
2958
|
+
insertRule: type.prototype.insertRule,
|
|
2959
|
+
// eslint-disable-next-line @typescript-eslint/unbound-method
|
|
2960
|
+
deleteRule: type.prototype.deleteRule
|
|
2961
|
+
};
|
|
2962
|
+
type.prototype.insertRule = new Proxy(
|
|
2963
|
+
unmodifiedFunctions[typeKey].insertRule,
|
|
2964
|
+
{
|
|
2965
|
+
apply: callbackWrapper(
|
|
2966
|
+
(target, thisArg, argumentsList) => {
|
|
2967
|
+
const [rule, index2] = argumentsList;
|
|
2968
|
+
const { id, styleId } = getIdAndStyleId(
|
|
2969
|
+
thisArg.parentStyleSheet,
|
|
2970
|
+
mirror2,
|
|
2971
|
+
stylesheetManager.styleMirror
|
|
2972
|
+
);
|
|
2973
|
+
if (id && id !== -1 || styleId && styleId !== -1) {
|
|
2974
|
+
styleSheetRuleCb({
|
|
2975
|
+
id,
|
|
2976
|
+
styleId,
|
|
2977
|
+
adds: [
|
|
2978
|
+
{
|
|
2979
|
+
rule,
|
|
2980
|
+
index: [
|
|
2981
|
+
...getNestedCSSRulePositions(win, thisArg),
|
|
2982
|
+
index2 || 0
|
|
2983
|
+
// defaults to 0
|
|
2984
|
+
]
|
|
2985
|
+
}
|
|
2986
|
+
]
|
|
2987
|
+
});
|
|
2988
|
+
}
|
|
2989
|
+
return target.apply(thisArg, argumentsList);
|
|
2990
|
+
}
|
|
2991
|
+
)
|
|
2992
|
+
}
|
|
2993
|
+
);
|
|
2994
|
+
type.prototype.deleteRule = new Proxy(
|
|
2995
|
+
unmodifiedFunctions[typeKey].deleteRule,
|
|
2996
|
+
{
|
|
2997
|
+
apply: callbackWrapper(
|
|
2998
|
+
(target, thisArg, argumentsList) => {
|
|
2999
|
+
const [index2] = argumentsList;
|
|
3000
|
+
const { id, styleId } = getIdAndStyleId(
|
|
3001
|
+
thisArg.parentStyleSheet,
|
|
3002
|
+
mirror2,
|
|
3003
|
+
stylesheetManager.styleMirror
|
|
3004
|
+
);
|
|
3005
|
+
if (id && id !== -1 || styleId && styleId !== -1) {
|
|
3006
|
+
styleSheetRuleCb({
|
|
3007
|
+
id,
|
|
3008
|
+
styleId,
|
|
3009
|
+
removes: [
|
|
3010
|
+
{
|
|
3011
|
+
index: [...getNestedCSSRulePositions(win, thisArg), index2]
|
|
3012
|
+
}
|
|
3013
|
+
]
|
|
3014
|
+
});
|
|
3015
|
+
}
|
|
3016
|
+
return target.apply(thisArg, argumentsList);
|
|
3017
|
+
}
|
|
3018
|
+
)
|
|
3019
|
+
}
|
|
3020
|
+
);
|
|
3021
|
+
});
|
|
3022
|
+
return callbackWrapper(() => {
|
|
3023
|
+
win.CSSStyleSheet.prototype.insertRule = insertRule;
|
|
3024
|
+
win.CSSStyleSheet.prototype.deleteRule = deleteRule;
|
|
3025
|
+
replace && (win.CSSStyleSheet.prototype.replace = replace);
|
|
3026
|
+
replaceSync && (win.CSSStyleSheet.prototype.replaceSync = replaceSync);
|
|
3027
|
+
Object.entries(supportedNestedCSSRuleTypes).forEach(([typeKey, type]) => {
|
|
3028
|
+
type.prototype.insertRule = unmodifiedFunctions[typeKey].insertRule;
|
|
3029
|
+
type.prototype.deleteRule = unmodifiedFunctions[typeKey].deleteRule;
|
|
3030
|
+
});
|
|
3031
|
+
});
|
|
3032
|
+
}
|
|
3033
|
+
function initAdoptedStyleSheetObserver({
|
|
3034
|
+
mirror: mirror2,
|
|
3035
|
+
stylesheetManager
|
|
3036
|
+
}, host2) {
|
|
3037
|
+
var _a2, _b, _c;
|
|
3038
|
+
let hostId = null;
|
|
3039
|
+
if (host2.nodeName === "#document") hostId = mirror2.getId(host2);
|
|
3040
|
+
else hostId = mirror2.getId(index.host(host2));
|
|
3041
|
+
const patchTarget = host2.nodeName === "#document" ? (_a2 = host2.defaultView) == null ? void 0 : _a2.Document : (_c = (_b = host2.ownerDocument) == null ? void 0 : _b.defaultView) == null ? void 0 : _c.ShadowRoot;
|
|
3042
|
+
const originalPropertyDescriptor = (patchTarget == null ? void 0 : patchTarget.prototype) ? Object.getOwnPropertyDescriptor(
|
|
3043
|
+
patchTarget == null ? void 0 : patchTarget.prototype,
|
|
3044
|
+
"adoptedStyleSheets"
|
|
3045
|
+
) : void 0;
|
|
3046
|
+
if (hostId === null || hostId === -1 || !patchTarget || !originalPropertyDescriptor)
|
|
3047
|
+
return () => {
|
|
3048
|
+
};
|
|
3049
|
+
Object.defineProperty(host2, "adoptedStyleSheets", {
|
|
3050
|
+
configurable: originalPropertyDescriptor.configurable,
|
|
3051
|
+
enumerable: originalPropertyDescriptor.enumerable,
|
|
3052
|
+
get() {
|
|
3053
|
+
var _a3;
|
|
3054
|
+
return (_a3 = originalPropertyDescriptor.get) == null ? void 0 : _a3.call(this);
|
|
3055
|
+
},
|
|
3056
|
+
set(sheets) {
|
|
3057
|
+
var _a3;
|
|
3058
|
+
const result = (_a3 = originalPropertyDescriptor.set) == null ? void 0 : _a3.call(this, sheets);
|
|
3059
|
+
if (hostId !== null && hostId !== -1) {
|
|
3060
|
+
try {
|
|
3061
|
+
stylesheetManager.adoptStyleSheets(sheets, hostId);
|
|
3062
|
+
} catch (e) {
|
|
3063
|
+
}
|
|
3064
|
+
}
|
|
3065
|
+
return result;
|
|
3066
|
+
}
|
|
3067
|
+
});
|
|
3068
|
+
return callbackWrapper(() => {
|
|
3069
|
+
Object.defineProperty(host2, "adoptedStyleSheets", {
|
|
3070
|
+
configurable: originalPropertyDescriptor.configurable,
|
|
3071
|
+
enumerable: originalPropertyDescriptor.enumerable,
|
|
3072
|
+
// eslint-disable-next-line @typescript-eslint/unbound-method
|
|
3073
|
+
get: originalPropertyDescriptor.get,
|
|
3074
|
+
// eslint-disable-next-line @typescript-eslint/unbound-method
|
|
3075
|
+
set: originalPropertyDescriptor.set
|
|
3076
|
+
});
|
|
3077
|
+
});
|
|
3078
|
+
}
|
|
3079
|
+
function initStyleDeclarationObserver({
|
|
3080
|
+
styleDeclarationCb,
|
|
3081
|
+
mirror: mirror2,
|
|
3082
|
+
ignoreCSSAttributes,
|
|
3083
|
+
stylesheetManager
|
|
3084
|
+
}, { win }) {
|
|
3085
|
+
const setProperty = win.CSSStyleDeclaration.prototype.setProperty;
|
|
3086
|
+
win.CSSStyleDeclaration.prototype.setProperty = new Proxy(setProperty, {
|
|
3087
|
+
apply: callbackWrapper(
|
|
3088
|
+
(target, thisArg, argumentsList) => {
|
|
3089
|
+
var _a2;
|
|
3090
|
+
const [property, value, priority] = argumentsList;
|
|
3091
|
+
if (ignoreCSSAttributes.has(property)) {
|
|
3092
|
+
return setProperty.apply(thisArg, [property, value, priority]);
|
|
3093
|
+
}
|
|
3094
|
+
const { id, styleId } = getIdAndStyleId(
|
|
3095
|
+
(_a2 = thisArg.parentRule) == null ? void 0 : _a2.parentStyleSheet,
|
|
3096
|
+
mirror2,
|
|
3097
|
+
stylesheetManager.styleMirror
|
|
3098
|
+
);
|
|
3099
|
+
if (id && id !== -1 || styleId && styleId !== -1) {
|
|
3100
|
+
styleDeclarationCb({
|
|
3101
|
+
id,
|
|
3102
|
+
styleId,
|
|
3103
|
+
set: {
|
|
3104
|
+
property,
|
|
3105
|
+
value,
|
|
3106
|
+
priority
|
|
3107
|
+
},
|
|
3108
|
+
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
|
|
3109
|
+
index: getNestedCSSRulePositions(win, thisArg.parentRule)
|
|
3110
|
+
});
|
|
3111
|
+
}
|
|
3112
|
+
return target.apply(thisArg, argumentsList);
|
|
3113
|
+
}
|
|
3114
|
+
)
|
|
3115
|
+
});
|
|
3116
|
+
const removeProperty = win.CSSStyleDeclaration.prototype.removeProperty;
|
|
3117
|
+
win.CSSStyleDeclaration.prototype.removeProperty = new Proxy(removeProperty, {
|
|
3118
|
+
apply: callbackWrapper(
|
|
3119
|
+
(target, thisArg, argumentsList) => {
|
|
3120
|
+
var _a2;
|
|
3121
|
+
const [property] = argumentsList;
|
|
3122
|
+
if (ignoreCSSAttributes.has(property)) {
|
|
3123
|
+
return removeProperty.apply(thisArg, [property]);
|
|
3124
|
+
}
|
|
3125
|
+
const { id, styleId } = getIdAndStyleId(
|
|
3126
|
+
(_a2 = thisArg.parentRule) == null ? void 0 : _a2.parentStyleSheet,
|
|
3127
|
+
mirror2,
|
|
3128
|
+
stylesheetManager.styleMirror
|
|
3129
|
+
);
|
|
3130
|
+
if (id && id !== -1 || styleId && styleId !== -1) {
|
|
3131
|
+
styleDeclarationCb({
|
|
3132
|
+
id,
|
|
3133
|
+
styleId,
|
|
3134
|
+
remove: {
|
|
3135
|
+
property
|
|
3136
|
+
},
|
|
3137
|
+
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
|
|
3138
|
+
index: getNestedCSSRulePositions(win, thisArg.parentRule)
|
|
3139
|
+
});
|
|
3140
|
+
}
|
|
3141
|
+
return target.apply(thisArg, argumentsList);
|
|
3142
|
+
}
|
|
3143
|
+
)
|
|
3144
|
+
});
|
|
3145
|
+
return callbackWrapper(() => {
|
|
3146
|
+
win.CSSStyleDeclaration.prototype.setProperty = setProperty;
|
|
3147
|
+
win.CSSStyleDeclaration.prototype.removeProperty = removeProperty;
|
|
3148
|
+
});
|
|
3149
|
+
}
|
|
3150
|
+
function initMediaInteractionObserver({
|
|
3151
|
+
mediaInteractionCb,
|
|
3152
|
+
blockClass,
|
|
3153
|
+
blockSelector,
|
|
3154
|
+
mirror: mirror2,
|
|
3155
|
+
sampling,
|
|
3156
|
+
doc
|
|
3157
|
+
}) {
|
|
3158
|
+
const handler = callbackWrapper(
|
|
3159
|
+
(type) => throttle(
|
|
3160
|
+
callbackWrapper((event) => {
|
|
3161
|
+
const target = getEventTarget(event);
|
|
3162
|
+
if (!target || isBlocked(target, blockClass, blockSelector, true)) {
|
|
3163
|
+
return;
|
|
3164
|
+
}
|
|
3165
|
+
const { currentTime, volume, muted, playbackRate, loop } = target;
|
|
3166
|
+
mediaInteractionCb({
|
|
3167
|
+
type,
|
|
3168
|
+
id: mirror2.getId(target),
|
|
3169
|
+
currentTime,
|
|
3170
|
+
volume,
|
|
3171
|
+
muted,
|
|
3172
|
+
playbackRate,
|
|
3173
|
+
loop
|
|
3174
|
+
});
|
|
3175
|
+
}),
|
|
3176
|
+
sampling.media || 500
|
|
3177
|
+
)
|
|
3178
|
+
);
|
|
3179
|
+
const handlers = [
|
|
3180
|
+
on("play", handler(MediaInteractions.Play), doc),
|
|
3181
|
+
on("pause", handler(MediaInteractions.Pause), doc),
|
|
3182
|
+
on("seeked", handler(MediaInteractions.Seeked), doc),
|
|
3183
|
+
on("volumechange", handler(MediaInteractions.VolumeChange), doc),
|
|
3184
|
+
on("ratechange", handler(MediaInteractions.RateChange), doc)
|
|
3185
|
+
];
|
|
3186
|
+
return callbackWrapper(() => {
|
|
3187
|
+
handlers.forEach((h) => h());
|
|
3188
|
+
});
|
|
3189
|
+
}
|
|
3190
|
+
function initFontObserver({ fontCb, doc }) {
|
|
3191
|
+
const win = doc.defaultView;
|
|
3192
|
+
if (!win) {
|
|
3193
|
+
return () => {
|
|
3194
|
+
};
|
|
3195
|
+
}
|
|
3196
|
+
const handlers = [];
|
|
3197
|
+
const fontMap = /* @__PURE__ */ new WeakMap();
|
|
3198
|
+
const originalFontFace = win.FontFace;
|
|
3199
|
+
win.FontFace = function FontFace(family, source, descriptors) {
|
|
3200
|
+
const fontFace = new originalFontFace(family, source, descriptors);
|
|
3201
|
+
fontMap.set(fontFace, {
|
|
3202
|
+
family,
|
|
3203
|
+
buffer: typeof source !== "string",
|
|
3204
|
+
descriptors,
|
|
3205
|
+
fontSource: typeof source === "string" ? source : JSON.stringify(Array.from(new Uint8Array(source)))
|
|
3206
|
+
});
|
|
3207
|
+
return fontFace;
|
|
3208
|
+
};
|
|
3209
|
+
const restoreHandler = patch(
|
|
3210
|
+
doc.fonts,
|
|
3211
|
+
"add",
|
|
3212
|
+
function(original) {
|
|
3213
|
+
return function(fontFace) {
|
|
3214
|
+
setTimeout(
|
|
3215
|
+
callbackWrapper(() => {
|
|
3216
|
+
const p = fontMap.get(fontFace);
|
|
3217
|
+
if (p) {
|
|
3218
|
+
fontCb(p);
|
|
3219
|
+
fontMap.delete(fontFace);
|
|
3220
|
+
}
|
|
3221
|
+
}),
|
|
3222
|
+
0
|
|
3223
|
+
);
|
|
3224
|
+
return original.apply(this, [fontFace]);
|
|
3225
|
+
};
|
|
3226
|
+
}
|
|
3227
|
+
);
|
|
3228
|
+
handlers.push(() => {
|
|
3229
|
+
win.FontFace = originalFontFace;
|
|
3230
|
+
});
|
|
3231
|
+
handlers.push(restoreHandler);
|
|
3232
|
+
return callbackWrapper(() => {
|
|
3233
|
+
handlers.forEach((h) => h());
|
|
3234
|
+
});
|
|
3235
|
+
}
|
|
3236
|
+
function initSelectionObserver(param) {
|
|
3237
|
+
const { doc, mirror: mirror2, blockClass, blockSelector, selectionCb } = param;
|
|
3238
|
+
let collapsed = true;
|
|
3239
|
+
const updateSelection = callbackWrapper(() => {
|
|
3240
|
+
const selection = doc.getSelection();
|
|
3241
|
+
if (!selection || collapsed && (selection == null ? void 0 : selection.isCollapsed)) return;
|
|
3242
|
+
collapsed = selection.isCollapsed || false;
|
|
3243
|
+
const ranges = [];
|
|
3244
|
+
const count = selection.rangeCount || 0;
|
|
3245
|
+
for (let i = 0; i < count; i++) {
|
|
3246
|
+
const range = selection.getRangeAt(i);
|
|
3247
|
+
const { startContainer, startOffset, endContainer, endOffset } = range;
|
|
3248
|
+
const blocked = isBlocked(startContainer, blockClass, blockSelector, true) || isBlocked(endContainer, blockClass, blockSelector, true);
|
|
3249
|
+
if (blocked) continue;
|
|
3250
|
+
ranges.push({
|
|
3251
|
+
start: mirror2.getId(startContainer),
|
|
3252
|
+
startOffset,
|
|
3253
|
+
end: mirror2.getId(endContainer),
|
|
3254
|
+
endOffset
|
|
3255
|
+
});
|
|
3256
|
+
}
|
|
3257
|
+
selectionCb({ ranges });
|
|
3258
|
+
});
|
|
3259
|
+
updateSelection();
|
|
3260
|
+
return on("selectionchange", updateSelection);
|
|
3261
|
+
}
|
|
3262
|
+
function initCustomElementObserver({
|
|
3263
|
+
doc,
|
|
3264
|
+
customElementCb
|
|
3265
|
+
}) {
|
|
3266
|
+
const win = doc.defaultView;
|
|
3267
|
+
if (!win || !win.customElements) return () => {
|
|
3268
|
+
};
|
|
3269
|
+
const restoreHandler = patch(
|
|
3270
|
+
win.customElements,
|
|
3271
|
+
"define",
|
|
3272
|
+
function(original) {
|
|
3273
|
+
return function(name, constructor, options) {
|
|
3274
|
+
try {
|
|
3275
|
+
customElementCb({
|
|
3276
|
+
define: {
|
|
3277
|
+
name
|
|
3278
|
+
}
|
|
3279
|
+
});
|
|
3280
|
+
} catch (e) {
|
|
3281
|
+
console.warn(`Custom element callback failed for ${name}`);
|
|
3282
|
+
}
|
|
3283
|
+
return original.apply(this, [name, constructor, options]);
|
|
3284
|
+
};
|
|
3285
|
+
}
|
|
3286
|
+
);
|
|
3287
|
+
return restoreHandler;
|
|
3288
|
+
}
|
|
3289
|
+
function mergeHooks(o, hooks) {
|
|
3290
|
+
const {
|
|
3291
|
+
mutationCb,
|
|
3292
|
+
mousemoveCb,
|
|
3293
|
+
mouseInteractionCb,
|
|
3294
|
+
scrollCb,
|
|
3295
|
+
viewportResizeCb,
|
|
3296
|
+
inputCb,
|
|
3297
|
+
mediaInteractionCb,
|
|
3298
|
+
styleSheetRuleCb,
|
|
3299
|
+
styleDeclarationCb,
|
|
3300
|
+
canvasMutationCb,
|
|
3301
|
+
fontCb,
|
|
3302
|
+
selectionCb,
|
|
3303
|
+
customElementCb
|
|
3304
|
+
} = o;
|
|
3305
|
+
o.mutationCb = (...p) => {
|
|
3306
|
+
if (hooks.mutation) {
|
|
3307
|
+
hooks.mutation(...p);
|
|
3308
|
+
}
|
|
3309
|
+
mutationCb(...p);
|
|
3310
|
+
};
|
|
3311
|
+
o.mousemoveCb = (...p) => {
|
|
3312
|
+
if (hooks.mousemove) {
|
|
3313
|
+
hooks.mousemove(...p);
|
|
3314
|
+
}
|
|
3315
|
+
mousemoveCb(...p);
|
|
3316
|
+
};
|
|
3317
|
+
o.mouseInteractionCb = (...p) => {
|
|
3318
|
+
if (hooks.mouseInteraction) {
|
|
3319
|
+
hooks.mouseInteraction(...p);
|
|
3320
|
+
}
|
|
3321
|
+
mouseInteractionCb(...p);
|
|
3322
|
+
};
|
|
3323
|
+
o.scrollCb = (...p) => {
|
|
3324
|
+
if (hooks.scroll) {
|
|
3325
|
+
hooks.scroll(...p);
|
|
3326
|
+
}
|
|
3327
|
+
scrollCb(...p);
|
|
3328
|
+
};
|
|
3329
|
+
o.viewportResizeCb = (...p) => {
|
|
3330
|
+
if (hooks.viewportResize) {
|
|
3331
|
+
hooks.viewportResize(...p);
|
|
3332
|
+
}
|
|
3333
|
+
viewportResizeCb(...p);
|
|
3334
|
+
};
|
|
3335
|
+
o.inputCb = (...p) => {
|
|
3336
|
+
if (hooks.input) {
|
|
3337
|
+
hooks.input(...p);
|
|
3338
|
+
}
|
|
3339
|
+
inputCb(...p);
|
|
3340
|
+
};
|
|
3341
|
+
o.mediaInteractionCb = (...p) => {
|
|
3342
|
+
if (hooks.mediaInteaction) {
|
|
3343
|
+
hooks.mediaInteaction(...p);
|
|
3344
|
+
}
|
|
3345
|
+
mediaInteractionCb(...p);
|
|
3346
|
+
};
|
|
3347
|
+
o.styleSheetRuleCb = (...p) => {
|
|
3348
|
+
if (hooks.styleSheetRule) {
|
|
3349
|
+
hooks.styleSheetRule(...p);
|
|
3350
|
+
}
|
|
3351
|
+
styleSheetRuleCb(...p);
|
|
3352
|
+
};
|
|
3353
|
+
o.styleDeclarationCb = (...p) => {
|
|
3354
|
+
if (hooks.styleDeclaration) {
|
|
3355
|
+
hooks.styleDeclaration(...p);
|
|
3356
|
+
}
|
|
3357
|
+
styleDeclarationCb(...p);
|
|
3358
|
+
};
|
|
3359
|
+
o.canvasMutationCb = (...p) => {
|
|
3360
|
+
if (hooks.canvasMutation) {
|
|
3361
|
+
hooks.canvasMutation(...p);
|
|
3362
|
+
}
|
|
3363
|
+
canvasMutationCb(...p);
|
|
3364
|
+
};
|
|
3365
|
+
o.fontCb = (...p) => {
|
|
3366
|
+
if (hooks.font) {
|
|
3367
|
+
hooks.font(...p);
|
|
3368
|
+
}
|
|
3369
|
+
fontCb(...p);
|
|
3370
|
+
};
|
|
3371
|
+
o.selectionCb = (...p) => {
|
|
3372
|
+
if (hooks.selection) {
|
|
3373
|
+
hooks.selection(...p);
|
|
3374
|
+
}
|
|
3375
|
+
selectionCb(...p);
|
|
3376
|
+
};
|
|
3377
|
+
o.customElementCb = (...c) => {
|
|
3378
|
+
if (hooks.customElement) {
|
|
3379
|
+
hooks.customElement(...c);
|
|
3380
|
+
}
|
|
3381
|
+
customElementCb(...c);
|
|
3382
|
+
};
|
|
3383
|
+
}
|
|
3384
|
+
function initObservers(o, hooks = {}) {
|
|
3385
|
+
const currentWindow = o.doc.defaultView;
|
|
3386
|
+
if (!currentWindow) {
|
|
3387
|
+
return () => {
|
|
3388
|
+
};
|
|
3389
|
+
}
|
|
3390
|
+
mergeHooks(o, hooks);
|
|
3391
|
+
let mutationObserver;
|
|
3392
|
+
let cleanupMutationIframe = () => {
|
|
3393
|
+
};
|
|
3394
|
+
if (o.recordDOM) {
|
|
3395
|
+
[mutationObserver, cleanupMutationIframe] = initMutationObserver(o, o.doc);
|
|
3396
|
+
}
|
|
3397
|
+
const mousemoveHandler = initMoveObserver(o);
|
|
3398
|
+
const mouseInteractionHandler = initMouseInteractionObserver(o);
|
|
3399
|
+
const scrollHandler = initScrollObserver(o);
|
|
3400
|
+
const viewportResizeHandler = initViewportResizeObserver(o, {
|
|
3401
|
+
win: currentWindow
|
|
3402
|
+
});
|
|
3403
|
+
const inputHandler = initInputObserver(o);
|
|
3404
|
+
const mediaInteractionHandler = initMediaInteractionObserver(o);
|
|
3405
|
+
let styleSheetObserver = () => {
|
|
3406
|
+
};
|
|
3407
|
+
let adoptedStyleSheetObserver = () => {
|
|
3408
|
+
};
|
|
3409
|
+
let styleDeclarationObserver = () => {
|
|
3410
|
+
};
|
|
3411
|
+
let fontObserver = () => {
|
|
3412
|
+
};
|
|
3413
|
+
if (o.recordDOM) {
|
|
3414
|
+
styleSheetObserver = initStyleSheetObserver(o, { win: currentWindow });
|
|
3415
|
+
adoptedStyleSheetObserver = initAdoptedStyleSheetObserver(o, o.doc);
|
|
3416
|
+
styleDeclarationObserver = initStyleDeclarationObserver(o, {
|
|
3417
|
+
win: currentWindow
|
|
3418
|
+
});
|
|
3419
|
+
if (o.collectFonts) {
|
|
3420
|
+
fontObserver = initFontObserver(o);
|
|
3421
|
+
}
|
|
3422
|
+
}
|
|
3423
|
+
const selectionObserver = initSelectionObserver(o);
|
|
3424
|
+
const customElementObserver = initCustomElementObserver(o);
|
|
3425
|
+
const pluginHandlers = [];
|
|
3426
|
+
for (const plugin of o.plugins) {
|
|
3427
|
+
pluginHandlers.push(
|
|
3428
|
+
plugin.observer(plugin.callback, currentWindow, plugin.options)
|
|
3429
|
+
);
|
|
3430
|
+
}
|
|
3431
|
+
return callbackWrapper(() => {
|
|
3432
|
+
mutationBuffers.forEach((b) => b.reset());
|
|
3433
|
+
mutationObserver == null ? void 0 : mutationObserver.disconnect();
|
|
3434
|
+
cleanupMutationIframe();
|
|
3435
|
+
mousemoveHandler();
|
|
3436
|
+
mouseInteractionHandler();
|
|
3437
|
+
scrollHandler();
|
|
3438
|
+
viewportResizeHandler();
|
|
3439
|
+
inputHandler();
|
|
3440
|
+
mediaInteractionHandler();
|
|
3441
|
+
styleSheetObserver();
|
|
3442
|
+
adoptedStyleSheetObserver();
|
|
3443
|
+
styleDeclarationObserver();
|
|
3444
|
+
fontObserver();
|
|
3445
|
+
selectionObserver();
|
|
3446
|
+
customElementObserver();
|
|
3447
|
+
pluginHandlers.forEach((h) => h());
|
|
3448
|
+
});
|
|
3449
|
+
}
|
|
3450
|
+
function hasNestedCSSRule(win, prop) {
|
|
3451
|
+
return typeof win[prop] !== "undefined";
|
|
3452
|
+
}
|
|
3453
|
+
function canMonkeyPatchNestedCSSRule(win, prop) {
|
|
3454
|
+
return Boolean(
|
|
3455
|
+
typeof win[prop] !== "undefined" && // Note: Generally, this check _shouldn't_ be necessary
|
|
3456
|
+
// However, in some scenarios (e.g. jsdom) this can sometimes fail, so we check for it here
|
|
3457
|
+
win[prop].prototype && "insertRule" in win[prop].prototype && "deleteRule" in win[prop].prototype
|
|
3458
|
+
);
|
|
3459
|
+
}
|
|
3460
|
+
class CrossOriginIframeMirror {
|
|
3461
|
+
constructor(generateIdFn) {
|
|
3462
|
+
__publicField(this, "iframeIdToRemoteIdMap", /* @__PURE__ */ new WeakMap());
|
|
3463
|
+
__publicField(this, "iframeRemoteIdToIdMap", /* @__PURE__ */ new WeakMap());
|
|
3464
|
+
this.generateIdFn = generateIdFn;
|
|
3465
|
+
}
|
|
3466
|
+
getId(iframe, remoteId, idToRemoteMap, remoteToIdMap) {
|
|
3467
|
+
const idToRemoteIdMap = idToRemoteMap || this.getIdToRemoteIdMap(iframe);
|
|
3468
|
+
const remoteIdToIdMap = remoteToIdMap || this.getRemoteIdToIdMap(iframe);
|
|
3469
|
+
let id = idToRemoteIdMap.get(remoteId);
|
|
3470
|
+
if (!id) {
|
|
3471
|
+
id = this.generateIdFn();
|
|
3472
|
+
idToRemoteIdMap.set(remoteId, id);
|
|
3473
|
+
remoteIdToIdMap.set(id, remoteId);
|
|
3474
|
+
}
|
|
3475
|
+
return id;
|
|
3476
|
+
}
|
|
3477
|
+
getIds(iframe, remoteId) {
|
|
3478
|
+
const idToRemoteIdMap = this.getIdToRemoteIdMap(iframe);
|
|
3479
|
+
const remoteIdToIdMap = this.getRemoteIdToIdMap(iframe);
|
|
3480
|
+
return remoteId.map(
|
|
3481
|
+
(id) => this.getId(iframe, id, idToRemoteIdMap, remoteIdToIdMap)
|
|
3482
|
+
);
|
|
3483
|
+
}
|
|
3484
|
+
getRemoteId(iframe, id, map) {
|
|
3485
|
+
const remoteIdToIdMap = map || this.getRemoteIdToIdMap(iframe);
|
|
3486
|
+
if (typeof id !== "number") return id;
|
|
3487
|
+
const remoteId = remoteIdToIdMap.get(id);
|
|
3488
|
+
if (!remoteId) return -1;
|
|
3489
|
+
return remoteId;
|
|
3490
|
+
}
|
|
3491
|
+
getRemoteIds(iframe, ids) {
|
|
3492
|
+
const remoteIdToIdMap = this.getRemoteIdToIdMap(iframe);
|
|
3493
|
+
return ids.map((id) => this.getRemoteId(iframe, id, remoteIdToIdMap));
|
|
3494
|
+
}
|
|
3495
|
+
reset(iframe) {
|
|
3496
|
+
if (!iframe) {
|
|
3497
|
+
this.iframeIdToRemoteIdMap = /* @__PURE__ */ new WeakMap();
|
|
3498
|
+
this.iframeRemoteIdToIdMap = /* @__PURE__ */ new WeakMap();
|
|
3499
|
+
return;
|
|
3500
|
+
}
|
|
3501
|
+
this.iframeIdToRemoteIdMap.delete(iframe);
|
|
3502
|
+
this.iframeRemoteIdToIdMap.delete(iframe);
|
|
3503
|
+
}
|
|
3504
|
+
getIdToRemoteIdMap(iframe) {
|
|
3505
|
+
let idToRemoteIdMap = this.iframeIdToRemoteIdMap.get(iframe);
|
|
3506
|
+
if (!idToRemoteIdMap) {
|
|
3507
|
+
idToRemoteIdMap = /* @__PURE__ */ new Map();
|
|
3508
|
+
this.iframeIdToRemoteIdMap.set(iframe, idToRemoteIdMap);
|
|
3509
|
+
}
|
|
3510
|
+
return idToRemoteIdMap;
|
|
3511
|
+
}
|
|
3512
|
+
getRemoteIdToIdMap(iframe) {
|
|
3513
|
+
let remoteIdToIdMap = this.iframeRemoteIdToIdMap.get(iframe);
|
|
3514
|
+
if (!remoteIdToIdMap) {
|
|
3515
|
+
remoteIdToIdMap = /* @__PURE__ */ new Map();
|
|
3516
|
+
this.iframeRemoteIdToIdMap.set(iframe, remoteIdToIdMap);
|
|
3517
|
+
}
|
|
3518
|
+
return remoteIdToIdMap;
|
|
3519
|
+
}
|
|
3520
|
+
}
|
|
3521
|
+
class IframeManager {
|
|
3522
|
+
constructor(options) {
|
|
3523
|
+
__publicField(this, "iframes", /* @__PURE__ */ new WeakMap());
|
|
3524
|
+
__publicField(this, "crossOriginIframeMap", /* @__PURE__ */ new WeakMap());
|
|
3525
|
+
__publicField(this, "crossOriginIframeMirror", new CrossOriginIframeMirror(genId));
|
|
3526
|
+
__publicField(this, "crossOriginIframeStyleMirror");
|
|
3527
|
+
__publicField(this, "crossOriginIframeRootIdMap", /* @__PURE__ */ new WeakMap());
|
|
3528
|
+
__publicField(this, "mirror");
|
|
3529
|
+
__publicField(this, "mutationCb");
|
|
3530
|
+
__publicField(this, "wrappedEmit");
|
|
3531
|
+
__publicField(this, "loadListener");
|
|
3532
|
+
__publicField(this, "stylesheetManager");
|
|
3533
|
+
__publicField(this, "recordCrossOriginIframes");
|
|
3534
|
+
this.mutationCb = options.mutationCb;
|
|
3535
|
+
this.wrappedEmit = options.wrappedEmit;
|
|
3536
|
+
this.stylesheetManager = options.stylesheetManager;
|
|
3537
|
+
this.recordCrossOriginIframes = options.recordCrossOriginIframes;
|
|
3538
|
+
this.crossOriginIframeStyleMirror = new CrossOriginIframeMirror(
|
|
3539
|
+
this.stylesheetManager.styleMirror.generateId.bind(
|
|
3540
|
+
this.stylesheetManager.styleMirror
|
|
3541
|
+
)
|
|
3542
|
+
);
|
|
3543
|
+
this.mirror = options.mirror;
|
|
3544
|
+
if (this.recordCrossOriginIframes) {
|
|
3545
|
+
options.win.addEventListener("message", this.handleMessage.bind(this));
|
|
3546
|
+
}
|
|
3547
|
+
}
|
|
3548
|
+
addIframe(iframeEl) {
|
|
3549
|
+
this.iframes.set(iframeEl, true);
|
|
3550
|
+
if (iframeEl.contentWindow)
|
|
3551
|
+
this.crossOriginIframeMap.set(iframeEl.contentWindow, iframeEl);
|
|
3552
|
+
}
|
|
3553
|
+
addLoadListener(cb) {
|
|
3554
|
+
this.loadListener = cb;
|
|
3555
|
+
}
|
|
3556
|
+
attachIframe(iframeEl, childSn) {
|
|
3557
|
+
var _a2, _b;
|
|
3558
|
+
this.mutationCb({
|
|
3559
|
+
adds: [
|
|
3560
|
+
{
|
|
3561
|
+
parentId: this.mirror.getId(iframeEl),
|
|
3562
|
+
nextId: null,
|
|
3563
|
+
node: childSn
|
|
3564
|
+
}
|
|
3565
|
+
],
|
|
3566
|
+
removes: [],
|
|
3567
|
+
texts: [],
|
|
3568
|
+
attributes: [],
|
|
3569
|
+
isAttachIframe: true
|
|
3570
|
+
});
|
|
3571
|
+
if (this.recordCrossOriginIframes)
|
|
3572
|
+
(_a2 = iframeEl.contentWindow) == null ? void 0 : _a2.addEventListener(
|
|
3573
|
+
"message",
|
|
3574
|
+
this.handleMessage.bind(this)
|
|
3575
|
+
);
|
|
3576
|
+
(_b = this.loadListener) == null ? void 0 : _b.call(this, iframeEl);
|
|
3577
|
+
if (iframeEl.contentDocument && iframeEl.contentDocument.adoptedStyleSheets && iframeEl.contentDocument.adoptedStyleSheets.length > 0)
|
|
3578
|
+
this.stylesheetManager.adoptStyleSheets(
|
|
3579
|
+
iframeEl.contentDocument.adoptedStyleSheets,
|
|
3580
|
+
this.mirror.getId(iframeEl.contentDocument)
|
|
3581
|
+
);
|
|
3582
|
+
}
|
|
3583
|
+
handleMessage(message) {
|
|
3584
|
+
const crossOriginMessageEvent = message;
|
|
3585
|
+
if (crossOriginMessageEvent.data.type !== "rrweb" || // To filter out the rrweb messages which are forwarded by some sites.
|
|
3586
|
+
crossOriginMessageEvent.origin !== crossOriginMessageEvent.data.origin)
|
|
3587
|
+
return;
|
|
3588
|
+
const iframeSourceWindow = message.source;
|
|
3589
|
+
if (!iframeSourceWindow) return;
|
|
3590
|
+
const iframeEl = this.crossOriginIframeMap.get(message.source);
|
|
3591
|
+
if (!iframeEl) return;
|
|
3592
|
+
const transformedEvent = this.transformCrossOriginEvent(
|
|
3593
|
+
iframeEl,
|
|
3594
|
+
crossOriginMessageEvent.data.event
|
|
3595
|
+
);
|
|
3596
|
+
if (transformedEvent)
|
|
3597
|
+
this.wrappedEmit(
|
|
3598
|
+
transformedEvent,
|
|
3599
|
+
crossOriginMessageEvent.data.isCheckout
|
|
3600
|
+
);
|
|
3601
|
+
}
|
|
3602
|
+
transformCrossOriginEvent(iframeEl, e) {
|
|
3603
|
+
var _a2;
|
|
3604
|
+
switch (e.type) {
|
|
3605
|
+
case EventType.FullSnapshot: {
|
|
3606
|
+
this.crossOriginIframeMirror.reset(iframeEl);
|
|
3607
|
+
this.crossOriginIframeStyleMirror.reset(iframeEl);
|
|
3608
|
+
this.replaceIdOnNode(e.data.node, iframeEl);
|
|
3609
|
+
const rootId = e.data.node.id;
|
|
3610
|
+
this.crossOriginIframeRootIdMap.set(iframeEl, rootId);
|
|
3611
|
+
this.patchRootIdOnNode(e.data.node, rootId);
|
|
3612
|
+
return {
|
|
3613
|
+
timestamp: e.timestamp,
|
|
3614
|
+
type: EventType.IncrementalSnapshot,
|
|
3615
|
+
data: {
|
|
3616
|
+
source: IncrementalSource.Mutation,
|
|
3617
|
+
adds: [
|
|
3618
|
+
{
|
|
3619
|
+
parentId: this.mirror.getId(iframeEl),
|
|
3620
|
+
nextId: null,
|
|
3621
|
+
node: e.data.node
|
|
3622
|
+
}
|
|
3623
|
+
],
|
|
3624
|
+
removes: [],
|
|
3625
|
+
texts: [],
|
|
3626
|
+
attributes: [],
|
|
3627
|
+
isAttachIframe: true
|
|
3628
|
+
}
|
|
3629
|
+
};
|
|
3630
|
+
}
|
|
3631
|
+
case EventType.Meta:
|
|
3632
|
+
case EventType.Load:
|
|
3633
|
+
case EventType.DomContentLoaded: {
|
|
3634
|
+
return false;
|
|
3635
|
+
}
|
|
3636
|
+
case EventType.Plugin: {
|
|
3637
|
+
return e;
|
|
3638
|
+
}
|
|
3639
|
+
case EventType.Custom: {
|
|
3640
|
+
this.replaceIds(
|
|
3641
|
+
e.data.payload,
|
|
3642
|
+
iframeEl,
|
|
3643
|
+
["id", "parentId", "previousId", "nextId"]
|
|
3644
|
+
);
|
|
3645
|
+
return e;
|
|
3646
|
+
}
|
|
3647
|
+
case EventType.IncrementalSnapshot: {
|
|
3648
|
+
switch (e.data.source) {
|
|
3649
|
+
case IncrementalSource.Mutation: {
|
|
3650
|
+
e.data.adds.forEach((n) => {
|
|
3651
|
+
this.replaceIds(n, iframeEl, [
|
|
3652
|
+
"parentId",
|
|
3653
|
+
"nextId",
|
|
3654
|
+
"previousId"
|
|
3655
|
+
]);
|
|
3656
|
+
this.replaceIdOnNode(n.node, iframeEl);
|
|
3657
|
+
const rootId = this.crossOriginIframeRootIdMap.get(iframeEl);
|
|
3658
|
+
rootId && this.patchRootIdOnNode(n.node, rootId);
|
|
3659
|
+
});
|
|
3660
|
+
e.data.removes.forEach((n) => {
|
|
3661
|
+
this.replaceIds(n, iframeEl, ["parentId", "id"]);
|
|
3662
|
+
});
|
|
3663
|
+
e.data.attributes.forEach((n) => {
|
|
3664
|
+
this.replaceIds(n, iframeEl, ["id"]);
|
|
3665
|
+
});
|
|
3666
|
+
e.data.texts.forEach((n) => {
|
|
3667
|
+
this.replaceIds(n, iframeEl, ["id"]);
|
|
3668
|
+
});
|
|
3669
|
+
return e;
|
|
3670
|
+
}
|
|
3671
|
+
case IncrementalSource.Drag:
|
|
3672
|
+
case IncrementalSource.TouchMove:
|
|
3673
|
+
case IncrementalSource.MouseMove: {
|
|
3674
|
+
e.data.positions.forEach((p) => {
|
|
3675
|
+
this.replaceIds(p, iframeEl, ["id"]);
|
|
3676
|
+
});
|
|
3677
|
+
return e;
|
|
3678
|
+
}
|
|
3679
|
+
case IncrementalSource.ViewportResize: {
|
|
3680
|
+
return false;
|
|
3681
|
+
}
|
|
3682
|
+
case IncrementalSource.MediaInteraction:
|
|
3683
|
+
case IncrementalSource.MouseInteraction:
|
|
3684
|
+
case IncrementalSource.Scroll:
|
|
3685
|
+
case IncrementalSource.CanvasMutation:
|
|
3686
|
+
case IncrementalSource.Input: {
|
|
3687
|
+
this.replaceIds(e.data, iframeEl, ["id"]);
|
|
3688
|
+
return e;
|
|
3689
|
+
}
|
|
3690
|
+
case IncrementalSource.StyleSheetRule:
|
|
3691
|
+
case IncrementalSource.StyleDeclaration: {
|
|
3692
|
+
this.replaceIds(e.data, iframeEl, ["id"]);
|
|
3693
|
+
this.replaceStyleIds(e.data, iframeEl, ["styleId"]);
|
|
3694
|
+
return e;
|
|
3695
|
+
}
|
|
3696
|
+
case IncrementalSource.Font: {
|
|
3697
|
+
return e;
|
|
3698
|
+
}
|
|
3699
|
+
case IncrementalSource.Selection: {
|
|
3700
|
+
e.data.ranges.forEach((range) => {
|
|
3701
|
+
this.replaceIds(range, iframeEl, ["start", "end"]);
|
|
3702
|
+
});
|
|
3703
|
+
return e;
|
|
3704
|
+
}
|
|
3705
|
+
case IncrementalSource.AdoptedStyleSheet: {
|
|
3706
|
+
this.replaceIds(e.data, iframeEl, ["id"]);
|
|
3707
|
+
this.replaceStyleIds(e.data, iframeEl, ["styleIds"]);
|
|
3708
|
+
(_a2 = e.data.styles) == null ? void 0 : _a2.forEach((style) => {
|
|
3709
|
+
this.replaceStyleIds(style, iframeEl, ["styleId"]);
|
|
3710
|
+
});
|
|
3711
|
+
return e;
|
|
3712
|
+
}
|
|
3713
|
+
}
|
|
3714
|
+
}
|
|
3715
|
+
}
|
|
3716
|
+
return false;
|
|
3717
|
+
}
|
|
3718
|
+
replace(iframeMirror, obj, iframeEl, keys) {
|
|
3719
|
+
for (const key of keys) {
|
|
3720
|
+
if (!Array.isArray(obj[key]) && typeof obj[key] !== "number") continue;
|
|
3721
|
+
if (Array.isArray(obj[key])) {
|
|
3722
|
+
obj[key] = iframeMirror.getIds(
|
|
3723
|
+
iframeEl,
|
|
3724
|
+
obj[key]
|
|
3725
|
+
);
|
|
3726
|
+
} else {
|
|
3727
|
+
obj[key] = iframeMirror.getId(iframeEl, obj[key]);
|
|
3728
|
+
}
|
|
3729
|
+
}
|
|
3730
|
+
return obj;
|
|
3731
|
+
}
|
|
3732
|
+
replaceIds(obj, iframeEl, keys) {
|
|
3733
|
+
return this.replace(this.crossOriginIframeMirror, obj, iframeEl, keys);
|
|
3734
|
+
}
|
|
3735
|
+
replaceStyleIds(obj, iframeEl, keys) {
|
|
3736
|
+
return this.replace(this.crossOriginIframeStyleMirror, obj, iframeEl, keys);
|
|
3737
|
+
}
|
|
3738
|
+
replaceIdOnNode(node, iframeEl) {
|
|
3739
|
+
this.replaceIds(node, iframeEl, ["id", "rootId"]);
|
|
3740
|
+
if ("childNodes" in node) {
|
|
3741
|
+
node.childNodes.forEach((child) => {
|
|
3742
|
+
this.replaceIdOnNode(child, iframeEl);
|
|
3743
|
+
});
|
|
3744
|
+
}
|
|
3745
|
+
}
|
|
3746
|
+
patchRootIdOnNode(node, rootId) {
|
|
3747
|
+
if (node.type !== NodeType.Document && !node.rootId) node.rootId = rootId;
|
|
3748
|
+
if ("childNodes" in node) {
|
|
3749
|
+
node.childNodes.forEach((child) => {
|
|
3750
|
+
this.patchRootIdOnNode(child, rootId);
|
|
3751
|
+
});
|
|
3752
|
+
}
|
|
3753
|
+
}
|
|
3754
|
+
}
|
|
3755
|
+
class ShadowDomManager {
|
|
3756
|
+
constructor(options) {
|
|
3757
|
+
__publicField(this, "shadowDoms", /* @__PURE__ */ new WeakSet());
|
|
3758
|
+
__publicField(this, "mutationCb");
|
|
3759
|
+
__publicField(this, "scrollCb");
|
|
3760
|
+
__publicField(this, "bypassOptions");
|
|
3761
|
+
__publicField(this, "mirror");
|
|
3762
|
+
__publicField(this, "restoreHandlers", []);
|
|
3763
|
+
this.mutationCb = options.mutationCb;
|
|
3764
|
+
this.scrollCb = options.scrollCb;
|
|
3765
|
+
this.bypassOptions = options.bypassOptions;
|
|
3766
|
+
this.mirror = options.mirror;
|
|
3767
|
+
this.init();
|
|
3768
|
+
}
|
|
3769
|
+
init() {
|
|
3770
|
+
this.reset();
|
|
3771
|
+
this.patchAttachShadow(
|
|
3772
|
+
this.bypassOptions.win.Element,
|
|
3773
|
+
this.bypassOptions.win.document
|
|
3774
|
+
);
|
|
3775
|
+
}
|
|
3776
|
+
addShadowRoot(shadowRoot2, doc) {
|
|
3777
|
+
if (!isNativeShadowDom(shadowRoot2)) return;
|
|
3778
|
+
if (this.shadowDoms.has(shadowRoot2)) return;
|
|
3779
|
+
this.shadowDoms.add(shadowRoot2);
|
|
3780
|
+
const [observer] = initMutationObserver(
|
|
3781
|
+
{
|
|
3782
|
+
...this.bypassOptions,
|
|
3783
|
+
doc,
|
|
3784
|
+
mutationCb: this.mutationCb,
|
|
3785
|
+
mirror: this.mirror,
|
|
3786
|
+
shadowDomManager: this
|
|
3787
|
+
},
|
|
3788
|
+
shadowRoot2
|
|
3789
|
+
);
|
|
3790
|
+
this.restoreHandlers.push(() => observer.disconnect());
|
|
3791
|
+
this.restoreHandlers.push(
|
|
3792
|
+
initScrollObserver({
|
|
3793
|
+
...this.bypassOptions,
|
|
3794
|
+
scrollCb: this.scrollCb,
|
|
3795
|
+
// https://gist.github.com/praveenpuglia/0832da687ed5a5d7a0907046c9ef1813
|
|
3796
|
+
// scroll is not allowed to pass the boundary, so we need to listen the shadow document
|
|
3797
|
+
doc: shadowRoot2,
|
|
3798
|
+
mirror: this.mirror
|
|
3799
|
+
})
|
|
3800
|
+
);
|
|
3801
|
+
setTimeout(() => {
|
|
3802
|
+
if (shadowRoot2.adoptedStyleSheets && shadowRoot2.adoptedStyleSheets.length > 0)
|
|
3803
|
+
this.bypassOptions.stylesheetManager.adoptStyleSheets(
|
|
3804
|
+
shadowRoot2.adoptedStyleSheets,
|
|
3805
|
+
this.mirror.getId(index.host(shadowRoot2))
|
|
3806
|
+
);
|
|
3807
|
+
this.restoreHandlers.push(
|
|
3808
|
+
initAdoptedStyleSheetObserver(
|
|
3809
|
+
{
|
|
3810
|
+
mirror: this.mirror,
|
|
3811
|
+
stylesheetManager: this.bypassOptions.stylesheetManager
|
|
3812
|
+
},
|
|
3813
|
+
shadowRoot2
|
|
3814
|
+
)
|
|
3815
|
+
);
|
|
3816
|
+
}, 0);
|
|
3817
|
+
}
|
|
3818
|
+
/**
|
|
3819
|
+
* Monkey patch 'attachShadow' of an IFrameElement to observe newly added shadow doms.
|
|
3820
|
+
*/
|
|
3821
|
+
observeAttachShadow(iframeElement) {
|
|
3822
|
+
if (!iframeElement.contentWindow || !iframeElement.contentDocument) return;
|
|
3823
|
+
this.patchAttachShadow(
|
|
3824
|
+
iframeElement.contentWindow.Element,
|
|
3825
|
+
iframeElement.contentDocument
|
|
3826
|
+
);
|
|
3827
|
+
}
|
|
3828
|
+
/**
|
|
3829
|
+
* Patch 'attachShadow' to observe newly added shadow doms.
|
|
3830
|
+
*/
|
|
3831
|
+
patchAttachShadow(element, doc) {
|
|
3832
|
+
const manager = this;
|
|
3833
|
+
this.restoreHandlers.push(
|
|
3834
|
+
patch(
|
|
3835
|
+
element.prototype,
|
|
3836
|
+
"attachShadow",
|
|
3837
|
+
function(original) {
|
|
3838
|
+
return function(option) {
|
|
3839
|
+
const sRoot = original.call(this, option);
|
|
3840
|
+
const shadowRootEl = index.shadowRoot(this);
|
|
3841
|
+
if (shadowRootEl && inDom(this))
|
|
3842
|
+
manager.addShadowRoot(shadowRootEl, doc);
|
|
3843
|
+
return sRoot;
|
|
3844
|
+
};
|
|
3845
|
+
}
|
|
3846
|
+
)
|
|
3847
|
+
);
|
|
3848
|
+
}
|
|
3849
|
+
reset() {
|
|
3850
|
+
this.restoreHandlers.forEach((handler) => {
|
|
3851
|
+
try {
|
|
3852
|
+
handler();
|
|
3853
|
+
} catch (e) {
|
|
3854
|
+
}
|
|
3855
|
+
});
|
|
3856
|
+
this.restoreHandlers = [];
|
|
3857
|
+
this.shadowDoms = /* @__PURE__ */ new WeakSet();
|
|
3858
|
+
}
|
|
3859
|
+
}
|
|
3860
|
+
var chars = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/";
|
|
3861
|
+
var lookup = typeof Uint8Array === "undefined" ? [] : new Uint8Array(256);
|
|
3862
|
+
for (var i = 0; i < chars.length; i++) {
|
|
3863
|
+
lookup[chars.charCodeAt(i)] = i;
|
|
3864
|
+
}
|
|
3865
|
+
var encode = function(arraybuffer) {
|
|
3866
|
+
var bytes = new Uint8Array(arraybuffer), i, len = bytes.length, base64 = "";
|
|
3867
|
+
for (i = 0; i < len; i += 3) {
|
|
3868
|
+
base64 += chars[bytes[i] >> 2];
|
|
3869
|
+
base64 += chars[(bytes[i] & 3) << 4 | bytes[i + 1] >> 4];
|
|
3870
|
+
base64 += chars[(bytes[i + 1] & 15) << 2 | bytes[i + 2] >> 6];
|
|
3871
|
+
base64 += chars[bytes[i + 2] & 63];
|
|
3872
|
+
}
|
|
3873
|
+
if (len % 3 === 2) {
|
|
3874
|
+
base64 = base64.substring(0, base64.length - 1) + "=";
|
|
3875
|
+
} else if (len % 3 === 1) {
|
|
3876
|
+
base64 = base64.substring(0, base64.length - 2) + "==";
|
|
3877
|
+
}
|
|
3878
|
+
return base64;
|
|
3879
|
+
};
|
|
3880
|
+
const canvasVarMap = /* @__PURE__ */ new Map();
|
|
3881
|
+
function variableListFor(ctx, ctor) {
|
|
3882
|
+
let contextMap = canvasVarMap.get(ctx);
|
|
3883
|
+
if (!contextMap) {
|
|
3884
|
+
contextMap = /* @__PURE__ */ new Map();
|
|
3885
|
+
canvasVarMap.set(ctx, contextMap);
|
|
3886
|
+
}
|
|
3887
|
+
if (!contextMap.has(ctor)) {
|
|
3888
|
+
contextMap.set(ctor, []);
|
|
3889
|
+
}
|
|
3890
|
+
return contextMap.get(ctor);
|
|
3891
|
+
}
|
|
3892
|
+
const saveWebGLVar = (value, win, ctx) => {
|
|
3893
|
+
if (!value || !(isInstanceOfWebGLObject(value, win) || typeof value === "object"))
|
|
3894
|
+
return;
|
|
3895
|
+
const name = value.constructor.name;
|
|
3896
|
+
const list = variableListFor(ctx, name);
|
|
3897
|
+
let index2 = list.indexOf(value);
|
|
3898
|
+
if (index2 === -1) {
|
|
3899
|
+
index2 = list.length;
|
|
3900
|
+
list.push(value);
|
|
3901
|
+
}
|
|
3902
|
+
return index2;
|
|
3903
|
+
};
|
|
3904
|
+
function serializeArg(value, win, ctx) {
|
|
3905
|
+
if (value instanceof Array) {
|
|
3906
|
+
return value.map((arg) => serializeArg(arg, win, ctx));
|
|
3907
|
+
} else if (value === null) {
|
|
3908
|
+
return value;
|
|
3909
|
+
} else if (value instanceof win.Float32Array || value instanceof win.Float64Array || value instanceof win.Int32Array || value instanceof win.Uint32Array || value instanceof win.Uint8Array || value instanceof win.Uint16Array || value instanceof win.Int16Array || value instanceof win.Int8Array || value instanceof win.Uint8ClampedArray) {
|
|
3910
|
+
const name = value.constructor.name;
|
|
3911
|
+
return {
|
|
3912
|
+
rr_type: name,
|
|
3913
|
+
args: [Object.values(value)]
|
|
3914
|
+
};
|
|
3915
|
+
} else if (
|
|
3916
|
+
// SharedArrayBuffer disabled on most browsers due to spectre.
|
|
3917
|
+
// More info: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/SharedArrayBuffer/SharedArrayBuffer
|
|
3918
|
+
// value instanceof SharedArrayBuffer ||
|
|
3919
|
+
value instanceof win.ArrayBuffer
|
|
3920
|
+
) {
|
|
3921
|
+
const name = value.constructor.name;
|
|
3922
|
+
const base64 = encode(value);
|
|
3923
|
+
return {
|
|
3924
|
+
rr_type: name,
|
|
3925
|
+
base64
|
|
3926
|
+
};
|
|
3927
|
+
} else if (value instanceof win.DataView) {
|
|
3928
|
+
const name = value.constructor.name;
|
|
3929
|
+
return {
|
|
3930
|
+
rr_type: name,
|
|
3931
|
+
args: [
|
|
3932
|
+
serializeArg(value.buffer, win, ctx),
|
|
3933
|
+
value.byteOffset,
|
|
3934
|
+
value.byteLength
|
|
3935
|
+
]
|
|
3936
|
+
};
|
|
3937
|
+
} else if (value instanceof win.HTMLImageElement) {
|
|
3938
|
+
const name = value.constructor.name;
|
|
3939
|
+
const { src } = value;
|
|
3940
|
+
return {
|
|
3941
|
+
rr_type: name,
|
|
3942
|
+
src
|
|
3943
|
+
};
|
|
3944
|
+
} else if (value instanceof win.HTMLCanvasElement) {
|
|
3945
|
+
const name = "HTMLImageElement";
|
|
3946
|
+
const src = value.toDataURL();
|
|
3947
|
+
return {
|
|
3948
|
+
rr_type: name,
|
|
3949
|
+
src
|
|
3950
|
+
};
|
|
3951
|
+
} else if (value instanceof win.ImageData) {
|
|
3952
|
+
const name = value.constructor.name;
|
|
3953
|
+
return {
|
|
3954
|
+
rr_type: name,
|
|
3955
|
+
args: [serializeArg(value.data, win, ctx), value.width, value.height]
|
|
3956
|
+
};
|
|
3957
|
+
} else if (isInstanceOfWebGLObject(value, win) || typeof value === "object") {
|
|
3958
|
+
const name = value.constructor.name;
|
|
3959
|
+
const index2 = saveWebGLVar(value, win, ctx);
|
|
3960
|
+
return {
|
|
3961
|
+
rr_type: name,
|
|
3962
|
+
index: index2
|
|
3963
|
+
};
|
|
3964
|
+
}
|
|
3965
|
+
return value;
|
|
3966
|
+
}
|
|
3967
|
+
const serializeArgs = (args, win, ctx) => {
|
|
3968
|
+
return args.map((arg) => serializeArg(arg, win, ctx));
|
|
3969
|
+
};
|
|
3970
|
+
const isInstanceOfWebGLObject = (value, win) => {
|
|
3971
|
+
const webGLConstructorNames = [
|
|
3972
|
+
"WebGLActiveInfo",
|
|
3973
|
+
"WebGLBuffer",
|
|
3974
|
+
"WebGLFramebuffer",
|
|
3975
|
+
"WebGLProgram",
|
|
3976
|
+
"WebGLRenderbuffer",
|
|
3977
|
+
"WebGLShader",
|
|
3978
|
+
"WebGLShaderPrecisionFormat",
|
|
3979
|
+
"WebGLTexture",
|
|
3980
|
+
"WebGLUniformLocation",
|
|
3981
|
+
"WebGLVertexArrayObject",
|
|
3982
|
+
// In old Chrome versions, value won't be an instanceof WebGLVertexArrayObject.
|
|
3983
|
+
"WebGLVertexArrayObjectOES"
|
|
3984
|
+
];
|
|
3985
|
+
const supportedWebGLConstructorNames = webGLConstructorNames.filter(
|
|
3986
|
+
(name) => typeof win[name] === "function"
|
|
3987
|
+
);
|
|
3988
|
+
return Boolean(
|
|
3989
|
+
supportedWebGLConstructorNames.find(
|
|
3990
|
+
(name) => value instanceof win[name]
|
|
3991
|
+
)
|
|
3992
|
+
);
|
|
3993
|
+
};
|
|
3994
|
+
function initCanvas2DMutationObserver(cb, win, blockClass, blockSelector) {
|
|
3995
|
+
const handlers = [];
|
|
3996
|
+
const props2D = Object.getOwnPropertyNames(
|
|
3997
|
+
win.CanvasRenderingContext2D.prototype
|
|
3998
|
+
);
|
|
3999
|
+
for (const prop of props2D) {
|
|
4000
|
+
try {
|
|
4001
|
+
if (typeof win.CanvasRenderingContext2D.prototype[prop] !== "function") {
|
|
4002
|
+
continue;
|
|
4003
|
+
}
|
|
4004
|
+
const restoreHandler = patch(
|
|
4005
|
+
win.CanvasRenderingContext2D.prototype,
|
|
4006
|
+
prop,
|
|
4007
|
+
function(original) {
|
|
4008
|
+
return function(...args) {
|
|
4009
|
+
if (!isBlocked(this.canvas, blockClass, blockSelector, true)) {
|
|
4010
|
+
setTimeout(() => {
|
|
4011
|
+
const recordArgs = serializeArgs(args, win, this);
|
|
4012
|
+
cb(this.canvas, {
|
|
4013
|
+
type: CanvasContext["2D"],
|
|
4014
|
+
property: prop,
|
|
4015
|
+
args: recordArgs
|
|
4016
|
+
});
|
|
4017
|
+
}, 0);
|
|
4018
|
+
}
|
|
4019
|
+
return original.apply(this, args);
|
|
4020
|
+
};
|
|
4021
|
+
}
|
|
4022
|
+
);
|
|
4023
|
+
handlers.push(restoreHandler);
|
|
4024
|
+
} catch {
|
|
4025
|
+
const hookHandler = hookSetter(
|
|
4026
|
+
win.CanvasRenderingContext2D.prototype,
|
|
4027
|
+
prop,
|
|
4028
|
+
{
|
|
4029
|
+
set(v) {
|
|
4030
|
+
cb(this.canvas, {
|
|
4031
|
+
type: CanvasContext["2D"],
|
|
4032
|
+
property: prop,
|
|
4033
|
+
args: [v],
|
|
4034
|
+
setter: true
|
|
4035
|
+
});
|
|
4036
|
+
}
|
|
4037
|
+
}
|
|
4038
|
+
);
|
|
4039
|
+
handlers.push(hookHandler);
|
|
4040
|
+
}
|
|
4041
|
+
}
|
|
4042
|
+
return () => {
|
|
4043
|
+
handlers.forEach((h) => h());
|
|
4044
|
+
};
|
|
4045
|
+
}
|
|
4046
|
+
function getNormalizedContextName(contextType) {
|
|
4047
|
+
return contextType === "experimental-webgl" ? "webgl" : contextType;
|
|
4048
|
+
}
|
|
4049
|
+
function initCanvasContextObserver(win, blockClass, blockSelector, setPreserveDrawingBufferToTrue) {
|
|
4050
|
+
const handlers = [];
|
|
4051
|
+
try {
|
|
4052
|
+
const restoreHandler = patch(
|
|
4053
|
+
win.HTMLCanvasElement.prototype,
|
|
4054
|
+
"getContext",
|
|
4055
|
+
function(original) {
|
|
4056
|
+
return function(contextType, ...args) {
|
|
4057
|
+
if (!isBlocked(this, blockClass, blockSelector, true)) {
|
|
4058
|
+
const ctxName = getNormalizedContextName(contextType);
|
|
4059
|
+
if (!("__context" in this)) this.__context = ctxName;
|
|
4060
|
+
if (setPreserveDrawingBufferToTrue && ["webgl", "webgl2"].includes(ctxName)) {
|
|
4061
|
+
if (args[0] && typeof args[0] === "object") {
|
|
4062
|
+
const contextAttributes = args[0];
|
|
4063
|
+
if (!contextAttributes.preserveDrawingBuffer) {
|
|
4064
|
+
contextAttributes.preserveDrawingBuffer = true;
|
|
4065
|
+
}
|
|
4066
|
+
} else {
|
|
4067
|
+
args.splice(0, 1, {
|
|
4068
|
+
preserveDrawingBuffer: true
|
|
4069
|
+
});
|
|
4070
|
+
}
|
|
4071
|
+
}
|
|
4072
|
+
}
|
|
4073
|
+
return original.apply(this, [contextType, ...args]);
|
|
4074
|
+
};
|
|
4075
|
+
}
|
|
4076
|
+
);
|
|
4077
|
+
handlers.push(restoreHandler);
|
|
4078
|
+
} catch {
|
|
4079
|
+
console.error("failed to patch HTMLCanvasElement.prototype.getContext");
|
|
4080
|
+
}
|
|
4081
|
+
return () => {
|
|
4082
|
+
handlers.forEach((h) => h());
|
|
4083
|
+
};
|
|
4084
|
+
}
|
|
4085
|
+
function patchGLPrototype(prototype, type, cb, blockClass, blockSelector, win) {
|
|
4086
|
+
const handlers = [];
|
|
4087
|
+
const props = Object.getOwnPropertyNames(prototype);
|
|
4088
|
+
for (const prop of props) {
|
|
4089
|
+
if (
|
|
4090
|
+
//prop.startsWith('get') || // e.g. getProgramParameter, but too risky
|
|
4091
|
+
[
|
|
4092
|
+
"isContextLost",
|
|
4093
|
+
"canvas",
|
|
4094
|
+
"drawingBufferWidth",
|
|
4095
|
+
"drawingBufferHeight"
|
|
4096
|
+
].includes(prop)
|
|
4097
|
+
) {
|
|
4098
|
+
continue;
|
|
4099
|
+
}
|
|
4100
|
+
try {
|
|
4101
|
+
if (typeof prototype[prop] !== "function") {
|
|
4102
|
+
continue;
|
|
4103
|
+
}
|
|
4104
|
+
const restoreHandler = patch(
|
|
4105
|
+
prototype,
|
|
4106
|
+
prop,
|
|
4107
|
+
function(original) {
|
|
4108
|
+
return function(...args) {
|
|
4109
|
+
const result = original.apply(this, args);
|
|
4110
|
+
saveWebGLVar(result, win, this);
|
|
4111
|
+
if ("tagName" in this.canvas && !isBlocked(this.canvas, blockClass, blockSelector, true)) {
|
|
4112
|
+
const recordArgs = serializeArgs(args, win, this);
|
|
4113
|
+
const mutation = {
|
|
4114
|
+
type,
|
|
4115
|
+
property: prop,
|
|
4116
|
+
args: recordArgs
|
|
4117
|
+
};
|
|
4118
|
+
cb(this.canvas, mutation);
|
|
4119
|
+
}
|
|
4120
|
+
return result;
|
|
4121
|
+
};
|
|
4122
|
+
}
|
|
4123
|
+
);
|
|
4124
|
+
handlers.push(restoreHandler);
|
|
4125
|
+
} catch {
|
|
4126
|
+
const hookHandler = hookSetter(prototype, prop, {
|
|
4127
|
+
set(v) {
|
|
4128
|
+
cb(this.canvas, {
|
|
4129
|
+
type,
|
|
4130
|
+
property: prop,
|
|
4131
|
+
args: [v],
|
|
4132
|
+
setter: true
|
|
4133
|
+
});
|
|
4134
|
+
}
|
|
4135
|
+
});
|
|
4136
|
+
handlers.push(hookHandler);
|
|
4137
|
+
}
|
|
4138
|
+
}
|
|
4139
|
+
return handlers;
|
|
4140
|
+
}
|
|
4141
|
+
function initCanvasWebGLMutationObserver(cb, win, blockClass, blockSelector) {
|
|
4142
|
+
const handlers = [];
|
|
4143
|
+
if (typeof win.WebGLRenderingContext !== "undefined") {
|
|
4144
|
+
handlers.push(
|
|
4145
|
+
...patchGLPrototype(
|
|
4146
|
+
win.WebGLRenderingContext.prototype,
|
|
4147
|
+
CanvasContext.WebGL,
|
|
4148
|
+
cb,
|
|
4149
|
+
blockClass,
|
|
4150
|
+
blockSelector,
|
|
4151
|
+
win
|
|
4152
|
+
)
|
|
4153
|
+
);
|
|
4154
|
+
}
|
|
4155
|
+
if (typeof win.WebGL2RenderingContext !== "undefined") {
|
|
4156
|
+
handlers.push(
|
|
4157
|
+
...patchGLPrototype(
|
|
4158
|
+
win.WebGL2RenderingContext.prototype,
|
|
4159
|
+
CanvasContext.WebGL2,
|
|
4160
|
+
cb,
|
|
4161
|
+
blockClass,
|
|
4162
|
+
blockSelector,
|
|
4163
|
+
win
|
|
4164
|
+
)
|
|
4165
|
+
);
|
|
4166
|
+
}
|
|
4167
|
+
return () => {
|
|
4168
|
+
handlers.forEach((h) => h());
|
|
4169
|
+
};
|
|
4170
|
+
}
|
|
4171
|
+
const jsContent = '(function() {\n "use strict";\n var chars = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/";\n var lookup = typeof Uint8Array === "undefined" ? [] : new Uint8Array(256);\n for (var i = 0; i < chars.length; i++) {\n lookup[chars.charCodeAt(i)] = i;\n }\n var encode = function(arraybuffer) {\n var bytes = new Uint8Array(arraybuffer), i2, len = bytes.length, base64 = "";\n for (i2 = 0; i2 < len; i2 += 3) {\n base64 += chars[bytes[i2] >> 2];\n base64 += chars[(bytes[i2] & 3) << 4 | bytes[i2 + 1] >> 4];\n base64 += chars[(bytes[i2 + 1] & 15) << 2 | bytes[i2 + 2] >> 6];\n base64 += chars[bytes[i2 + 2] & 63];\n }\n if (len % 3 === 2) {\n base64 = base64.substring(0, base64.length - 1) + "=";\n } else if (len % 3 === 1) {\n base64 = base64.substring(0, base64.length - 2) + "==";\n }\n return base64;\n };\n const lastBlobMap = /* @__PURE__ */ new Map();\n const transparentBlobMap = /* @__PURE__ */ new Map();\n async function getTransparentBlobFor(width, height, dataURLOptions) {\n const id = `${width}-${height}`;\n if ("OffscreenCanvas" in globalThis) {\n if (transparentBlobMap.has(id)) return transparentBlobMap.get(id);\n const offscreen = new OffscreenCanvas(width, height);\n offscreen.getContext("2d");\n const blob = await offscreen.convertToBlob(dataURLOptions);\n const arrayBuffer = await blob.arrayBuffer();\n const base64 = encode(arrayBuffer);\n transparentBlobMap.set(id, base64);\n return base64;\n } else {\n return "";\n }\n }\n const worker = self;\n worker.onmessage = async function(e) {\n if ("OffscreenCanvas" in globalThis) {\n const { id, bitmap, width, height, dataURLOptions } = e.data;\n const transparentBase64 = getTransparentBlobFor(\n width,\n height,\n dataURLOptions\n );\n const offscreen = new OffscreenCanvas(width, height);\n const ctx = offscreen.getContext("2d");\n ctx.drawImage(bitmap, 0, 0);\n bitmap.close();\n const blob = await offscreen.convertToBlob(dataURLOptions);\n const type = blob.type;\n const arrayBuffer = await blob.arrayBuffer();\n const base64 = encode(arrayBuffer);\n if (!lastBlobMap.has(id) && await transparentBase64 === base64) {\n lastBlobMap.set(id, base64);\n return worker.postMessage({ id });\n }\n if (lastBlobMap.get(id) === base64) return worker.postMessage({ id });\n worker.postMessage({\n id,\n type,\n base64,\n width,\n height\n });\n lastBlobMap.set(id, base64);\n } else {\n return worker.postMessage({ id: e.data.id });\n }\n };\n})();\n//# sourceMappingURL=image-bitmap-data-url-worker-IJpC7g_b.js.map\n';
|
|
4172
|
+
const blob = typeof self !== "undefined" && self.Blob && new Blob([jsContent], { type: "text/javascript;charset=utf-8" });
|
|
4173
|
+
function WorkerWrapper(options) {
|
|
4174
|
+
let objURL;
|
|
4175
|
+
try {
|
|
4176
|
+
objURL = blob && (self.URL || self.webkitURL).createObjectURL(blob);
|
|
4177
|
+
if (!objURL) throw "";
|
|
4178
|
+
const worker = new Worker(objURL, {
|
|
4179
|
+
name: options == null ? void 0 : options.name
|
|
4180
|
+
});
|
|
4181
|
+
worker.addEventListener("error", () => {
|
|
4182
|
+
(self.URL || self.webkitURL).revokeObjectURL(objURL);
|
|
4183
|
+
});
|
|
4184
|
+
return worker;
|
|
4185
|
+
} catch (e) {
|
|
4186
|
+
return new Worker(
|
|
4187
|
+
"data:text/javascript;charset=utf-8," + encodeURIComponent(jsContent),
|
|
4188
|
+
{
|
|
4189
|
+
name: options == null ? void 0 : options.name
|
|
4190
|
+
}
|
|
4191
|
+
);
|
|
4192
|
+
} finally {
|
|
4193
|
+
objURL && (self.URL || self.webkitURL).revokeObjectURL(objURL);
|
|
4194
|
+
}
|
|
4195
|
+
}
|
|
4196
|
+
class CanvasManager {
|
|
4197
|
+
constructor(options) {
|
|
4198
|
+
__publicField(this, "pendingCanvasMutations", /* @__PURE__ */ new Map());
|
|
4199
|
+
__publicField(this, "rafStamps", { latestId: 0, invokeId: null });
|
|
4200
|
+
__publicField(this, "mirror");
|
|
4201
|
+
__publicField(this, "mutationCb");
|
|
4202
|
+
__publicField(this, "resetObservers");
|
|
4203
|
+
__publicField(this, "frozen", false);
|
|
4204
|
+
__publicField(this, "locked", false);
|
|
4205
|
+
__publicField(this, "win");
|
|
4206
|
+
__publicField(this, "processMutation", (target, mutation) => {
|
|
4207
|
+
const newFrame = this.rafStamps.invokeId && this.rafStamps.latestId !== this.rafStamps.invokeId;
|
|
4208
|
+
if (newFrame || !this.rafStamps.invokeId)
|
|
4209
|
+
this.rafStamps.invokeId = this.rafStamps.latestId;
|
|
4210
|
+
if (!this.pendingCanvasMutations.has(target)) {
|
|
4211
|
+
this.pendingCanvasMutations.set(target, []);
|
|
4212
|
+
}
|
|
4213
|
+
this.pendingCanvasMutations.get(target).push(mutation);
|
|
4214
|
+
});
|
|
4215
|
+
const {
|
|
4216
|
+
sampling = "all",
|
|
4217
|
+
win,
|
|
4218
|
+
blockClass,
|
|
4219
|
+
blockSelector,
|
|
4220
|
+
recordCanvas,
|
|
4221
|
+
dataURLOptions
|
|
4222
|
+
} = options;
|
|
4223
|
+
this.mutationCb = options.mutationCb;
|
|
4224
|
+
this.mirror = options.mirror;
|
|
4225
|
+
this.win = win;
|
|
4226
|
+
if (recordCanvas && sampling === "all")
|
|
4227
|
+
this.initCanvasMutationObserver(win, blockClass, blockSelector);
|
|
4228
|
+
if (recordCanvas && typeof sampling === "number")
|
|
4229
|
+
this.initCanvasFPSObserver(sampling, win, blockClass, blockSelector, {
|
|
4230
|
+
dataURLOptions
|
|
4231
|
+
});
|
|
4232
|
+
}
|
|
4233
|
+
reset() {
|
|
4234
|
+
this.pendingCanvasMutations.clear();
|
|
4235
|
+
this.resetObservers && this.resetObservers();
|
|
4236
|
+
}
|
|
4237
|
+
freeze() {
|
|
4238
|
+
this.frozen = true;
|
|
4239
|
+
}
|
|
4240
|
+
unfreeze() {
|
|
4241
|
+
this.frozen = false;
|
|
4242
|
+
}
|
|
4243
|
+
lock() {
|
|
4244
|
+
this.locked = true;
|
|
4245
|
+
}
|
|
4246
|
+
unlock() {
|
|
4247
|
+
this.locked = false;
|
|
4248
|
+
}
|
|
4249
|
+
initCanvasFPSObserver(fps, win, blockClass, blockSelector, options) {
|
|
4250
|
+
const canvasContextReset = initCanvasContextObserver(
|
|
4251
|
+
win,
|
|
4252
|
+
blockClass,
|
|
4253
|
+
blockSelector,
|
|
4254
|
+
true
|
|
4255
|
+
);
|
|
4256
|
+
const snapshotInProgressMap = /* @__PURE__ */ new Map();
|
|
4257
|
+
const worker = new WorkerWrapper();
|
|
4258
|
+
worker.onmessage = (e) => {
|
|
4259
|
+
const { id } = e.data;
|
|
4260
|
+
snapshotInProgressMap.set(id, false);
|
|
4261
|
+
if (!("base64" in e.data)) return;
|
|
4262
|
+
const { base64, type, width, height } = e.data;
|
|
4263
|
+
this.mutationCb({
|
|
4264
|
+
id,
|
|
4265
|
+
type: CanvasContext["2D"],
|
|
4266
|
+
commands: [
|
|
4267
|
+
{
|
|
4268
|
+
property: "clearRect",
|
|
4269
|
+
// wipe canvas
|
|
4270
|
+
args: [0, 0, width, height]
|
|
4271
|
+
},
|
|
4272
|
+
{
|
|
4273
|
+
property: "drawImage",
|
|
4274
|
+
// draws (semi-transparent) image
|
|
4275
|
+
args: [
|
|
4276
|
+
{
|
|
4277
|
+
rr_type: "ImageBitmap",
|
|
4278
|
+
args: [
|
|
4279
|
+
{
|
|
4280
|
+
rr_type: "Blob",
|
|
4281
|
+
data: [{ rr_type: "ArrayBuffer", base64 }],
|
|
4282
|
+
type
|
|
4283
|
+
}
|
|
4284
|
+
]
|
|
4285
|
+
},
|
|
4286
|
+
0,
|
|
4287
|
+
0
|
|
4288
|
+
]
|
|
4289
|
+
}
|
|
4290
|
+
]
|
|
4291
|
+
});
|
|
4292
|
+
};
|
|
4293
|
+
const timeBetweenSnapshots = 1e3 / fps;
|
|
4294
|
+
let lastSnapshotTime = 0;
|
|
4295
|
+
let rafId;
|
|
4296
|
+
const getCanvas = () => {
|
|
4297
|
+
const matchedCanvas = [];
|
|
4298
|
+
win.document.querySelectorAll("canvas").forEach((canvas) => {
|
|
4299
|
+
if (!isBlocked(canvas, blockClass, blockSelector, true)) {
|
|
4300
|
+
matchedCanvas.push(canvas);
|
|
4301
|
+
}
|
|
4302
|
+
});
|
|
4303
|
+
return matchedCanvas;
|
|
4304
|
+
};
|
|
4305
|
+
const takeCanvasSnapshots = (timestamp) => {
|
|
4306
|
+
if (lastSnapshotTime && timestamp - lastSnapshotTime < timeBetweenSnapshots) {
|
|
4307
|
+
rafId = requestAnimationFrameIn(win, takeCanvasSnapshots);
|
|
4308
|
+
return;
|
|
4309
|
+
}
|
|
4310
|
+
lastSnapshotTime = timestamp;
|
|
4311
|
+
getCanvas().forEach(async (canvas) => {
|
|
4312
|
+
var _a2;
|
|
4313
|
+
const id = this.mirror.getId(canvas);
|
|
4314
|
+
if (snapshotInProgressMap.get(id)) return;
|
|
4315
|
+
if (canvas.width === 0 || canvas.height === 0) return;
|
|
4316
|
+
snapshotInProgressMap.set(id, true);
|
|
4317
|
+
if (["webgl", "webgl2"].includes(canvas.__context)) {
|
|
4318
|
+
const context = canvas.getContext(canvas.__context);
|
|
4319
|
+
if (((_a2 = context == null ? void 0 : context.getContextAttributes()) == null ? void 0 : _a2.preserveDrawingBuffer) === false) {
|
|
4320
|
+
context.clear(context.COLOR_BUFFER_BIT);
|
|
4321
|
+
}
|
|
4322
|
+
}
|
|
4323
|
+
const bitmap = await createImageBitmap(canvas);
|
|
4324
|
+
worker.postMessage(
|
|
4325
|
+
{
|
|
4326
|
+
id,
|
|
4327
|
+
bitmap,
|
|
4328
|
+
width: canvas.width,
|
|
4329
|
+
height: canvas.height,
|
|
4330
|
+
dataURLOptions: options.dataURLOptions
|
|
4331
|
+
},
|
|
4332
|
+
[bitmap]
|
|
4333
|
+
);
|
|
4334
|
+
});
|
|
4335
|
+
rafId = requestAnimationFrameIn(win, takeCanvasSnapshots);
|
|
4336
|
+
};
|
|
4337
|
+
rafId = requestAnimationFrameIn(win, takeCanvasSnapshots);
|
|
4338
|
+
this.resetObservers = () => {
|
|
4339
|
+
canvasContextReset();
|
|
4340
|
+
win.cancelAnimationFrame(rafId);
|
|
4341
|
+
};
|
|
4342
|
+
}
|
|
4343
|
+
initCanvasMutationObserver(win, blockClass, blockSelector) {
|
|
4344
|
+
this.startRAFTimestamping();
|
|
4345
|
+
this.startPendingCanvasMutationFlusher();
|
|
4346
|
+
const canvasContextReset = initCanvasContextObserver(
|
|
4347
|
+
win,
|
|
4348
|
+
blockClass,
|
|
4349
|
+
blockSelector,
|
|
4350
|
+
false
|
|
4351
|
+
);
|
|
4352
|
+
const canvas2DReset = initCanvas2DMutationObserver(
|
|
4353
|
+
this.processMutation.bind(this),
|
|
4354
|
+
win,
|
|
4355
|
+
blockClass,
|
|
4356
|
+
blockSelector
|
|
4357
|
+
);
|
|
4358
|
+
const canvasWebGL1and2Reset = initCanvasWebGLMutationObserver(
|
|
4359
|
+
this.processMutation.bind(this),
|
|
4360
|
+
win,
|
|
4361
|
+
blockClass,
|
|
4362
|
+
blockSelector
|
|
4363
|
+
);
|
|
4364
|
+
this.resetObservers = () => {
|
|
4365
|
+
canvasContextReset();
|
|
4366
|
+
canvas2DReset();
|
|
4367
|
+
canvasWebGL1and2Reset();
|
|
4368
|
+
};
|
|
4369
|
+
}
|
|
4370
|
+
startPendingCanvasMutationFlusher() {
|
|
4371
|
+
requestAnimationFrameIn(this.win, () => this.flushPendingCanvasMutations());
|
|
4372
|
+
}
|
|
4373
|
+
startRAFTimestamping() {
|
|
4374
|
+
const setLatestRAFTimestamp = (timestamp) => {
|
|
4375
|
+
this.rafStamps.latestId = timestamp;
|
|
4376
|
+
requestAnimationFrameIn(this.win, setLatestRAFTimestamp);
|
|
4377
|
+
};
|
|
4378
|
+
requestAnimationFrameIn(this.win, setLatestRAFTimestamp);
|
|
4379
|
+
}
|
|
4380
|
+
flushPendingCanvasMutations() {
|
|
4381
|
+
this.pendingCanvasMutations.forEach(
|
|
4382
|
+
(_values, canvas) => {
|
|
4383
|
+
const id = this.mirror.getId(canvas);
|
|
4384
|
+
this.flushPendingCanvasMutationFor(canvas, id);
|
|
4385
|
+
}
|
|
4386
|
+
);
|
|
4387
|
+
requestAnimationFrameIn(this.win, () => this.flushPendingCanvasMutations());
|
|
4388
|
+
}
|
|
4389
|
+
flushPendingCanvasMutationFor(canvas, id) {
|
|
4390
|
+
if (this.frozen || this.locked) {
|
|
4391
|
+
return;
|
|
4392
|
+
}
|
|
4393
|
+
const valuesWithType = this.pendingCanvasMutations.get(canvas);
|
|
4394
|
+
if (!valuesWithType || id === -1) return;
|
|
4395
|
+
const values = valuesWithType.map((value) => {
|
|
4396
|
+
const { type: type2, ...rest } = value;
|
|
4397
|
+
return rest;
|
|
4398
|
+
});
|
|
4399
|
+
const { type } = valuesWithType[0];
|
|
4400
|
+
this.mutationCb({ id, type, commands: values });
|
|
4401
|
+
this.pendingCanvasMutations.delete(canvas);
|
|
4402
|
+
}
|
|
4403
|
+
}
|
|
4404
|
+
class StylesheetManager {
|
|
4405
|
+
constructor(options) {
|
|
4406
|
+
__publicField(this, "trackedLinkElements", /* @__PURE__ */ new WeakSet());
|
|
4407
|
+
__publicField(this, "mutationCb");
|
|
4408
|
+
__publicField(this, "adoptedStyleSheetCb");
|
|
4409
|
+
__publicField(this, "styleMirror", new StyleSheetMirror());
|
|
4410
|
+
this.mutationCb = options.mutationCb;
|
|
4411
|
+
this.adoptedStyleSheetCb = options.adoptedStyleSheetCb;
|
|
4412
|
+
}
|
|
4413
|
+
attachLinkElement(linkEl, childSn) {
|
|
4414
|
+
if ("_cssText" in childSn.attributes)
|
|
4415
|
+
this.mutationCb({
|
|
4416
|
+
adds: [],
|
|
4417
|
+
removes: [],
|
|
4418
|
+
texts: [],
|
|
4419
|
+
attributes: [
|
|
4420
|
+
{
|
|
4421
|
+
id: childSn.id,
|
|
4422
|
+
attributes: childSn.attributes
|
|
4423
|
+
}
|
|
4424
|
+
]
|
|
4425
|
+
});
|
|
4426
|
+
this.trackLinkElement(linkEl);
|
|
4427
|
+
}
|
|
4428
|
+
trackLinkElement(linkEl) {
|
|
4429
|
+
if (this.trackedLinkElements.has(linkEl)) return;
|
|
4430
|
+
this.trackedLinkElements.add(linkEl);
|
|
4431
|
+
this.trackStylesheetInLinkElement(linkEl);
|
|
4432
|
+
}
|
|
4433
|
+
adoptStyleSheets(sheets, hostId) {
|
|
4434
|
+
if (sheets.length === 0) return;
|
|
4435
|
+
const adoptedStyleSheetData = {
|
|
4436
|
+
id: hostId,
|
|
4437
|
+
styleIds: []
|
|
4438
|
+
};
|
|
4439
|
+
const styles = [];
|
|
4440
|
+
for (const sheet of sheets) {
|
|
4441
|
+
let styleId;
|
|
4442
|
+
if (!this.styleMirror.has(sheet)) {
|
|
4443
|
+
styleId = this.styleMirror.add(sheet);
|
|
4444
|
+
styles.push({
|
|
4445
|
+
styleId,
|
|
4446
|
+
rules: Array.from(sheet.rules || CSSRule, (r, index2) => ({
|
|
4447
|
+
rule: stringifyRule(r, sheet.href),
|
|
4448
|
+
index: index2
|
|
4449
|
+
}))
|
|
4450
|
+
});
|
|
4451
|
+
} else styleId = this.styleMirror.getId(sheet);
|
|
4452
|
+
adoptedStyleSheetData.styleIds.push(styleId);
|
|
4453
|
+
}
|
|
4454
|
+
if (styles.length > 0) adoptedStyleSheetData.styles = styles;
|
|
4455
|
+
this.adoptedStyleSheetCb(adoptedStyleSheetData);
|
|
4456
|
+
}
|
|
4457
|
+
reset() {
|
|
4458
|
+
this.styleMirror.reset();
|
|
4459
|
+
this.trackedLinkElements = /* @__PURE__ */ new WeakSet();
|
|
4460
|
+
}
|
|
4461
|
+
// TODO: take snapshot on stylesheet reload by applying event listener
|
|
4462
|
+
trackStylesheetInLinkElement(_linkEl) {
|
|
4463
|
+
}
|
|
4464
|
+
}
|
|
4465
|
+
class ProcessedNodeManager {
|
|
4466
|
+
constructor(win) {
|
|
4467
|
+
__publicField(this, "nodeMap", /* @__PURE__ */ new WeakMap());
|
|
4468
|
+
__publicField(this, "active", false);
|
|
4469
|
+
this.win = win;
|
|
4470
|
+
}
|
|
4471
|
+
inOtherBuffer(node, thisBuffer) {
|
|
4472
|
+
const buffers = this.nodeMap.get(node);
|
|
4473
|
+
return buffers && Array.from(buffers).some((buffer) => buffer !== thisBuffer);
|
|
4474
|
+
}
|
|
4475
|
+
add(node, buffer) {
|
|
4476
|
+
if (!this.active) {
|
|
4477
|
+
this.active = true;
|
|
4478
|
+
requestAnimationFrameIn(this.win, () => {
|
|
4479
|
+
this.nodeMap = /* @__PURE__ */ new WeakMap();
|
|
4480
|
+
this.active = false;
|
|
4481
|
+
});
|
|
4482
|
+
}
|
|
4483
|
+
this.nodeMap.set(node, (this.nodeMap.get(node) || /* @__PURE__ */ new Set()).add(buffer));
|
|
4484
|
+
}
|
|
4485
|
+
destroy() {
|
|
4486
|
+
}
|
|
4487
|
+
}
|
|
4488
|
+
let wrappedEmit;
|
|
4489
|
+
let takeFullSnapshot;
|
|
4490
|
+
let canvasManager;
|
|
4491
|
+
let recording = false;
|
|
4492
|
+
try {
|
|
4493
|
+
if (Array.from([1], (x) => x * 2)[0] !== 2) {
|
|
4494
|
+
const cleanFrame = document.createElement("iframe");
|
|
4495
|
+
document.body.appendChild(cleanFrame);
|
|
4496
|
+
Array.from = ((_a = cleanFrame.contentWindow) == null ? void 0 : _a.Array.from) || Array.from;
|
|
4497
|
+
document.body.removeChild(cleanFrame);
|
|
4498
|
+
}
|
|
4499
|
+
} catch (err) {
|
|
4500
|
+
console.debug("Unable to override Array.from", err);
|
|
4501
|
+
}
|
|
4502
|
+
const mirror = createMirror();
|
|
4503
|
+
function record(options = {}) {
|
|
4504
|
+
const {
|
|
4505
|
+
emit,
|
|
4506
|
+
checkoutEveryNms,
|
|
4507
|
+
checkoutEveryNth,
|
|
4508
|
+
blockClass = "rr-block",
|
|
4509
|
+
blockSelector = null,
|
|
4510
|
+
ignoreClass = "rr-ignore",
|
|
4511
|
+
ignoreSelector = null,
|
|
4512
|
+
maskTextClass = "rr-mask",
|
|
4513
|
+
maskTextSelector = null,
|
|
4514
|
+
inlineStylesheet = true,
|
|
4515
|
+
maskAllInputs,
|
|
4516
|
+
maskInputOptions: _maskInputOptions,
|
|
4517
|
+
slimDOMOptions: _slimDOMOptions,
|
|
4518
|
+
maskInputFn,
|
|
4519
|
+
maskTextFn,
|
|
4520
|
+
hooks,
|
|
4521
|
+
packFn,
|
|
4522
|
+
sampling = {},
|
|
4523
|
+
dataURLOptions = {},
|
|
4524
|
+
mousemoveWait,
|
|
4525
|
+
recordDOM = true,
|
|
4526
|
+
recordCanvas = false,
|
|
4527
|
+
recordCrossOriginIframes = false,
|
|
4528
|
+
recordAfter = options.recordAfter === "DOMContentLoaded" ? options.recordAfter : "load",
|
|
4529
|
+
userTriggeredOnInput = false,
|
|
4530
|
+
collectFonts = false,
|
|
4531
|
+
inlineImages = false,
|
|
4532
|
+
win: _win = window,
|
|
4533
|
+
plugins,
|
|
4534
|
+
keepIframeSrcFn = () => false,
|
|
4535
|
+
ignoreCSSAttributes = /* @__PURE__ */ new Set([]),
|
|
4536
|
+
errorHandler: errorHandler2
|
|
4537
|
+
} = options;
|
|
4538
|
+
const win = _win;
|
|
4539
|
+
registerErrorHandler(errorHandler2);
|
|
4540
|
+
const inEmittingFrame = recordCrossOriginIframes ? win.parent === win : true;
|
|
4541
|
+
let passEmitsToParent = false;
|
|
4542
|
+
if (!inEmittingFrame) {
|
|
4543
|
+
try {
|
|
4544
|
+
if (win.parent.document) {
|
|
4545
|
+
passEmitsToParent = false;
|
|
4546
|
+
}
|
|
4547
|
+
} catch (e) {
|
|
4548
|
+
passEmitsToParent = true;
|
|
4549
|
+
}
|
|
4550
|
+
}
|
|
4551
|
+
if (inEmittingFrame && !emit) {
|
|
4552
|
+
throw new Error("emit function is required");
|
|
4553
|
+
}
|
|
4554
|
+
if (!inEmittingFrame && !passEmitsToParent) {
|
|
4555
|
+
return () => {
|
|
4556
|
+
};
|
|
4557
|
+
}
|
|
4558
|
+
if (mousemoveWait !== void 0 && sampling.mousemove === void 0) {
|
|
4559
|
+
sampling.mousemove = mousemoveWait;
|
|
4560
|
+
}
|
|
4561
|
+
mirror.reset();
|
|
4562
|
+
const maskInputOptions = maskAllInputs === true ? {
|
|
4563
|
+
color: true,
|
|
4564
|
+
date: true,
|
|
4565
|
+
"datetime-local": true,
|
|
4566
|
+
email: true,
|
|
4567
|
+
month: true,
|
|
4568
|
+
number: true,
|
|
4569
|
+
range: true,
|
|
4570
|
+
search: true,
|
|
4571
|
+
tel: true,
|
|
4572
|
+
text: true,
|
|
4573
|
+
time: true,
|
|
4574
|
+
url: true,
|
|
4575
|
+
week: true,
|
|
4576
|
+
textarea: true,
|
|
4577
|
+
select: true,
|
|
4578
|
+
password: true
|
|
4579
|
+
} : _maskInputOptions !== void 0 ? _maskInputOptions : { password: true };
|
|
4580
|
+
const slimDOMOptions = slimDOMDefaults(_slimDOMOptions);
|
|
4581
|
+
polyfill(win);
|
|
4582
|
+
let lastFullSnapshotEvent;
|
|
4583
|
+
let incrementalSnapshotCount = 0;
|
|
4584
|
+
const eventProcessor = (e) => {
|
|
4585
|
+
for (const plugin of plugins || []) {
|
|
4586
|
+
if (plugin.eventProcessor) {
|
|
4587
|
+
e = plugin.eventProcessor(e);
|
|
4588
|
+
}
|
|
4589
|
+
}
|
|
4590
|
+
if (packFn && // Disable packing events which will be emitted to parent frames.
|
|
4591
|
+
!passEmitsToParent) {
|
|
4592
|
+
e = packFn(e);
|
|
4593
|
+
}
|
|
4594
|
+
return e;
|
|
4595
|
+
};
|
|
4596
|
+
wrappedEmit = (r, isCheckout) => {
|
|
4597
|
+
var _a2;
|
|
4598
|
+
const e = r;
|
|
4599
|
+
e.timestamp = nowTimestamp();
|
|
4600
|
+
if (((_a2 = mutationBuffers[0]) == null ? void 0 : _a2.isFrozen()) && e.type !== EventType.FullSnapshot && !(e.type === EventType.IncrementalSnapshot && e.data.source === IncrementalSource.Mutation)) {
|
|
4601
|
+
mutationBuffers.forEach((buf) => buf.unfreeze());
|
|
4602
|
+
}
|
|
4603
|
+
if (inEmittingFrame) {
|
|
4604
|
+
emit == null ? void 0 : emit(eventProcessor(e), isCheckout);
|
|
4605
|
+
} else if (passEmitsToParent) {
|
|
4606
|
+
const message = {
|
|
4607
|
+
type: "rrweb",
|
|
4608
|
+
event: eventProcessor(e),
|
|
4609
|
+
origin: win.location.origin,
|
|
4610
|
+
isCheckout
|
|
4611
|
+
};
|
|
4612
|
+
win.parent.postMessage(message, "*");
|
|
4613
|
+
}
|
|
4614
|
+
if (e.type === EventType.FullSnapshot) {
|
|
4615
|
+
lastFullSnapshotEvent = e;
|
|
4616
|
+
incrementalSnapshotCount = 0;
|
|
4617
|
+
} else if (e.type === EventType.IncrementalSnapshot) {
|
|
4618
|
+
if (e.data.source === IncrementalSource.Mutation && e.data.isAttachIframe) {
|
|
4619
|
+
return;
|
|
4620
|
+
}
|
|
4621
|
+
incrementalSnapshotCount++;
|
|
4622
|
+
const exceedCount = checkoutEveryNth && incrementalSnapshotCount >= checkoutEveryNth;
|
|
4623
|
+
const exceedTime = checkoutEveryNms && e.timestamp - lastFullSnapshotEvent.timestamp > checkoutEveryNms;
|
|
4624
|
+
if (exceedCount || exceedTime) {
|
|
4625
|
+
takeFullSnapshot(true);
|
|
4626
|
+
}
|
|
4627
|
+
}
|
|
4628
|
+
};
|
|
4629
|
+
const wrappedMutationEmit = (m) => {
|
|
4630
|
+
wrappedEmit({
|
|
4631
|
+
type: EventType.IncrementalSnapshot,
|
|
4632
|
+
data: {
|
|
4633
|
+
source: IncrementalSource.Mutation,
|
|
4634
|
+
...m
|
|
4635
|
+
}
|
|
4636
|
+
});
|
|
4637
|
+
};
|
|
4638
|
+
const wrappedScrollEmit = (p) => wrappedEmit({
|
|
4639
|
+
type: EventType.IncrementalSnapshot,
|
|
4640
|
+
data: {
|
|
4641
|
+
source: IncrementalSource.Scroll,
|
|
4642
|
+
...p
|
|
4643
|
+
}
|
|
4644
|
+
});
|
|
4645
|
+
const wrappedCanvasMutationEmit = (p) => wrappedEmit({
|
|
4646
|
+
type: EventType.IncrementalSnapshot,
|
|
4647
|
+
data: {
|
|
4648
|
+
source: IncrementalSource.CanvasMutation,
|
|
4649
|
+
...p
|
|
4650
|
+
}
|
|
4651
|
+
});
|
|
4652
|
+
const wrappedAdoptedStyleSheetEmit = (a) => wrappedEmit({
|
|
4653
|
+
type: EventType.IncrementalSnapshot,
|
|
4654
|
+
data: {
|
|
4655
|
+
source: IncrementalSource.AdoptedStyleSheet,
|
|
4656
|
+
...a
|
|
4657
|
+
}
|
|
4658
|
+
});
|
|
4659
|
+
const stylesheetManager = new StylesheetManager({
|
|
4660
|
+
mutationCb: wrappedMutationEmit,
|
|
4661
|
+
adoptedStyleSheetCb: wrappedAdoptedStyleSheetEmit
|
|
4662
|
+
});
|
|
4663
|
+
const iframeManager = new IframeManager({
|
|
4664
|
+
win,
|
|
4665
|
+
mirror,
|
|
4666
|
+
mutationCb: wrappedMutationEmit,
|
|
4667
|
+
stylesheetManager,
|
|
4668
|
+
recordCrossOriginIframes,
|
|
4669
|
+
wrappedEmit
|
|
4670
|
+
});
|
|
4671
|
+
for (const plugin of plugins || []) {
|
|
4672
|
+
if (plugin.getMirror)
|
|
4673
|
+
plugin.getMirror({
|
|
4674
|
+
nodeMirror: mirror,
|
|
4675
|
+
crossOriginIframeMirror: iframeManager.crossOriginIframeMirror,
|
|
4676
|
+
crossOriginIframeStyleMirror: iframeManager.crossOriginIframeStyleMirror
|
|
4677
|
+
});
|
|
4678
|
+
}
|
|
4679
|
+
const processedNodeManager = new ProcessedNodeManager(win);
|
|
4680
|
+
canvasManager = new CanvasManager({
|
|
4681
|
+
recordCanvas,
|
|
4682
|
+
mutationCb: wrappedCanvasMutationEmit,
|
|
4683
|
+
win,
|
|
4684
|
+
blockClass,
|
|
4685
|
+
blockSelector,
|
|
4686
|
+
mirror,
|
|
4687
|
+
sampling: sampling.canvas,
|
|
4688
|
+
dataURLOptions
|
|
4689
|
+
});
|
|
4690
|
+
const shadowDomManager = new ShadowDomManager({
|
|
4691
|
+
mutationCb: wrappedMutationEmit,
|
|
4692
|
+
scrollCb: wrappedScrollEmit,
|
|
4693
|
+
bypassOptions: {
|
|
4694
|
+
win,
|
|
4695
|
+
blockClass,
|
|
4696
|
+
blockSelector,
|
|
4697
|
+
maskTextClass,
|
|
4698
|
+
maskTextSelector,
|
|
4699
|
+
inlineStylesheet,
|
|
4700
|
+
maskInputOptions,
|
|
4701
|
+
dataURLOptions,
|
|
4702
|
+
maskTextFn,
|
|
4703
|
+
maskInputFn,
|
|
4704
|
+
recordCanvas,
|
|
4705
|
+
inlineImages,
|
|
4706
|
+
sampling,
|
|
4707
|
+
slimDOMOptions,
|
|
4708
|
+
iframeManager,
|
|
4709
|
+
stylesheetManager,
|
|
4710
|
+
canvasManager,
|
|
4711
|
+
keepIframeSrcFn,
|
|
4712
|
+
processedNodeManager
|
|
4713
|
+
},
|
|
4714
|
+
mirror
|
|
4715
|
+
});
|
|
4716
|
+
takeFullSnapshot = (isCheckout = false) => {
|
|
4717
|
+
if (!recordDOM) {
|
|
4718
|
+
return;
|
|
4719
|
+
}
|
|
4720
|
+
wrappedEmit(
|
|
4721
|
+
{
|
|
4722
|
+
type: EventType.Meta,
|
|
4723
|
+
data: {
|
|
4724
|
+
href: win.location.href,
|
|
4725
|
+
width: getWindowWidth(win),
|
|
4726
|
+
height: getWindowHeight(win)
|
|
4727
|
+
}
|
|
4728
|
+
},
|
|
4729
|
+
isCheckout
|
|
4730
|
+
);
|
|
4731
|
+
stylesheetManager.reset();
|
|
4732
|
+
shadowDomManager.init();
|
|
4733
|
+
mutationBuffers.forEach((buf) => buf.lock());
|
|
4734
|
+
const node = snapshot(win.document, {
|
|
4735
|
+
mirror,
|
|
4736
|
+
blockClass,
|
|
4737
|
+
blockSelector,
|
|
4738
|
+
maskTextClass,
|
|
4739
|
+
maskTextSelector,
|
|
4740
|
+
inlineStylesheet,
|
|
4741
|
+
maskAllInputs: maskInputOptions,
|
|
4742
|
+
maskTextFn,
|
|
4743
|
+
maskInputFn,
|
|
4744
|
+
slimDOM: slimDOMOptions,
|
|
4745
|
+
dataURLOptions,
|
|
4746
|
+
recordCanvas,
|
|
4747
|
+
inlineImages,
|
|
4748
|
+
onSerialize: (n) => {
|
|
4749
|
+
if (isSerializedIframe(n, mirror)) {
|
|
4750
|
+
iframeManager.addIframe(n);
|
|
4751
|
+
}
|
|
4752
|
+
if (isSerializedStylesheet(n, mirror)) {
|
|
4753
|
+
stylesheetManager.trackLinkElement(n);
|
|
4754
|
+
}
|
|
4755
|
+
if (hasShadowRoot(n)) {
|
|
4756
|
+
shadowDomManager.addShadowRoot(
|
|
4757
|
+
index.shadowRoot(n),
|
|
4758
|
+
win.document
|
|
4759
|
+
);
|
|
4760
|
+
}
|
|
4761
|
+
},
|
|
4762
|
+
onIframeLoad: (iframe, childSn) => {
|
|
4763
|
+
iframeManager.attachIframe(iframe, childSn);
|
|
4764
|
+
shadowDomManager.observeAttachShadow(iframe);
|
|
4765
|
+
},
|
|
4766
|
+
onStylesheetLoad: (linkEl, childSn) => {
|
|
4767
|
+
stylesheetManager.attachLinkElement(linkEl, childSn);
|
|
4768
|
+
},
|
|
4769
|
+
keepIframeSrcFn
|
|
4770
|
+
});
|
|
4771
|
+
if (!node) {
|
|
4772
|
+
return console.warn("Failed to snapshot the document");
|
|
4773
|
+
}
|
|
4774
|
+
wrappedEmit(
|
|
4775
|
+
{
|
|
4776
|
+
type: EventType.FullSnapshot,
|
|
4777
|
+
data: {
|
|
4778
|
+
node,
|
|
4779
|
+
initialOffset: getWindowScroll(win)
|
|
4780
|
+
}
|
|
4781
|
+
},
|
|
4782
|
+
isCheckout
|
|
4783
|
+
);
|
|
4784
|
+
mutationBuffers.forEach((buf) => buf.unlock());
|
|
4785
|
+
if (win.document.adoptedStyleSheets && win.document.adoptedStyleSheets.length > 0)
|
|
4786
|
+
stylesheetManager.adoptStyleSheets(
|
|
4787
|
+
win.document.adoptedStyleSheets,
|
|
4788
|
+
mirror.getId(win.document)
|
|
4789
|
+
);
|
|
4790
|
+
};
|
|
4791
|
+
try {
|
|
4792
|
+
const handlers = [];
|
|
4793
|
+
const observe = (doc) => {
|
|
4794
|
+
var _a2;
|
|
4795
|
+
return callbackWrapper(initObservers)(
|
|
4796
|
+
{
|
|
4797
|
+
mutationCb: wrappedMutationEmit,
|
|
4798
|
+
mousemoveCb: (positions, source) => wrappedEmit({
|
|
4799
|
+
type: EventType.IncrementalSnapshot,
|
|
4800
|
+
data: {
|
|
4801
|
+
source,
|
|
4802
|
+
positions
|
|
4803
|
+
}
|
|
4804
|
+
}),
|
|
4805
|
+
mouseInteractionCb: (d) => wrappedEmit({
|
|
4806
|
+
type: EventType.IncrementalSnapshot,
|
|
4807
|
+
data: {
|
|
4808
|
+
source: IncrementalSource.MouseInteraction,
|
|
4809
|
+
...d
|
|
4810
|
+
}
|
|
4811
|
+
}),
|
|
4812
|
+
scrollCb: wrappedScrollEmit,
|
|
4813
|
+
viewportResizeCb: (d) => wrappedEmit({
|
|
4814
|
+
type: EventType.IncrementalSnapshot,
|
|
4815
|
+
data: {
|
|
4816
|
+
source: IncrementalSource.ViewportResize,
|
|
4817
|
+
...d
|
|
4818
|
+
}
|
|
4819
|
+
}),
|
|
4820
|
+
inputCb: (v) => wrappedEmit({
|
|
4821
|
+
type: EventType.IncrementalSnapshot,
|
|
4822
|
+
data: {
|
|
4823
|
+
source: IncrementalSource.Input,
|
|
4824
|
+
...v
|
|
4825
|
+
}
|
|
4826
|
+
}),
|
|
4827
|
+
mediaInteractionCb: (p) => wrappedEmit({
|
|
4828
|
+
type: EventType.IncrementalSnapshot,
|
|
4829
|
+
data: {
|
|
4830
|
+
source: IncrementalSource.MediaInteraction,
|
|
4831
|
+
...p
|
|
4832
|
+
}
|
|
4833
|
+
}),
|
|
4834
|
+
styleSheetRuleCb: (r) => wrappedEmit({
|
|
4835
|
+
type: EventType.IncrementalSnapshot,
|
|
4836
|
+
data: {
|
|
4837
|
+
source: IncrementalSource.StyleSheetRule,
|
|
4838
|
+
...r
|
|
4839
|
+
}
|
|
4840
|
+
}),
|
|
4841
|
+
styleDeclarationCb: (r) => wrappedEmit({
|
|
4842
|
+
type: EventType.IncrementalSnapshot,
|
|
4843
|
+
data: {
|
|
4844
|
+
source: IncrementalSource.StyleDeclaration,
|
|
4845
|
+
...r
|
|
4846
|
+
}
|
|
4847
|
+
}),
|
|
4848
|
+
canvasMutationCb: wrappedCanvasMutationEmit,
|
|
4849
|
+
fontCb: (p) => wrappedEmit({
|
|
4850
|
+
type: EventType.IncrementalSnapshot,
|
|
4851
|
+
data: {
|
|
4852
|
+
source: IncrementalSource.Font,
|
|
4853
|
+
...p
|
|
4854
|
+
}
|
|
4855
|
+
}),
|
|
4856
|
+
selectionCb: (p) => {
|
|
4857
|
+
wrappedEmit({
|
|
4858
|
+
type: EventType.IncrementalSnapshot,
|
|
4859
|
+
data: {
|
|
4860
|
+
source: IncrementalSource.Selection,
|
|
4861
|
+
...p
|
|
4862
|
+
}
|
|
4863
|
+
});
|
|
4864
|
+
},
|
|
4865
|
+
customElementCb: (c) => {
|
|
4866
|
+
wrappedEmit({
|
|
4867
|
+
type: EventType.IncrementalSnapshot,
|
|
4868
|
+
data: {
|
|
4869
|
+
source: IncrementalSource.CustomElement,
|
|
4870
|
+
...c
|
|
4871
|
+
}
|
|
4872
|
+
});
|
|
4873
|
+
},
|
|
4874
|
+
blockClass,
|
|
4875
|
+
ignoreClass,
|
|
4876
|
+
ignoreSelector,
|
|
4877
|
+
maskTextClass,
|
|
4878
|
+
maskTextSelector,
|
|
4879
|
+
maskInputOptions,
|
|
4880
|
+
inlineStylesheet,
|
|
4881
|
+
sampling,
|
|
4882
|
+
recordDOM,
|
|
4883
|
+
recordCanvas,
|
|
4884
|
+
inlineImages,
|
|
4885
|
+
userTriggeredOnInput,
|
|
4886
|
+
collectFonts,
|
|
4887
|
+
win,
|
|
4888
|
+
doc,
|
|
4889
|
+
maskInputFn,
|
|
4890
|
+
maskTextFn,
|
|
4891
|
+
keepIframeSrcFn,
|
|
4892
|
+
blockSelector,
|
|
4893
|
+
slimDOMOptions,
|
|
4894
|
+
dataURLOptions,
|
|
4895
|
+
mirror,
|
|
4896
|
+
iframeManager,
|
|
4897
|
+
stylesheetManager,
|
|
4898
|
+
shadowDomManager,
|
|
4899
|
+
processedNodeManager,
|
|
4900
|
+
canvasManager,
|
|
4901
|
+
ignoreCSSAttributes,
|
|
4902
|
+
plugins: ((_a2 = plugins == null ? void 0 : plugins.filter((p) => p.observer)) == null ? void 0 : _a2.map((p) => ({
|
|
4903
|
+
observer: p.observer,
|
|
4904
|
+
options: p.options,
|
|
4905
|
+
callback: (payload) => wrappedEmit({
|
|
4906
|
+
type: EventType.Plugin,
|
|
4907
|
+
data: {
|
|
4908
|
+
plugin: p.name,
|
|
4909
|
+
payload
|
|
4910
|
+
}
|
|
4911
|
+
})
|
|
4912
|
+
}))) || []
|
|
4913
|
+
},
|
|
4914
|
+
hooks
|
|
4915
|
+
);
|
|
4916
|
+
};
|
|
4917
|
+
iframeManager.addLoadListener((iframeEl) => {
|
|
4918
|
+
try {
|
|
4919
|
+
handlers.push(observe(iframeEl.contentDocument));
|
|
4920
|
+
} catch (error) {
|
|
4921
|
+
console.warn(error);
|
|
4922
|
+
}
|
|
4923
|
+
});
|
|
4924
|
+
const init = () => {
|
|
4925
|
+
takeFullSnapshot();
|
|
4926
|
+
handlers.push(observe(win.document));
|
|
4927
|
+
recording = true;
|
|
4928
|
+
};
|
|
4929
|
+
if (["interactive", "complete"].includes(win.document.readyState)) {
|
|
4930
|
+
init();
|
|
4931
|
+
} else {
|
|
4932
|
+
handlers.push(
|
|
4933
|
+
on(
|
|
4934
|
+
"DOMContentLoaded",
|
|
4935
|
+
() => {
|
|
4936
|
+
wrappedEmit({
|
|
4937
|
+
type: EventType.DomContentLoaded,
|
|
4938
|
+
data: {}
|
|
4939
|
+
});
|
|
4940
|
+
if (recordAfter === "DOMContentLoaded") init();
|
|
4941
|
+
},
|
|
4942
|
+
win.document
|
|
4943
|
+
)
|
|
4944
|
+
);
|
|
4945
|
+
handlers.push(
|
|
4946
|
+
on(
|
|
4947
|
+
"load",
|
|
4948
|
+
() => {
|
|
4949
|
+
wrappedEmit({
|
|
4950
|
+
type: EventType.Load,
|
|
4951
|
+
data: {}
|
|
4952
|
+
});
|
|
4953
|
+
if (recordAfter === "load") init();
|
|
4954
|
+
},
|
|
4955
|
+
win
|
|
4956
|
+
)
|
|
4957
|
+
);
|
|
4958
|
+
}
|
|
4959
|
+
return () => {
|
|
4960
|
+
handlers.forEach((handler) => {
|
|
4961
|
+
try {
|
|
4962
|
+
handler();
|
|
4963
|
+
} catch (error) {
|
|
4964
|
+
const msg = String(error).toLowerCase();
|
|
4965
|
+
if (!msg.includes("cross-origin")) {
|
|
4966
|
+
console.warn(error);
|
|
4967
|
+
}
|
|
4968
|
+
}
|
|
4969
|
+
});
|
|
4970
|
+
processedNodeManager.destroy();
|
|
4971
|
+
recording = false;
|
|
4972
|
+
unregisterErrorHandler();
|
|
4973
|
+
};
|
|
4974
|
+
} catch (error) {
|
|
4975
|
+
console.warn(error);
|
|
4976
|
+
}
|
|
4977
|
+
}
|
|
4978
|
+
record.addCustomEvent = (tag, payload) => {
|
|
4979
|
+
if (!recording) {
|
|
4980
|
+
throw new Error("please add custom event after start recording");
|
|
4981
|
+
}
|
|
4982
|
+
wrappedEmit({
|
|
4983
|
+
type: EventType.Custom,
|
|
4984
|
+
data: {
|
|
4985
|
+
tag,
|
|
4986
|
+
payload
|
|
4987
|
+
}
|
|
4988
|
+
});
|
|
4989
|
+
};
|
|
4990
|
+
record.freezePage = () => {
|
|
4991
|
+
mutationBuffers.forEach((buf) => buf.freeze());
|
|
4992
|
+
};
|
|
4993
|
+
record.takeFullSnapshot = (isCheckout) => {
|
|
4994
|
+
if (!recording) {
|
|
4995
|
+
throw new Error("please take full snapshot after start recording");
|
|
4996
|
+
}
|
|
4997
|
+
takeFullSnapshot(isCheckout);
|
|
4998
|
+
};
|
|
4999
|
+
record.mirror = mirror;
|
|
5000
|
+
exports.record = record;
|
|
5001
|
+
//# sourceMappingURL=rrweb-record.cjs.map
|