@screeb/rrweb 1.0.7 → 1.0.9

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.cjs CHANGED
@@ -144,6 +144,32 @@ function querySelectorAll$1(n2, selectors) {
144
144
  function mutationObserverCtor$1() {
145
145
  return getUntaintedPrototype$1("MutationObserver").constructor;
146
146
  }
147
+ function patch$1(source, name, replacement) {
148
+ try {
149
+ if (!(name in source)) {
150
+ return () => {
151
+ };
152
+ }
153
+ const original = source[name];
154
+ const wrapped = replacement(original);
155
+ if (typeof wrapped === "function") {
156
+ wrapped.prototype = wrapped.prototype || {};
157
+ Object.defineProperties(wrapped, {
158
+ __rrweb_original__: {
159
+ enumerable: false,
160
+ value: original
161
+ }
162
+ });
163
+ }
164
+ source[name] = wrapped;
165
+ return () => {
166
+ source[name] = original;
167
+ };
168
+ } catch {
169
+ return () => {
170
+ };
171
+ }
172
+ }
147
173
  const index$1 = {
148
174
  childNodes: childNodes$1,
149
175
  parentNode: parentNode$1,
@@ -156,7 +182,8 @@ const index$1 = {
156
182
  shadowRoot: shadowRoot$1,
157
183
  querySelector: querySelector$1,
158
184
  querySelectorAll: querySelectorAll$1,
159
- mutationObserver: mutationObserverCtor$1
185
+ mutationObserver: mutationObserverCtor$1,
186
+ patch: patch$1
160
187
  };
161
188
  function isElement(n2) {
162
189
  return n2.nodeType === n2.ELEMENT_NODE;
@@ -437,26 +464,97 @@ function absolutifyURLs(cssText, href) {
437
464
  }
438
465
  );
439
466
  }
440
- function normalizeCssString(cssText) {
441
- return cssText.replace(/(\/\*[^*]*\*\/)|[\s;]/g, "");
467
+ function normalizeCssString(cssText, _testNoPxNorm = false) {
468
+ if (_testNoPxNorm) {
469
+ return cssText.replace(/(\/\*[^*]*\*\/)|[\s;]/g, "");
470
+ } else {
471
+ return cssText.replace(/(\/\*[^*]*\*\/)|[\s;]/g, "").replace(/0px/g, "0");
472
+ }
442
473
  }
443
- function splitCssText(cssText, style) {
474
+ function splitCssText(cssText, style, _testNoPxNorm = false) {
444
475
  const childNodes2 = Array.from(style.childNodes);
445
476
  const splits = [];
477
+ let iterCount = 0;
446
478
  if (childNodes2.length > 1 && cssText && typeof cssText === "string") {
447
- const cssTextNorm = normalizeCssString(cssText);
479
+ let cssTextNorm = normalizeCssString(cssText, _testNoPxNorm);
480
+ const normFactor = cssTextNorm.length / cssText.length;
448
481
  for (let i2 = 1; i2 < childNodes2.length; i2++) {
449
482
  if (childNodes2[i2].textContent && typeof childNodes2[i2].textContent === "string") {
450
- const textContentNorm = normalizeCssString(childNodes2[i2].textContent);
451
- for (let j = 3; j < textContentNorm.length; j++) {
452
- const bit = textContentNorm.substring(0, j);
453
- if (cssTextNorm.split(bit).length === 2) {
454
- const splitNorm = cssTextNorm.indexOf(bit);
455
- for (let k = splitNorm; k < cssText.length; k++) {
456
- if (normalizeCssString(cssText.substring(0, k)).length === splitNorm) {
483
+ const textContentNorm = normalizeCssString(
484
+ childNodes2[i2].textContent,
485
+ _testNoPxNorm
486
+ );
487
+ const jLimit = 100;
488
+ let j = 3;
489
+ for (; j < textContentNorm.length; j++) {
490
+ if (
491
+ // keep consuming css identifiers (to get a decent chunk more quickly)
492
+ textContentNorm[j].match(/[a-zA-Z0-9]/) || // substring needs to be unique to this section
493
+ textContentNorm.indexOf(textContentNorm.substring(0, j), 1) !== -1
494
+ ) {
495
+ continue;
496
+ }
497
+ break;
498
+ }
499
+ for (; j < textContentNorm.length; j++) {
500
+ let startSubstring = textContentNorm.substring(0, j);
501
+ let cssNormSplits = cssTextNorm.split(startSubstring);
502
+ let splitNorm = -1;
503
+ if (cssNormSplits.length === 2) {
504
+ splitNorm = cssNormSplits[0].length;
505
+ } else if (cssNormSplits.length > 2 && cssNormSplits[0] === "" && childNodes2[i2 - 1].textContent !== "") {
506
+ splitNorm = cssTextNorm.indexOf(startSubstring, 1);
507
+ } else if (cssNormSplits.length === 1) {
508
+ startSubstring = startSubstring.substring(
509
+ 0,
510
+ startSubstring.length - 1
511
+ );
512
+ cssNormSplits = cssTextNorm.split(startSubstring);
513
+ if (cssNormSplits.length <= 1) {
514
+ splits.push(cssText);
515
+ return splits;
516
+ }
517
+ j = jLimit + 1;
518
+ } else if (j === textContentNorm.length - 1) {
519
+ splitNorm = cssTextNorm.indexOf(startSubstring);
520
+ }
521
+ if (cssNormSplits.length >= 2 && j > jLimit) {
522
+ const prevTextContent = childNodes2[i2 - 1].textContent;
523
+ if (prevTextContent && typeof prevTextContent === "string") {
524
+ const prevMinLength = normalizeCssString(prevTextContent).length;
525
+ splitNorm = cssTextNorm.indexOf(startSubstring, prevMinLength);
526
+ }
527
+ if (splitNorm === -1) {
528
+ splitNorm = cssNormSplits[0].length;
529
+ }
530
+ }
531
+ if (splitNorm !== -1) {
532
+ let k = Math.floor(splitNorm / normFactor);
533
+ for (; k > 0 && k < cssText.length; ) {
534
+ iterCount += 1;
535
+ if (iterCount > 50 * childNodes2.length) {
536
+ splits.push(cssText);
537
+ return splits;
538
+ }
539
+ const normPart = normalizeCssString(
540
+ cssText.substring(0, k),
541
+ _testNoPxNorm
542
+ );
543
+ if (normPart.length === splitNorm) {
457
544
  splits.push(cssText.substring(0, k));
458
545
  cssText = cssText.substring(k);
546
+ cssTextNorm = cssTextNorm.substring(splitNorm);
459
547
  break;
548
+ } else if (normPart.length < splitNorm) {
549
+ k += Math.max(
550
+ 1,
551
+ Math.floor((splitNorm - normPart.length) / normFactor)
552
+ );
553
+ } else {
554
+ k -= Math.max(
555
+ 1,
556
+ Math.floor((normPart.length - splitNorm) * normFactor)
557
+ );
460
558
  }
461
559
  }
462
560
  break;
@@ -5011,11 +5109,16 @@ function getTagName(n2) {
5011
5109
  function adaptCssForReplay(cssText, cache) {
5012
5110
  const cachedStyle = cache == null ? void 0 : cache.stylesWithHoverClass.get(cssText);
5013
5111
  if (cachedStyle) return cachedStyle;
5014
- const ast = postcss$1$1([
5015
- mediaSelectorPlugin,
5016
- pseudoClassPlugin
5017
- ]).process(cssText);
5018
- const result2 = ast.css;
5112
+ let result2 = cssText;
5113
+ try {
5114
+ const ast = postcss$1$1([
5115
+ mediaSelectorPlugin,
5116
+ pseudoClassPlugin
5117
+ ]).process(cssText);
5118
+ result2 = ast.css;
5119
+ } catch (error) {
5120
+ console.warn("Failed to adapt css for replay", error);
5121
+ }
5019
5122
  cache == null ? void 0 : cache.stylesWithHoverClass.set(cssText, result2);
5020
5123
  return result2;
5021
5124
  }
@@ -5036,11 +5139,39 @@ function applyCssSplits(n2, cssText, hackCss, cache) {
5036
5139
  while (cssTextSplits.length > 1 && cssTextSplits.length > childTextNodes.length) {
5037
5140
  cssTextSplits.splice(-2, 2, cssTextSplits.slice(-2).join(""));
5038
5141
  }
5142
+ let adaptedCss = "";
5143
+ if (hackCss) {
5144
+ adaptedCss = adaptCssForReplay(cssTextSplits.join(""), cache);
5145
+ }
5146
+ let startIndex = 0;
5039
5147
  for (let i2 = 0; i2 < childTextNodes.length; i2++) {
5148
+ if (i2 === cssTextSplits.length) {
5149
+ break;
5150
+ }
5040
5151
  const childTextNode = childTextNodes[i2];
5041
- const cssTextSection = cssTextSplits[i2];
5042
- if (childTextNode && cssTextSection) {
5043
- childTextNode.textContent = hackCss ? adaptCssForReplay(cssTextSection, cache) : cssTextSection;
5152
+ if (!hackCss) {
5153
+ childTextNode.textContent = cssTextSplits[i2];
5154
+ } else if (i2 < cssTextSplits.length - 1) {
5155
+ let endIndex = startIndex;
5156
+ let endSearch = cssTextSplits[i2 + 1].length;
5157
+ endSearch = Math.min(endSearch, 30);
5158
+ let found = false;
5159
+ for (; endSearch > 2; endSearch--) {
5160
+ const searchBit = cssTextSplits[i2 + 1].substring(0, endSearch);
5161
+ const searchIndex = adaptedCss.substring(startIndex).indexOf(searchBit);
5162
+ found = searchIndex !== -1;
5163
+ if (found) {
5164
+ endIndex += searchIndex;
5165
+ break;
5166
+ }
5167
+ }
5168
+ if (!found) {
5169
+ endIndex += cssTextSplits[i2].length;
5170
+ }
5171
+ childTextNode.textContent = adaptedCss.substring(startIndex, endIndex);
5172
+ startIndex = endIndex;
5173
+ } else {
5174
+ childTextNode.textContent = adaptedCss.substring(startIndex);
5044
5175
  }
5045
5176
  }
5046
5177
  }
@@ -10359,6 +10490,32 @@ function querySelectorAll(n2, selectors) {
10359
10490
  function mutationObserverCtor() {
10360
10491
  return getUntaintedPrototype("MutationObserver").constructor;
10361
10492
  }
10493
+ function patch(source, name, replacement) {
10494
+ try {
10495
+ if (!(name in source)) {
10496
+ return () => {
10497
+ };
10498
+ }
10499
+ const original = source[name];
10500
+ const wrapped = replacement(original);
10501
+ if (typeof wrapped === "function") {
10502
+ wrapped.prototype = wrapped.prototype || {};
10503
+ Object.defineProperties(wrapped, {
10504
+ __rrweb_original__: {
10505
+ enumerable: false,
10506
+ value: original
10507
+ }
10508
+ });
10509
+ }
10510
+ source[name] = wrapped;
10511
+ return () => {
10512
+ source[name] = original;
10513
+ };
10514
+ } catch {
10515
+ return () => {
10516
+ };
10517
+ }
10518
+ }
10362
10519
  const index = {
10363
10520
  childNodes,
10364
10521
  parentNode,
@@ -10371,7 +10528,8 @@ const index = {
10371
10528
  shadowRoot,
10372
10529
  querySelector,
10373
10530
  querySelectorAll,
10374
- mutationObserver: mutationObserverCtor
10531
+ mutationObserver: mutationObserverCtor,
10532
+ patch
10375
10533
  };
10376
10534
  function on(type, fn, target = document) {
10377
10535
  const options = { capture: true, passive: true };
@@ -10454,32 +10612,6 @@ function hookSetter(target, key, d, isRevoked, win = window) {
10454
10612
  );
10455
10613
  return () => hookSetter(target, key, original || {}, true);
10456
10614
  }
10457
- function patch(source, name, replacement) {
10458
- try {
10459
- if (!(name in source)) {
10460
- return () => {
10461
- };
10462
- }
10463
- const original = source[name];
10464
- const wrapped = replacement(original);
10465
- if (typeof wrapped === "function") {
10466
- wrapped.prototype = wrapped.prototype || {};
10467
- Object.defineProperties(wrapped, {
10468
- __rrweb_original__: {
10469
- enumerable: false,
10470
- value: original
10471
- }
10472
- });
10473
- }
10474
- source[name] = wrapped;
10475
- return () => {
10476
- source[name] = original;
10477
- };
10478
- } catch {
10479
- return () => {
10480
- };
10481
- }
10482
- }
10483
10615
  let nowTimestamp = Date.now;
10484
10616
  if (!/* @__PURE__ */ /[1-9][0-9]{12}/.test(Date.now().toString())) {
10485
10617
  nowTimestamp = () => (/* @__PURE__ */ new Date()).getTime();
@@ -10493,10 +10625,12 @@ function getWindowScroll(win) {
10493
10625
  };
10494
10626
  }
10495
10627
  function getWindowHeight(win) {
10496
- return win.innerHeight || win.document.documentElement && win.document.documentElement.clientHeight || win.document.body && win.document.body.clientHeight;
10628
+ var _a2, _b;
10629
+ return win.innerHeight || ((_a2 = win.document.documentElement) == null ? void 0 : _a2.clientHeight) || ((_b = win.document.body) == null ? void 0 : _b.clientHeight);
10497
10630
  }
10498
10631
  function getWindowWidth(win) {
10499
- return win.innerWidth || win.document.documentElement && win.document.documentElement.clientWidth || win.document.body && win.document.body.clientWidth;
10632
+ var _a2, _b;
10633
+ return win.innerWidth || ((_a2 = win.document.documentElement) == null ? void 0 : _a2.clientWidth) || ((_b = win.document.body) == null ? void 0 : _b.clientWidth);
10500
10634
  }
10501
10635
  function closestElementOfNode(node2) {
10502
10636
  if (!node2) {
@@ -10765,7 +10899,6 @@ const utils = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.definePropert
10765
10899
  return nowTimestamp;
10766
10900
  },
10767
10901
  on,
10768
- patch,
10769
10902
  polyfill: polyfill$1,
10770
10903
  queueToResolveTrees,
10771
10904
  shadowHostInDom,
@@ -11208,10 +11341,18 @@ class MutationBuffer {
11208
11341
  this.attributes.push(item);
11209
11342
  this.attributeMap.set(textarea, item);
11210
11343
  }
11211
- item.attributes.value = Array.from(
11344
+ const value = Array.from(
11212
11345
  index.childNodes(textarea),
11213
11346
  (cn) => index.textContent(cn) || ""
11214
11347
  ).join("");
11348
+ item.attributes.value = maskInputValue({
11349
+ element: textarea,
11350
+ maskInputOptions: this.maskInputOptions,
11351
+ tagName: textarea.tagName,
11352
+ type: getInputType(textarea),
11353
+ value,
11354
+ maskInputFn: this.maskInputFn
11355
+ });
11215
11356
  });
11216
11357
  __publicField(this, "processMutation", (m) => {
11217
11358
  if (isIgnored(m.target, this.mirror, this.slimDOMOptions)) {
@@ -12825,7 +12966,7 @@ class ShadowDomManager {
12825
12966
  }
12826
12967
  init() {
12827
12968
  this.reset();
12828
- this.patchAttachShadow(Element, document);
12969
+ this.patchAttachShadow(Element, this.bypassOptions.win.document);
12829
12970
  }
12830
12971
  addShadowRoot(shadowRoot2, doc) {
12831
12972
  if (!isNativeShadowDom(shadowRoot2)) return;
@@ -14016,7 +14157,7 @@ function record(options = {}) {
14016
14157
  data: {}
14017
14158
  });
14018
14159
  if (recordAfter === "DOMContentLoaded") init();
14019
- })
14160
+ }, win.document)
14020
14161
  );
14021
14162
  handlers.push(
14022
14163
  on(
@@ -15365,21 +15506,21 @@ class Replayer {
15365
15506
  if (plugin3.handler) plugin3.handler(event, isSync, { replayer: this });
15366
15507
  }
15367
15508
  this.service.send({ type: "CAST_EVENT", payload: { event } });
15368
- const last_index = this.service.state.context.events.length - 1;
15369
- if (!this.config.liveMode && event === this.service.state.context.events[last_index]) {
15509
+ const lastIndex = this.service.state.context.events.length - 1;
15510
+ if (!this.config.liveMode && event === this.service.state.context.events[lastIndex]) {
15370
15511
  const finish = () => {
15371
- if (last_index < this.service.state.context.events.length - 1) {
15512
+ if (lastIndex < this.service.state.context.events.length - 1) {
15372
15513
  return;
15373
15514
  }
15374
15515
  this.backToNormal();
15375
15516
  this.service.send("END");
15376
15517
  this.emitter.emit(ReplayerEvents.Finish);
15377
15518
  };
15378
- let finish_buffer = 50;
15519
+ let finishBuffer = 50;
15379
15520
  if (event.type === EventType.IncrementalSnapshot && event.data.source === IncrementalSource.MouseMove && event.data.positions.length) {
15380
- finish_buffer += Math.max(0, -event.data.positions[0].timeOffset);
15521
+ finishBuffer += Math.max(0, -event.data.positions[0].timeOffset);
15381
15522
  }
15382
- setTimeout(finish, finish_buffer);
15523
+ setTimeout(finish, finishBuffer);
15383
15524
  }
15384
15525
  this.emitter.emit(ReplayerEvents.EventCast, event);
15385
15526
  };
@@ -16562,18 +16703,27 @@ class Replayer {
16562
16703
  const newSn = mirror2.getMeta(
16563
16704
  target
16564
16705
  );
16706
+ const newNode = buildNodeWithSN(
16707
+ {
16708
+ ...newSn,
16709
+ attributes: {
16710
+ ...newSn.attributes,
16711
+ ...mutation.attributes
16712
+ }
16713
+ },
16714
+ {
16715
+ doc: target.ownerDocument,
16716
+ // can be Document or RRDocument
16717
+ mirror: mirror2,
16718
+ skipChild: true,
16719
+ hackCss: true,
16720
+ cache: this.cache
16721
+ }
16722
+ );
16565
16723
  Object.assign(
16566
16724
  newSn.attributes,
16567
16725
  mutation.attributes
16568
16726
  );
16569
- const newNode = buildNodeWithSN(newSn, {
16570
- doc: target.ownerDocument,
16571
- // can be Document or RRDocument
16572
- mirror: mirror2,
16573
- skipChild: true,
16574
- hackCss: true,
16575
- cache: this.cache
16576
- });
16577
16727
  const siblingNode = target.nextSibling;
16578
16728
  const parentNode2 = target.parentNode;
16579
16729
  if (newNode && parentNode2) {