@posthog/rrweb-record 0.0.10 → 0.0.11
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/dist/rrweb-record.cjs +51 -148
- package/dist/rrweb-record.cjs.map +1 -1
- package/dist/rrweb-record.js +51 -148
- package/dist/rrweb-record.js.map +1 -1
- package/dist/rrweb-record.umd.cjs +51 -148
- package/dist/rrweb-record.umd.cjs.map +2 -2
- package/dist/rrweb-record.umd.min.cjs +35 -35
- package/dist/rrweb-record.umd.min.cjs.map +3 -3
- package/package.json +1 -1
package/dist/rrweb-record.cjs
CHANGED
|
@@ -7,7 +7,7 @@ var _a;
|
|
|
7
7
|
var __defProp$1 = Object.defineProperty;
|
|
8
8
|
var __defNormalProp$1 = (obj, key, value) => key in obj ? __defProp$1(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
9
9
|
var __publicField$1 = (obj, key, value) => __defNormalProp$1(obj, typeof key !== "symbol" ? key + "" : key, value);
|
|
10
|
-
var NodeType$
|
|
10
|
+
var NodeType$1$1 = /* @__PURE__ */ ((NodeType2) => {
|
|
11
11
|
NodeType2[NodeType2["Document"] = 0] = "Document";
|
|
12
12
|
NodeType2[NodeType2["DocumentType"] = 1] = "DocumentType";
|
|
13
13
|
NodeType2[NodeType2["Element"] = 2] = "Element";
|
|
@@ -15,7 +15,7 @@ var NodeType$3 = /* @__PURE__ */ ((NodeType2) => {
|
|
|
15
15
|
NodeType2[NodeType2["CDATA"] = 4] = "CDATA";
|
|
16
16
|
NodeType2[NodeType2["Comment"] = 5] = "Comment";
|
|
17
17
|
return NodeType2;
|
|
18
|
-
})(NodeType$
|
|
18
|
+
})(NodeType$1$1 || {});
|
|
19
19
|
const testableAccessors$1 = {
|
|
20
20
|
Node: ["childNodes", "parentNode", "parentElement", "textContent"],
|
|
21
21
|
ShadowRoot: ["host", "styleSheets"],
|
|
@@ -239,13 +239,9 @@ function stringifyStylesheet(s2) {
|
|
|
239
239
|
if (!rules2) {
|
|
240
240
|
return null;
|
|
241
241
|
}
|
|
242
|
-
let sheetHref = s2.href;
|
|
243
|
-
if (!sheetHref && s2.ownerNode && s2.ownerNode.ownerDocument) {
|
|
244
|
-
sheetHref = s2.ownerNode.ownerDocument.location.href;
|
|
245
|
-
}
|
|
246
242
|
const stringifiedRules = Array.from(
|
|
247
243
|
rules2,
|
|
248
|
-
(rule2) => stringifyRule(rule2,
|
|
244
|
+
(rule2) => stringifyRule(rule2, s2.href)
|
|
249
245
|
).join("");
|
|
250
246
|
return fixBrowserCompatibilityIssuesInCSS(stringifiedRules);
|
|
251
247
|
} catch (error) {
|
|
@@ -458,90 +454,6 @@ function absolutifyURLs(cssText, href) {
|
|
|
458
454
|
}
|
|
459
455
|
);
|
|
460
456
|
}
|
|
461
|
-
const normalizationCache = /* @__PURE__ */ new Map();
|
|
462
|
-
const splitCache = /* @__PURE__ */ new Map();
|
|
463
|
-
function normalizeCssString(cssText) {
|
|
464
|
-
if (!normalizationCache.has(cssText)) {
|
|
465
|
-
const normalized = cssText.replace(/(\/\*[^*]*\*\/)|[\s;]/g, "");
|
|
466
|
-
normalizationCache.set(cssText, normalized);
|
|
467
|
-
}
|
|
468
|
-
return normalizationCache.get(cssText);
|
|
469
|
-
}
|
|
470
|
-
function splitCssText(cssText, style) {
|
|
471
|
-
const og = cssText;
|
|
472
|
-
if (splitCache.has(cssText)) {
|
|
473
|
-
return splitCache.get(cssText);
|
|
474
|
-
}
|
|
475
|
-
const childNodes2 = Array.from(style.childNodes);
|
|
476
|
-
const splits = [];
|
|
477
|
-
let iterLimit = 0;
|
|
478
|
-
if (childNodes2.length > 1 && cssText && typeof cssText === "string") {
|
|
479
|
-
let cssTextNorm = normalizeCssString(cssText);
|
|
480
|
-
const normFactor = cssTextNorm.length / cssText.length;
|
|
481
|
-
for (let i2 = 1; i2 < childNodes2.length; i2++) {
|
|
482
|
-
if (childNodes2[i2].textContent && typeof childNodes2[i2].textContent === "string") {
|
|
483
|
-
const textContentNorm = normalizeCssString(childNodes2[i2].textContent);
|
|
484
|
-
let j = 3;
|
|
485
|
-
for (; j < textContentNorm.length; j++) {
|
|
486
|
-
if (
|
|
487
|
-
// keep consuming css identifiers (to get a decent chunk more quickly)
|
|
488
|
-
textContentNorm[j].match(/[a-zA-Z0-9]/) || // substring needs to be unique to this section
|
|
489
|
-
textContentNorm.indexOf(textContentNorm.substring(0, j), 1) !== -1
|
|
490
|
-
) {
|
|
491
|
-
continue;
|
|
492
|
-
}
|
|
493
|
-
break;
|
|
494
|
-
}
|
|
495
|
-
for (; j < textContentNorm.length; j++) {
|
|
496
|
-
const bit = textContentNorm.substring(0, j);
|
|
497
|
-
const bits = cssTextNorm.split(bit);
|
|
498
|
-
let splitNorm = -1;
|
|
499
|
-
if (bits.length === 2) {
|
|
500
|
-
splitNorm = cssTextNorm.indexOf(bit);
|
|
501
|
-
} else if (bits.length > 2 && bits[0] === "" && childNodes2[i2 - 1].textContent !== "") {
|
|
502
|
-
splitNorm = cssTextNorm.indexOf(bit, 1);
|
|
503
|
-
}
|
|
504
|
-
if (splitNorm !== -1) {
|
|
505
|
-
let k = Math.floor(splitNorm / normFactor);
|
|
506
|
-
for (; k > 0 && k < cssText.length; ) {
|
|
507
|
-
iterLimit += 1;
|
|
508
|
-
if (iterLimit > 50 * childNodes2.length) {
|
|
509
|
-
splits.push(cssText);
|
|
510
|
-
return splits;
|
|
511
|
-
}
|
|
512
|
-
const normPart = normalizeCssString(cssText.substring(0, k));
|
|
513
|
-
if (normPart.length === splitNorm) {
|
|
514
|
-
splits.push(cssText.substring(0, k));
|
|
515
|
-
cssText = cssText.substring(k);
|
|
516
|
-
cssTextNorm = cssTextNorm.substring(splitNorm);
|
|
517
|
-
break;
|
|
518
|
-
} else if (normPart.length < splitNorm) {
|
|
519
|
-
k += Math.max(
|
|
520
|
-
1,
|
|
521
|
-
Math.floor((splitNorm - normPart.length) / normFactor)
|
|
522
|
-
);
|
|
523
|
-
} else {
|
|
524
|
-
k -= Math.max(
|
|
525
|
-
1,
|
|
526
|
-
Math.floor((normPart.length - splitNorm) * normFactor)
|
|
527
|
-
);
|
|
528
|
-
}
|
|
529
|
-
}
|
|
530
|
-
break;
|
|
531
|
-
}
|
|
532
|
-
}
|
|
533
|
-
}
|
|
534
|
-
}
|
|
535
|
-
}
|
|
536
|
-
splits.push(cssText);
|
|
537
|
-
if (og) {
|
|
538
|
-
splitCache.set(og, splits);
|
|
539
|
-
}
|
|
540
|
-
return splits;
|
|
541
|
-
}
|
|
542
|
-
function markCssSplits(cssText, style) {
|
|
543
|
-
return splitCssText(cssText, style).join("/* rr_split */");
|
|
544
|
-
}
|
|
545
457
|
let _id = 1;
|
|
546
458
|
const tagNameRegex = new RegExp("[^a-z0-9-_:]");
|
|
547
459
|
const IGNORED_NODE = -2;
|
|
@@ -800,28 +712,27 @@ function serializeNode(n2, options) {
|
|
|
800
712
|
inlineImages,
|
|
801
713
|
recordCanvas,
|
|
802
714
|
keepIframeSrcFn,
|
|
803
|
-
newlyAddedElement = false
|
|
804
|
-
cssCaptured = false
|
|
715
|
+
newlyAddedElement = false
|
|
805
716
|
} = options;
|
|
806
717
|
const rootId = getRootId(doc, mirror2);
|
|
807
718
|
switch (n2.nodeType) {
|
|
808
719
|
case n2.DOCUMENT_NODE:
|
|
809
720
|
if (n2.compatMode !== "CSS1Compat") {
|
|
810
721
|
return {
|
|
811
|
-
type: NodeType$
|
|
722
|
+
type: NodeType$1$1.Document,
|
|
812
723
|
childNodes: [],
|
|
813
724
|
compatMode: n2.compatMode
|
|
814
725
|
// probably "BackCompat"
|
|
815
726
|
};
|
|
816
727
|
} else {
|
|
817
728
|
return {
|
|
818
|
-
type: NodeType$
|
|
729
|
+
type: NodeType$1$1.Document,
|
|
819
730
|
childNodes: []
|
|
820
731
|
};
|
|
821
732
|
}
|
|
822
733
|
case n2.DOCUMENT_TYPE_NODE:
|
|
823
734
|
return {
|
|
824
|
-
type: NodeType$
|
|
735
|
+
type: NodeType$1$1.DocumentType,
|
|
825
736
|
name: n2.name,
|
|
826
737
|
publicId: n2.publicId,
|
|
827
738
|
systemId: n2.systemId,
|
|
@@ -847,18 +758,17 @@ function serializeNode(n2, options) {
|
|
|
847
758
|
doc,
|
|
848
759
|
needsMask,
|
|
849
760
|
maskTextFn,
|
|
850
|
-
rootId
|
|
851
|
-
cssCaptured
|
|
761
|
+
rootId
|
|
852
762
|
});
|
|
853
763
|
case n2.CDATA_SECTION_NODE:
|
|
854
764
|
return {
|
|
855
|
-
type: NodeType$
|
|
765
|
+
type: NodeType$1$1.CDATA,
|
|
856
766
|
textContent: "",
|
|
857
767
|
rootId
|
|
858
768
|
};
|
|
859
769
|
case n2.COMMENT_NODE:
|
|
860
770
|
return {
|
|
861
|
-
type: NodeType$
|
|
771
|
+
type: NodeType$1$1.Comment,
|
|
862
772
|
textContent: index$1.textContent(n2) || "",
|
|
863
773
|
rootId
|
|
864
774
|
};
|
|
@@ -872,26 +782,37 @@ function getRootId(doc, mirror2) {
|
|
|
872
782
|
return docId === 1 ? void 0 : docId;
|
|
873
783
|
}
|
|
874
784
|
function serializeTextNode(n2, options) {
|
|
875
|
-
|
|
785
|
+
var _a2;
|
|
786
|
+
const { needsMask, maskTextFn, rootId } = options;
|
|
876
787
|
const parent = index$1.parentNode(n2);
|
|
877
788
|
const parentTagName = parent && parent.tagName;
|
|
878
|
-
let
|
|
789
|
+
let text = index$1.textContent(n2);
|
|
879
790
|
const isStyle = parentTagName === "STYLE" ? true : void 0;
|
|
880
791
|
const isScript = parentTagName === "SCRIPT" ? true : void 0;
|
|
881
|
-
if (
|
|
882
|
-
|
|
883
|
-
|
|
884
|
-
|
|
885
|
-
|
|
886
|
-
|
|
792
|
+
if (isStyle && text) {
|
|
793
|
+
try {
|
|
794
|
+
if (n2.nextSibling || n2.previousSibling) {
|
|
795
|
+
} else if ((_a2 = parent.sheet) == null ? void 0 : _a2.cssRules) {
|
|
796
|
+
text = stringifyStylesheet(parent.sheet);
|
|
797
|
+
}
|
|
798
|
+
} catch (err) {
|
|
799
|
+
console.warn(
|
|
800
|
+
`Cannot get CSS styles from text's parentNode. Error: ${err}`,
|
|
801
|
+
n2
|
|
802
|
+
);
|
|
887
803
|
}
|
|
804
|
+
text = absolutifyURLs(text, getHref(options.doc));
|
|
888
805
|
}
|
|
889
|
-
if (
|
|
890
|
-
|
|
806
|
+
if (isScript) {
|
|
807
|
+
text = "SCRIPT_PLACEHOLDER";
|
|
808
|
+
}
|
|
809
|
+
if (!isStyle && !isScript && text && needsMask) {
|
|
810
|
+
text = maskTextFn ? maskTextFn(text, index$1.parentElement(n2)) : text.replace(/[\S]/g, "*");
|
|
891
811
|
}
|
|
892
812
|
return {
|
|
893
|
-
type: NodeType$
|
|
894
|
-
textContent:
|
|
813
|
+
type: NodeType$1$1.Text,
|
|
814
|
+
textContent: text || "",
|
|
815
|
+
isStyle,
|
|
895
816
|
rootId
|
|
896
817
|
};
|
|
897
818
|
}
|
|
@@ -952,14 +873,12 @@ function serializeElementNode(n2, options) {
|
|
|
952
873
|
}
|
|
953
874
|
}
|
|
954
875
|
}
|
|
955
|
-
if (tagName === "style" && n2.sheet
|
|
956
|
-
|
|
876
|
+
if (tagName === "style" && n2.sheet && // TODO: Currently we only try to get dynamic stylesheet when it is an empty style element
|
|
877
|
+
!(n2.innerText || index$1.textContent(n2) || "").trim().length) {
|
|
878
|
+
const cssText = stringifyStylesheet(
|
|
957
879
|
n2.sheet
|
|
958
880
|
);
|
|
959
881
|
if (cssText) {
|
|
960
|
-
if (n2.childNodes.length > 1) {
|
|
961
|
-
cssText = markCssSplits(cssText, n2);
|
|
962
|
-
}
|
|
963
882
|
attributes._cssText = cssText;
|
|
964
883
|
}
|
|
965
884
|
}
|
|
@@ -1094,7 +1013,7 @@ function serializeElementNode(n2, options) {
|
|
|
1094
1013
|
} catch (e2) {
|
|
1095
1014
|
}
|
|
1096
1015
|
return {
|
|
1097
|
-
type: NodeType$
|
|
1016
|
+
type: NodeType$1$1.Element,
|
|
1098
1017
|
tagName,
|
|
1099
1018
|
attributes,
|
|
1100
1019
|
childNodes: [],
|
|
@@ -1112,9 +1031,9 @@ function lowerIfExists(maybeAttr) {
|
|
|
1112
1031
|
}
|
|
1113
1032
|
}
|
|
1114
1033
|
function slimDOMExcluded(sn, slimDOMOptions) {
|
|
1115
|
-
if (slimDOMOptions.comment && sn.type === NodeType$
|
|
1034
|
+
if (slimDOMOptions.comment && sn.type === NodeType$1$1.Comment) {
|
|
1116
1035
|
return true;
|
|
1117
|
-
} else if (sn.type === NodeType$
|
|
1036
|
+
} else if (sn.type === NodeType$1$1.Element) {
|
|
1118
1037
|
if (slimDOMOptions.script && // script tag
|
|
1119
1038
|
(sn.tagName === "script" || // (module)preload link
|
|
1120
1039
|
sn.tagName === "link" && (sn.attributes.rel === "preload" && sn.attributes.as === "script" || sn.attributes.rel === "modulepreload") || // prefetch link
|
|
@@ -1166,8 +1085,7 @@ function serializeNodeWithId(n2, options) {
|
|
|
1166
1085
|
onStylesheetLoad,
|
|
1167
1086
|
stylesheetLoadTimeout = 5e3,
|
|
1168
1087
|
keepIframeSrcFn = () => false,
|
|
1169
|
-
newlyAddedElement = false
|
|
1170
|
-
cssCaptured = false
|
|
1088
|
+
newlyAddedElement = false
|
|
1171
1089
|
} = options;
|
|
1172
1090
|
let { needsMask } = options;
|
|
1173
1091
|
let { preserveWhiteSpace = true } = options;
|
|
@@ -1194,8 +1112,7 @@ function serializeNodeWithId(n2, options) {
|
|
|
1194
1112
|
inlineImages,
|
|
1195
1113
|
recordCanvas,
|
|
1196
1114
|
keepIframeSrcFn,
|
|
1197
|
-
newlyAddedElement
|
|
1198
|
-
cssCaptured
|
|
1115
|
+
newlyAddedElement
|
|
1199
1116
|
});
|
|
1200
1117
|
if (!_serializedNode) {
|
|
1201
1118
|
console.warn(n2, "not serialized");
|
|
@@ -1204,7 +1121,7 @@ function serializeNodeWithId(n2, options) {
|
|
|
1204
1121
|
let id;
|
|
1205
1122
|
if (mirror2.hasNode(n2)) {
|
|
1206
1123
|
id = mirror2.getId(n2);
|
|
1207
|
-
} else if (slimDOMExcluded(_serializedNode, slimDOMOptions) || !preserveWhiteSpace && _serializedNode.type === NodeType$
|
|
1124
|
+
} else if (slimDOMExcluded(_serializedNode, slimDOMOptions) || !preserveWhiteSpace && _serializedNode.type === NodeType$1$1.Text && !_serializedNode.isStyle && !_serializedNode.textContent.replace(/^\s+|\s+$/gm, "").length) {
|
|
1208
1125
|
id = IGNORED_NODE;
|
|
1209
1126
|
} else {
|
|
1210
1127
|
id = genId();
|
|
@@ -1218,15 +1135,15 @@ function serializeNodeWithId(n2, options) {
|
|
|
1218
1135
|
onSerialize(n2);
|
|
1219
1136
|
}
|
|
1220
1137
|
let recordChild = !skipChild;
|
|
1221
|
-
if (serializedNode.type === NodeType$
|
|
1138
|
+
if (serializedNode.type === NodeType$1$1.Element) {
|
|
1222
1139
|
recordChild = recordChild && !serializedNode.needBlock;
|
|
1223
1140
|
delete serializedNode.needBlock;
|
|
1224
1141
|
const shadowRootEl = index$1.shadowRoot(n2);
|
|
1225
1142
|
if (shadowRootEl && isNativeShadowDom(shadowRootEl))
|
|
1226
1143
|
serializedNode.isShadowHost = true;
|
|
1227
1144
|
}
|
|
1228
|
-
if ((serializedNode.type === NodeType$
|
|
1229
|
-
if (slimDOMOptions.headWhitespace && serializedNode.type === NodeType$
|
|
1145
|
+
if ((serializedNode.type === NodeType$1$1.Document || serializedNode.type === NodeType$1$1.Element) && recordChild) {
|
|
1146
|
+
if (slimDOMOptions.headWhitespace && serializedNode.type === NodeType$1$1.Element && serializedNode.tagName === "head") {
|
|
1230
1147
|
preserveWhiteSpace = false;
|
|
1231
1148
|
}
|
|
1232
1149
|
const bypassOptions = {
|
|
@@ -1252,14 +1169,10 @@ function serializeNodeWithId(n2, options) {
|
|
|
1252
1169
|
iframeLoadTimeout,
|
|
1253
1170
|
onStylesheetLoad,
|
|
1254
1171
|
stylesheetLoadTimeout,
|
|
1255
|
-
keepIframeSrcFn
|
|
1256
|
-
cssCaptured: false
|
|
1172
|
+
keepIframeSrcFn
|
|
1257
1173
|
};
|
|
1258
|
-
if (serializedNode.type === NodeType$
|
|
1174
|
+
if (serializedNode.type === NodeType$1$1.Element && serializedNode.tagName === "textarea" && serializedNode.attributes.value !== void 0) ;
|
|
1259
1175
|
else {
|
|
1260
|
-
if (serializedNode.type === NodeType$3.Element && serializedNode.attributes._cssText !== void 0 && typeof serializedNode.attributes._cssText === "string") {
|
|
1261
|
-
bypassOptions.cssCaptured = true;
|
|
1262
|
-
}
|
|
1263
1176
|
for (const childN of Array.from(index$1.childNodes(n2))) {
|
|
1264
1177
|
const serializedChildNode = serializeNodeWithId(childN, bypassOptions);
|
|
1265
1178
|
if (serializedChildNode) {
|
|
@@ -1282,7 +1195,7 @@ function serializeNodeWithId(n2, options) {
|
|
|
1282
1195
|
if (parent && isShadowRoot(parent) && isNativeShadowDom(parent)) {
|
|
1283
1196
|
serializedNode.isShadow = true;
|
|
1284
1197
|
}
|
|
1285
|
-
if (serializedNode.type === NodeType$
|
|
1198
|
+
if (serializedNode.type === NodeType$1$1.Element && serializedNode.tagName === "iframe") {
|
|
1286
1199
|
onceIframeLoaded(
|
|
1287
1200
|
n2,
|
|
1288
1201
|
() => {
|
|
@@ -1324,7 +1237,7 @@ function serializeNodeWithId(n2, options) {
|
|
|
1324
1237
|
iframeLoadTimeout
|
|
1325
1238
|
);
|
|
1326
1239
|
}
|
|
1327
|
-
if (serializedNode.type === NodeType$
|
|
1240
|
+
if (serializedNode.type === NodeType$1$1.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")) {
|
|
1328
1241
|
onceStylesheetLoaded(
|
|
1329
1242
|
n2,
|
|
1330
1243
|
() => {
|
|
@@ -9966,18 +9879,9 @@ class MutationBuffer {
|
|
|
9966
9879
|
};
|
|
9967
9880
|
const pushAdd = (n2) => {
|
|
9968
9881
|
const parent = index.parentNode(n2);
|
|
9969
|
-
if (!parent || !inDom(n2)) {
|
|
9882
|
+
if (!parent || !inDom(n2) || parent.tagName === "TEXTAREA") {
|
|
9970
9883
|
return;
|
|
9971
9884
|
}
|
|
9972
|
-
let cssCaptured = false;
|
|
9973
|
-
if (n2.nodeType === Node.TEXT_NODE) {
|
|
9974
|
-
const parentTag = parent.tagName;
|
|
9975
|
-
if (parentTag === "TEXTAREA") {
|
|
9976
|
-
return;
|
|
9977
|
-
} else if (parentTag === "STYLE" && this.addedSet.has(parent)) {
|
|
9978
|
-
cssCaptured = true;
|
|
9979
|
-
}
|
|
9980
|
-
}
|
|
9981
9885
|
const parentId = isShadowRoot(parent) ? this.mirror.getId(getShadowHost(n2)) : this.mirror.getId(parent);
|
|
9982
9886
|
const nextId = getNextId(n2);
|
|
9983
9887
|
if (parentId === -1 || nextId === -1) {
|
|
@@ -10019,8 +9923,7 @@ class MutationBuffer {
|
|
|
10019
9923
|
},
|
|
10020
9924
|
onStylesheetLoad: (link, childSn) => {
|
|
10021
9925
|
this.stylesheetManager.attachLinkElement(link, childSn);
|
|
10022
|
-
}
|
|
10023
|
-
cssCaptured
|
|
9926
|
+
}
|
|
10024
9927
|
});
|
|
10025
9928
|
if (sn) {
|
|
10026
9929
|
adds.push({
|