@highlight-run/rrweb 2.0.8 → 2.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.
Files changed (29) hide show
  1. package/dist/plugins/console-record.js +1 -1
  2. package/dist/plugins/console-record.min.js +1 -1
  3. package/dist/plugins/console-record.min.js.map +1 -1
  4. package/dist/plugins/console-replay.min.js.map +1 -1
  5. package/dist/record/rrweb-record-pack.min.js.map +1 -1
  6. package/dist/record/rrweb-record.js +3 -3
  7. package/dist/record/rrweb-record.min.js +3 -3
  8. package/dist/record/rrweb-record.min.js.map +1 -1
  9. package/dist/replay/rrweb-replay-unpack.js +4 -4
  10. package/dist/replay/rrweb-replay-unpack.min.js +4 -4
  11. package/dist/replay/rrweb-replay-unpack.min.js.map +1 -1
  12. package/dist/replay/rrweb-replay.js +4 -4
  13. package/dist/replay/rrweb-replay.min.js +4 -4
  14. package/dist/replay/rrweb-replay.min.js.map +1 -1
  15. package/dist/rrweb-all.js +9 -9
  16. package/dist/rrweb-all.min.js +9 -9
  17. package/dist/rrweb-all.min.js.map +1 -1
  18. package/dist/rrweb.js +5 -5
  19. package/dist/rrweb.min.js +5 -5
  20. package/dist/rrweb.min.js.map +1 -1
  21. package/es/rrweb/packages/rrdom/es/virtual-dom.js +47 -24
  22. package/es/rrweb/packages/rrweb/src/record/index.js +5 -2
  23. package/es/rrweb/packages/rrweb-snapshot/es/rrweb-snapshot.js +14 -1
  24. package/lib/record/rrweb-record.js +8 -2
  25. package/lib/replay/rrweb-replay-unpack.js +57 -24
  26. package/lib/replay/rrweb-replay.js +57 -24
  27. package/lib/rrweb-all.js +65 -26
  28. package/lib/rrweb.js +65 -26
  29. package/package.json +4 -4
package/es/rrweb/packages/rrdom/es/virtual-dom.js CHANGED
@@ -535,7 +535,7 @@ function diff(oldTree, newTree, replayer, rrnodeMirror) {
535
535
  break;
536
536
  }
537
537
  case NodeType$1.Element: {
538
- const oldElement = (oldTree);
538
+ const oldElement = oldTree;
539
539
  const newRRElement = newTree;
540
540
  diffProps(oldElement, newRRElement, rrnodeMirror);
541
541
  scrollDataToApply = newRRElement.scrollData;
@@ -543,7 +543,7 @@ function diff(oldTree, newTree, replayer, rrnodeMirror) {
543
543
  switch (newRRElement.tagName) {
544
544
  case 'AUDIO':
545
545
  case 'VIDEO': {
546
- const oldMediaElement = (oldTree);
546
+ const oldMediaElement = oldTree;
547
547
  const newMediaRRElement = newRRElement;
548
548
  if (newMediaRRElement.paused !== undefined)
549
549
  newMediaRRElement.paused
@@ -558,7 +558,7 @@ function diff(oldTree, newTree, replayer, rrnodeMirror) {
558
558
  break;
559
559
  }
560
560
  case 'CANVAS':
561
- newTree.canvasMutations.forEach((canvasMutation) => replayer.applyCanvas(canvasMutation.event, canvasMutation.mutation, (oldTree)));
561
+ newTree.canvasMutations.forEach((canvasMutation) => replayer.applyCanvas(canvasMutation.event, canvasMutation.mutation, oldTree));
562
562
  break;
563
563
  case 'STYLE':
564
564
  applyVirtualStyleRulesToNode(oldElement, newTree.rules);
@@ -585,8 +585,7 @@ function diff(oldTree, newTree, replayer, rrnodeMirror) {
585
585
  scrollDataToApply && replayer.applyScroll(scrollDataToApply, true);
586
586
  inputDataToApply && replayer.applyInput(inputDataToApply);
587
587
  if (newTree.nodeName === 'IFRAME') {
588
- const oldContentDocument = (oldTree)
589
- .contentDocument;
588
+ const oldContentDocument = oldTree.contentDocument;
590
589
  const newIFrameElement = newTree;
591
590
  if (oldContentDocument) {
592
591
  const sn = rrnodeMirror.getMeta(newIFrameElement.contentDocument);
@@ -647,16 +646,26 @@ function diffChildren(oldChildren, newChildren, parentNode, replayer, rrnodeMirr
647
646
  newEndNode = newChildren[--newEndIndex];
648
647
  }
649
648
  else if (replayer.mirror.getId(oldStartNode) === rrnodeMirror.getId(newEndNode)) {
650
- parentNode.insertBefore(oldStartNode, oldEndNode.nextSibling);
651
- diff(oldStartNode, newEndNode, replayer, rrnodeMirror);
652
- oldStartNode = oldChildren[++oldStartIndex];
653
- newEndNode = newChildren[--newEndIndex];
649
+ try {
650
+ parentNode.insertBefore(oldStartNode, oldEndNode.nextSibling);
651
+ diff(oldStartNode, newEndNode, replayer, rrnodeMirror);
652
+ oldStartNode = oldChildren[++oldStartIndex];
653
+ newEndNode = newChildren[--newEndIndex];
654
+ }
655
+ catch (e) {
656
+ console.error(e, parentNode, oldStartNode, oldEndNode);
657
+ }
654
658
  }
655
659
  else if (replayer.mirror.getId(oldEndNode) === rrnodeMirror.getId(newStartNode)) {
656
- parentNode.insertBefore(oldEndNode, oldStartNode);
657
- diff(oldEndNode, newStartNode, replayer, rrnodeMirror);
658
- oldEndNode = oldChildren[--oldEndIndex];
659
- newStartNode = newChildren[++newStartIndex];
660
+ try {
661
+ parentNode.insertBefore(oldEndNode, oldStartNode);
662
+ diff(oldEndNode, newStartNode, replayer, rrnodeMirror);
663
+ oldEndNode = oldChildren[--oldEndIndex];
664
+ newStartNode = newChildren[++newStartIndex];
665
+ }
666
+ catch (e) {
667
+ console.error(e, parentNode, oldEndNode, oldStartNode);
668
+ }
660
669
  }
661
670
  else {
662
671
  if (!oldIdToIndex) {
@@ -670,21 +679,31 @@ function diffChildren(oldChildren, newChildren, parentNode, replayer, rrnodeMirr
670
679
  indexInOld = oldIdToIndex[rrnodeMirror.getId(newStartNode)];
671
680
  if (indexInOld) {
672
681
  const nodeToMove = oldChildren[indexInOld];
673
- parentNode.insertBefore(nodeToMove, oldStartNode);
674
- diff(nodeToMove, newStartNode, replayer, rrnodeMirror);
675
- oldChildren[indexInOld] = undefined;
682
+ try {
683
+ parentNode.insertBefore(nodeToMove, oldStartNode);
684
+ diff(nodeToMove, newStartNode, replayer, rrnodeMirror);
685
+ oldChildren[indexInOld] = undefined;
686
+ }
687
+ catch (e) {
688
+ console.error(e, parentNode, nodeToMove, oldStartNode);
689
+ }
676
690
  }
677
691
  else {
678
692
  const newNode = createOrGetNode(newStartNode, replayer.mirror, rrnodeMirror);
679
693
  if (((_a = replayer.mirror.getMeta(parentNode)) === null || _a === void 0 ? void 0 : _a.type) === NodeType$1.Document &&
680
694
  ((_b = replayer.mirror.getMeta(newNode)) === null || _b === void 0 ? void 0 : _b.type) === NodeType$1.Element &&
681
- (parentNode).documentElement) {
682
- parentNode.removeChild((parentNode).documentElement);
695
+ parentNode.documentElement) {
696
+ parentNode.removeChild(parentNode.documentElement);
683
697
  oldChildren[oldStartIndex] = undefined;
684
698
  oldStartNode = undefined;
685
699
  }
686
- parentNode.insertBefore(newNode, oldStartNode || null);
687
- diff(newNode, newStartNode, replayer, rrnodeMirror);
700
+ try {
701
+ parentNode.insertBefore(newNode, oldStartNode || null);
702
+ diff(newNode, newStartNode, replayer, rrnodeMirror);
703
+ }
704
+ catch (e) {
705
+ console.error(e, parentNode, newNode, oldStartNode || null);
706
+ }
688
707
  }
689
708
  newStartNode = newChildren[++newStartIndex];
690
709
  }
@@ -699,8 +718,13 @@ function diffChildren(oldChildren, newChildren, parentNode, replayer, rrnodeMirr
699
718
  });
700
719
  for (; newStartIndex <= newEndIndex; ++newStartIndex) {
701
720
  const newNode = createOrGetNode(newChildren[newStartIndex], replayer.mirror, rrnodeMirror);
702
- parentNode.insertBefore(newNode, referenceNode);
703
- diff(newNode, newChildren[newStartIndex], replayer, rrnodeMirror);
721
+ try {
722
+ parentNode.insertBefore(newNode, referenceNode);
723
+ diff(newNode, newChildren[newStartIndex], replayer, rrnodeMirror);
724
+ }
725
+ catch (e) {
726
+ console.error(e, parentNode, newNode, referenceNode);
727
+ }
704
728
  }
705
729
  }
706
730
  else if (newStartIndex > newEndIndex) {
@@ -754,8 +778,7 @@ function getNestedRule(rules, position) {
754
778
  return rule;
755
779
  }
756
780
  else {
757
- return getNestedRule((rule).cssRules[position[1]]
758
- .cssRules, position.slice(2));
781
+ return getNestedRule(rule.cssRules[position[1]].cssRules, position.slice(2));
759
782
  }
760
783
  }
761
784
  var StyleRuleType;
package/es/rrweb/packages/rrweb/src/record/index.js CHANGED
@@ -1,6 +1,6 @@
1
1
  import { createMirror, snapshot } from '../../../rrweb-snapshot/es/rrweb-snapshot.js';
2
2
  import { initObservers, mutationBuffers } from './observer.js';
3
- import { polyfill, on, getWindowWidth, getWindowHeight, isSerializedIframe, hasShadowRoot } from '../utils.js';
3
+ import { polyfill, on, getWindowWidth, getWindowHeight, isSerializedIframe, isSerializedStylesheet, hasShadowRoot } from '../utils.js';
4
4
  import { EventType, IncrementalSource } from '../types.js';
5
5
  import { IframeManager } from './iframe-manager.js';
6
6
  import { ShadowDomManager } from './shadow-dom-manager.js';
@@ -180,6 +180,9 @@ function record(options = {}) {
180
180
  if (isSerializedIframe(n, mirror)) {
181
181
  iframeManager.addIframe(n);
182
182
  }
183
+ if (isSerializedStylesheet(n, mirror)) {
184
+ stylesheetManager.addStylesheet(n);
185
+ }
183
186
  if (hasShadowRoot(n)) {
184
187
  shadowDomManager.addShadowRoot(n.shadowRoot, document);
185
188
  }
@@ -189,7 +192,7 @@ function record(options = {}) {
189
192
  shadowDomManager.observeAttachShadow(iframe);
190
193
  },
191
194
  onStylesheetLoad: (linkEl, childSn) => {
192
- this.stylesheetManager.attachStylesheet(linkEl, childSn, this.mirror);
195
+ stylesheetManager.attachStylesheet(linkEl, childSn, mirror);
193
196
  },
194
197
  keepIframeSrcFn,
195
198
  });
package/es/rrweb/packages/rrweb-snapshot/es/rrweb-snapshot.js CHANGED
@@ -924,6 +924,8 @@ function serializeNodeWithId(n, options) {
924
924
  onSerialize: onSerialize,
925
925
  onIframeLoad: onIframeLoad,
926
926
  iframeLoadTimeout: iframeLoadTimeout,
927
+ onStylesheetLoad: onStylesheetLoad,
928
+ stylesheetLoadTimeout: stylesheetLoadTimeout,
927
929
  keepIframeSrcFn: keepIframeSrcFn,
928
930
  enableStrictPrivacy: enableStrictPrivacy
929
931
  });
@@ -957,8 +959,9 @@ function serializeNodeWithId(n, options) {
957
959
  preserveWhiteSpace: preserveWhiteSpace,
958
960
  onSerialize: onSerialize,
959
961
  onIframeLoad: onIframeLoad,
960
- onStylesheetLoad: onStylesheetLoad,
961
962
  iframeLoadTimeout: iframeLoadTimeout,
963
+ onStylesheetLoad: onStylesheetLoad,
964
+ stylesheetLoadTimeout: stylesheetLoadTimeout,
962
965
  keepIframeSrcFn: keepIframeSrcFn,
963
966
  enableStrictPrivacy: enableStrictPrivacy
964
967
  });
@@ -1699,6 +1702,7 @@ function buildNode(n, options) {
1699
1702
  if (!image.currentSrc.startsWith('data:')) {
1700
1703
  image.setAttribute('rrweb-original-src', n.attributes.src);
1701
1704
  image.src = value;
1705
+ image.setAttribute('rrweb-inline-src', value);
1702
1706
  }
1703
1707
  }
1704
1708
  if (name_1 === 'rr_width') {
@@ -1727,6 +1731,15 @@ function buildNode(n, options) {
1727
1731
  for (var name_1 in n.attributes) {
1728
1732
  _loop_1(name_1);
1729
1733
  }
1734
+ if (tagName === 'img') {
1735
+ var image = node_1;
1736
+ if (!image.currentSrc.startsWith('data:')) {
1737
+ var inlineSrc = image.getAttribute('rrweb-inline-src');
1738
+ if (inlineSrc === null || inlineSrc === void 0 ? void 0 : inlineSrc.startsWith('data:')) {
1739
+ image.src = inlineSrc;
1740
+ }
1741
+ }
1742
+ }
1730
1743
  if (n.isShadowHost) {
1731
1744
  if (!node_1.shadowRoot) {
1732
1745
  node_1.attachShadow({ mode: 'open' });
package/lib/record/rrweb-record.js CHANGED
@@ -926,6 +926,8 @@ function serializeNodeWithId(n, options) {
926
926
  onSerialize: onSerialize,
927
927
  onIframeLoad: onIframeLoad,
928
928
  iframeLoadTimeout: iframeLoadTimeout,
929
+ onStylesheetLoad: onStylesheetLoad,
930
+ stylesheetLoadTimeout: stylesheetLoadTimeout,
929
931
  keepIframeSrcFn: keepIframeSrcFn,
930
932
  enableStrictPrivacy: enableStrictPrivacy
931
933
  });
@@ -959,8 +961,9 @@ function serializeNodeWithId(n, options) {
959
961
  preserveWhiteSpace: preserveWhiteSpace,
960
962
  onSerialize: onSerialize,
961
963
  onIframeLoad: onIframeLoad,
962
- onStylesheetLoad: onStylesheetLoad,
963
964
  iframeLoadTimeout: iframeLoadTimeout,
965
+ onStylesheetLoad: onStylesheetLoad,
966
+ stylesheetLoadTimeout: stylesheetLoadTimeout,
964
967
  keepIframeSrcFn: keepIframeSrcFn,
965
968
  enableStrictPrivacy: enableStrictPrivacy
966
969
  });
@@ -3228,6 +3231,9 @@ function record(options = {}) {
3228
3231
  if (isSerializedIframe(n, mirror)) {
3229
3232
  iframeManager.addIframe(n);
3230
3233
  }
3234
+ if (isSerializedStylesheet(n, mirror)) {
3235
+ stylesheetManager.addStylesheet(n);
3236
+ }
3231
3237
  if (hasShadowRoot(n)) {
3232
3238
  shadowDomManager.addShadowRoot(n.shadowRoot, document);
3233
3239
  }
@@ -3237,7 +3243,7 @@ function record(options = {}) {
3237
3243
  shadowDomManager.observeAttachShadow(iframe);
3238
3244
  },
3239
3245
  onStylesheetLoad: (linkEl, childSn) => {
3240
- this.stylesheetManager.attachStylesheet(linkEl, childSn, this.mirror);
3246
+ stylesheetManager.attachStylesheet(linkEl, childSn, mirror);
3241
3247
  },
3242
3248
  keepIframeSrcFn,
3243
3249
  });
package/lib/replay/rrweb-replay-unpack.js CHANGED
@@ -751,6 +751,7 @@ function buildNode(n, options) {
751
751
  if (!image.currentSrc.startsWith('data:')) {
752
752
  image.setAttribute('rrweb-original-src', n.attributes.src);
753
753
  image.src = value;
754
+ image.setAttribute('rrweb-inline-src', value);
754
755
  }
755
756
  }
756
757
  if (name_1 === 'rr_width') {
@@ -779,6 +780,15 @@ function buildNode(n, options) {
779
780
  for (var name_1 in n.attributes) {
780
781
  _loop_1(name_1);
781
782
  }
783
+ if (tagName === 'img') {
784
+ var image = node_1;
785
+ if (!image.currentSrc.startsWith('data:')) {
786
+ var inlineSrc = image.getAttribute('rrweb-inline-src');
787
+ if (inlineSrc === null || inlineSrc === void 0 ? void 0 : inlineSrc.startsWith('data:')) {
788
+ image.src = inlineSrc;
789
+ }
790
+ }
791
+ }
782
792
  if (n.isShadowHost) {
783
793
  if (!node_1.shadowRoot) {
784
794
  node_1.attachShadow({ mode: 'open' });
@@ -1444,7 +1454,7 @@ function diff(oldTree, newTree, replayer, rrnodeMirror) {
1444
1454
  break;
1445
1455
  }
1446
1456
  case NodeType$1.Element: {
1447
- const oldElement = (oldTree);
1457
+ const oldElement = oldTree;
1448
1458
  const newRRElement = newTree;
1449
1459
  diffProps(oldElement, newRRElement, rrnodeMirror);
1450
1460
  scrollDataToApply = newRRElement.scrollData;
@@ -1452,7 +1462,7 @@ function diff(oldTree, newTree, replayer, rrnodeMirror) {
1452
1462
  switch (newRRElement.tagName) {
1453
1463
  case 'AUDIO':
1454
1464
  case 'VIDEO': {
1455
- const oldMediaElement = (oldTree);
1465
+ const oldMediaElement = oldTree;
1456
1466
  const newMediaRRElement = newRRElement;
1457
1467
  if (newMediaRRElement.paused !== undefined)
1458
1468
  newMediaRRElement.paused
@@ -1467,7 +1477,7 @@ function diff(oldTree, newTree, replayer, rrnodeMirror) {
1467
1477
  break;
1468
1478
  }
1469
1479
  case 'CANVAS':
1470
- newTree.canvasMutations.forEach((canvasMutation) => replayer.applyCanvas(canvasMutation.event, canvasMutation.mutation, (oldTree)));
1480
+ newTree.canvasMutations.forEach((canvasMutation) => replayer.applyCanvas(canvasMutation.event, canvasMutation.mutation, oldTree));
1471
1481
  break;
1472
1482
  case 'STYLE':
1473
1483
  applyVirtualStyleRulesToNode(oldElement, newTree.rules);
@@ -1494,8 +1504,7 @@ function diff(oldTree, newTree, replayer, rrnodeMirror) {
1494
1504
  scrollDataToApply && replayer.applyScroll(scrollDataToApply, true);
1495
1505
  inputDataToApply && replayer.applyInput(inputDataToApply);
1496
1506
  if (newTree.nodeName === 'IFRAME') {
1497
- const oldContentDocument = (oldTree)
1498
- .contentDocument;
1507
+ const oldContentDocument = oldTree.contentDocument;
1499
1508
  const newIFrameElement = newTree;
1500
1509
  if (oldContentDocument) {
1501
1510
  const sn = rrnodeMirror.getMeta(newIFrameElement.contentDocument);
@@ -1556,16 +1565,26 @@ function diffChildren(oldChildren, newChildren, parentNode, replayer, rrnodeMirr
1556
1565
  newEndNode = newChildren[--newEndIndex];
1557
1566
  }
1558
1567
  else if (replayer.mirror.getId(oldStartNode) === rrnodeMirror.getId(newEndNode)) {
1559
- parentNode.insertBefore(oldStartNode, oldEndNode.nextSibling);
1560
- diff(oldStartNode, newEndNode, replayer, rrnodeMirror);
1561
- oldStartNode = oldChildren[++oldStartIndex];
1562
- newEndNode = newChildren[--newEndIndex];
1568
+ try {
1569
+ parentNode.insertBefore(oldStartNode, oldEndNode.nextSibling);
1570
+ diff(oldStartNode, newEndNode, replayer, rrnodeMirror);
1571
+ oldStartNode = oldChildren[++oldStartIndex];
1572
+ newEndNode = newChildren[--newEndIndex];
1573
+ }
1574
+ catch (e) {
1575
+ console.error(e, parentNode, oldStartNode, oldEndNode);
1576
+ }
1563
1577
  }
1564
1578
  else if (replayer.mirror.getId(oldEndNode) === rrnodeMirror.getId(newStartNode)) {
1565
- parentNode.insertBefore(oldEndNode, oldStartNode);
1566
- diff(oldEndNode, newStartNode, replayer, rrnodeMirror);
1567
- oldEndNode = oldChildren[--oldEndIndex];
1568
- newStartNode = newChildren[++newStartIndex];
1579
+ try {
1580
+ parentNode.insertBefore(oldEndNode, oldStartNode);
1581
+ diff(oldEndNode, newStartNode, replayer, rrnodeMirror);
1582
+ oldEndNode = oldChildren[--oldEndIndex];
1583
+ newStartNode = newChildren[++newStartIndex];
1584
+ }
1585
+ catch (e) {
1586
+ console.error(e, parentNode, oldEndNode, oldStartNode);
1587
+ }
1569
1588
  }
1570
1589
  else {
1571
1590
  if (!oldIdToIndex) {
@@ -1579,21 +1598,31 @@ function diffChildren(oldChildren, newChildren, parentNode, replayer, rrnodeMirr
1579
1598
  indexInOld = oldIdToIndex[rrnodeMirror.getId(newStartNode)];
1580
1599
  if (indexInOld) {
1581
1600
  const nodeToMove = oldChildren[indexInOld];
1582
- parentNode.insertBefore(nodeToMove, oldStartNode);
1583
- diff(nodeToMove, newStartNode, replayer, rrnodeMirror);
1584
- oldChildren[indexInOld] = undefined;
1601
+ try {
1602
+ parentNode.insertBefore(nodeToMove, oldStartNode);
1603
+ diff(nodeToMove, newStartNode, replayer, rrnodeMirror);
1604
+ oldChildren[indexInOld] = undefined;
1605
+ }
1606
+ catch (e) {
1607
+ console.error(e, parentNode, nodeToMove, oldStartNode);
1608
+ }
1585
1609
  }
1586
1610
  else {
1587
1611
  const newNode = createOrGetNode(newStartNode, replayer.mirror, rrnodeMirror);
1588
1612
  if (((_a = replayer.mirror.getMeta(parentNode)) === null || _a === void 0 ? void 0 : _a.type) === NodeType$1.Document &&
1589
1613
  ((_b = replayer.mirror.getMeta(newNode)) === null || _b === void 0 ? void 0 : _b.type) === NodeType$1.Element &&
1590
- (parentNode).documentElement) {
1591
- parentNode.removeChild((parentNode).documentElement);
1614
+ parentNode.documentElement) {
1615
+ parentNode.removeChild(parentNode.documentElement);
1592
1616
  oldChildren[oldStartIndex] = undefined;
1593
1617
  oldStartNode = undefined;
1594
1618
  }
1595
- parentNode.insertBefore(newNode, oldStartNode || null);
1596
- diff(newNode, newStartNode, replayer, rrnodeMirror);
1619
+ try {
1620
+ parentNode.insertBefore(newNode, oldStartNode || null);
1621
+ diff(newNode, newStartNode, replayer, rrnodeMirror);
1622
+ }
1623
+ catch (e) {
1624
+ console.error(e, parentNode, newNode, oldStartNode || null);
1625
+ }
1597
1626
  }
1598
1627
  newStartNode = newChildren[++newStartIndex];
1599
1628
  }
@@ -1608,8 +1637,13 @@ function diffChildren(oldChildren, newChildren, parentNode, replayer, rrnodeMirr
1608
1637
  });
1609
1638
  for (; newStartIndex <= newEndIndex; ++newStartIndex) {
1610
1639
  const newNode = createOrGetNode(newChildren[newStartIndex], replayer.mirror, rrnodeMirror);
1611
- parentNode.insertBefore(newNode, referenceNode);
1612
- diff(newNode, newChildren[newStartIndex], replayer, rrnodeMirror);
1640
+ try {
1641
+ parentNode.insertBefore(newNode, referenceNode);
1642
+ diff(newNode, newChildren[newStartIndex], replayer, rrnodeMirror);
1643
+ }
1644
+ catch (e) {
1645
+ console.error(e, parentNode, newNode, referenceNode);
1646
+ }
1613
1647
  }
1614
1648
  }
1615
1649
  else if (newStartIndex > newEndIndex) {
@@ -1663,8 +1697,7 @@ function getNestedRule$1(rules, position) {
1663
1697
  return rule;
1664
1698
  }
1665
1699
  else {
1666
- return getNestedRule$1((rule).cssRules[position[1]]
1667
- .cssRules, position.slice(2));
1700
+ return getNestedRule$1(rule.cssRules[position[1]].cssRules, position.slice(2));
1668
1701
  }
1669
1702
  }
1670
1703
  var StyleRuleType;
package/lib/replay/rrweb-replay.js CHANGED
@@ -751,6 +751,7 @@ function buildNode(n, options) {
751
751
  if (!image.currentSrc.startsWith('data:')) {
752
752
  image.setAttribute('rrweb-original-src', n.attributes.src);
753
753
  image.src = value;
754
+ image.setAttribute('rrweb-inline-src', value);
754
755
  }
755
756
  }
756
757
  if (name_1 === 'rr_width') {
@@ -779,6 +780,15 @@ function buildNode(n, options) {
779
780
  for (var name_1 in n.attributes) {
780
781
  _loop_1(name_1);
781
782
  }
783
+ if (tagName === 'img') {
784
+ var image = node_1;
785
+ if (!image.currentSrc.startsWith('data:')) {
786
+ var inlineSrc = image.getAttribute('rrweb-inline-src');
787
+ if (inlineSrc === null || inlineSrc === void 0 ? void 0 : inlineSrc.startsWith('data:')) {
788
+ image.src = inlineSrc;
789
+ }
790
+ }
791
+ }
782
792
  if (n.isShadowHost) {
783
793
  if (!node_1.shadowRoot) {
784
794
  node_1.attachShadow({ mode: 'open' });
@@ -1444,7 +1454,7 @@ function diff(oldTree, newTree, replayer, rrnodeMirror) {
1444
1454
  break;
1445
1455
  }
1446
1456
  case NodeType$1.Element: {
1447
- const oldElement = (oldTree);
1457
+ const oldElement = oldTree;
1448
1458
  const newRRElement = newTree;
1449
1459
  diffProps(oldElement, newRRElement, rrnodeMirror);
1450
1460
  scrollDataToApply = newRRElement.scrollData;
@@ -1452,7 +1462,7 @@ function diff(oldTree, newTree, replayer, rrnodeMirror) {
1452
1462
  switch (newRRElement.tagName) {
1453
1463
  case 'AUDIO':
1454
1464
  case 'VIDEO': {
1455
- const oldMediaElement = (oldTree);
1465
+ const oldMediaElement = oldTree;
1456
1466
  const newMediaRRElement = newRRElement;
1457
1467
  if (newMediaRRElement.paused !== undefined)
1458
1468
  newMediaRRElement.paused
@@ -1467,7 +1477,7 @@ function diff(oldTree, newTree, replayer, rrnodeMirror) {
1467
1477
  break;
1468
1478
  }
1469
1479
  case 'CANVAS':
1470
- newTree.canvasMutations.forEach((canvasMutation) => replayer.applyCanvas(canvasMutation.event, canvasMutation.mutation, (oldTree)));
1480
+ newTree.canvasMutations.forEach((canvasMutation) => replayer.applyCanvas(canvasMutation.event, canvasMutation.mutation, oldTree));
1471
1481
  break;
1472
1482
  case 'STYLE':
1473
1483
  applyVirtualStyleRulesToNode(oldElement, newTree.rules);
@@ -1494,8 +1504,7 @@ function diff(oldTree, newTree, replayer, rrnodeMirror) {
1494
1504
  scrollDataToApply && replayer.applyScroll(scrollDataToApply, true);
1495
1505
  inputDataToApply && replayer.applyInput(inputDataToApply);
1496
1506
  if (newTree.nodeName === 'IFRAME') {
1497
- const oldContentDocument = (oldTree)
1498
- .contentDocument;
1507
+ const oldContentDocument = oldTree.contentDocument;
1499
1508
  const newIFrameElement = newTree;
1500
1509
  if (oldContentDocument) {
1501
1510
  const sn = rrnodeMirror.getMeta(newIFrameElement.contentDocument);
@@ -1556,16 +1565,26 @@ function diffChildren(oldChildren, newChildren, parentNode, replayer, rrnodeMirr
1556
1565
  newEndNode = newChildren[--newEndIndex];
1557
1566
  }
1558
1567
  else if (replayer.mirror.getId(oldStartNode) === rrnodeMirror.getId(newEndNode)) {
1559
- parentNode.insertBefore(oldStartNode, oldEndNode.nextSibling);
1560
- diff(oldStartNode, newEndNode, replayer, rrnodeMirror);
1561
- oldStartNode = oldChildren[++oldStartIndex];
1562
- newEndNode = newChildren[--newEndIndex];
1568
+ try {
1569
+ parentNode.insertBefore(oldStartNode, oldEndNode.nextSibling);
1570
+ diff(oldStartNode, newEndNode, replayer, rrnodeMirror);
1571
+ oldStartNode = oldChildren[++oldStartIndex];
1572
+ newEndNode = newChildren[--newEndIndex];
1573
+ }
1574
+ catch (e) {
1575
+ console.error(e, parentNode, oldStartNode, oldEndNode);
1576
+ }
1563
1577
  }
1564
1578
  else if (replayer.mirror.getId(oldEndNode) === rrnodeMirror.getId(newStartNode)) {
1565
- parentNode.insertBefore(oldEndNode, oldStartNode);
1566
- diff(oldEndNode, newStartNode, replayer, rrnodeMirror);
1567
- oldEndNode = oldChildren[--oldEndIndex];
1568
- newStartNode = newChildren[++newStartIndex];
1579
+ try {
1580
+ parentNode.insertBefore(oldEndNode, oldStartNode);
1581
+ diff(oldEndNode, newStartNode, replayer, rrnodeMirror);
1582
+ oldEndNode = oldChildren[--oldEndIndex];
1583
+ newStartNode = newChildren[++newStartIndex];
1584
+ }
1585
+ catch (e) {
1586
+ console.error(e, parentNode, oldEndNode, oldStartNode);
1587
+ }
1569
1588
  }
1570
1589
  else {
1571
1590
  if (!oldIdToIndex) {
@@ -1579,21 +1598,31 @@ function diffChildren(oldChildren, newChildren, parentNode, replayer, rrnodeMirr
1579
1598
  indexInOld = oldIdToIndex[rrnodeMirror.getId(newStartNode)];
1580
1599
  if (indexInOld) {
1581
1600
  const nodeToMove = oldChildren[indexInOld];
1582
- parentNode.insertBefore(nodeToMove, oldStartNode);
1583
- diff(nodeToMove, newStartNode, replayer, rrnodeMirror);
1584
- oldChildren[indexInOld] = undefined;
1601
+ try {
1602
+ parentNode.insertBefore(nodeToMove, oldStartNode);
1603
+ diff(nodeToMove, newStartNode, replayer, rrnodeMirror);
1604
+ oldChildren[indexInOld] = undefined;
1605
+ }
1606
+ catch (e) {
1607
+ console.error(e, parentNode, nodeToMove, oldStartNode);
1608
+ }
1585
1609
  }
1586
1610
  else {
1587
1611
  const newNode = createOrGetNode(newStartNode, replayer.mirror, rrnodeMirror);
1588
1612
  if (((_a = replayer.mirror.getMeta(parentNode)) === null || _a === void 0 ? void 0 : _a.type) === NodeType$1.Document &&
1589
1613
  ((_b = replayer.mirror.getMeta(newNode)) === null || _b === void 0 ? void 0 : _b.type) === NodeType$1.Element &&
1590
- (parentNode).documentElement) {
1591
- parentNode.removeChild((parentNode).documentElement);
1614
+ parentNode.documentElement) {
1615
+ parentNode.removeChild(parentNode.documentElement);
1592
1616
  oldChildren[oldStartIndex] = undefined;
1593
1617
  oldStartNode = undefined;
1594
1618
  }
1595
- parentNode.insertBefore(newNode, oldStartNode || null);
1596
- diff(newNode, newStartNode, replayer, rrnodeMirror);
1619
+ try {
1620
+ parentNode.insertBefore(newNode, oldStartNode || null);
1621
+ diff(newNode, newStartNode, replayer, rrnodeMirror);
1622
+ }
1623
+ catch (e) {
1624
+ console.error(e, parentNode, newNode, oldStartNode || null);
1625
+ }
1597
1626
  }
1598
1627
  newStartNode = newChildren[++newStartIndex];
1599
1628
  }
@@ -1608,8 +1637,13 @@ function diffChildren(oldChildren, newChildren, parentNode, replayer, rrnodeMirr
1608
1637
  });
1609
1638
  for (; newStartIndex <= newEndIndex; ++newStartIndex) {
1610
1639
  const newNode = createOrGetNode(newChildren[newStartIndex], replayer.mirror, rrnodeMirror);
1611
- parentNode.insertBefore(newNode, referenceNode);
1612
- diff(newNode, newChildren[newStartIndex], replayer, rrnodeMirror);
1640
+ try {
1641
+ parentNode.insertBefore(newNode, referenceNode);
1642
+ diff(newNode, newChildren[newStartIndex], replayer, rrnodeMirror);
1643
+ }
1644
+ catch (e) {
1645
+ console.error(e, parentNode, newNode, referenceNode);
1646
+ }
1613
1647
  }
1614
1648
  }
1615
1649
  else if (newStartIndex > newEndIndex) {
@@ -1663,8 +1697,7 @@ function getNestedRule$1(rules, position) {
1663
1697
  return rule;
1664
1698
  }
1665
1699
  else {
1666
- return getNestedRule$1((rule).cssRules[position[1]]
1667
- .cssRules, position.slice(2));
1700
+ return getNestedRule$1(rule.cssRules[position[1]].cssRules, position.slice(2));
1668
1701
  }
1669
1702
  }
1670
1703
  var StyleRuleType;