Fix that timer.addAction reverses order when splicing multiple events at same timestamp (#611)

* Add test for event ordering utilizing final html testing method added by Justin (with thanks) * Found an error where two mutation events had the same timestamp, but one removed a node added in the other. The `actions.splice` method was reversing their order and triggering a 'Node with id [...] not found' error
2021-08-09 17:03:24 +01:00
parent 188f31eea9
commit 009d73ab79
4 changed files with 218 additions and 1 deletions
--- a/packages/rrweb/test/snapshots/replayer.test.ts.snap
+++ b/packages/rrweb/test/snapshots/replayer.test.ts.snap
@@ -1,5 +1,56 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP

+exports[`ordering-events 1`] = `
+"file-frame-1
+<html>
+  <head>
+    <meta http-equiv=\\"Content-Type\\" content=\\"text/html; charset=UTF-8\\" />
+  </head>
+  <body>
+    <div class=\\"replayer-wrapper\\">
+      <div class=\\"replayer-mouse\\"></div>
+      <canvas
+        class=\\"replayer-mouse-tail\\"
+        width=\\"1000\\"
+        height=\\"800\\"
+        style=\\"display: inherit\\"
+      ></canvas
+      ><iframe
+        sandbox=\\"allow-same-origin\\"
+        scrolling=\\"no\\"
+        width=\\"1000\\"
+        height=\\"800\\"
+        style=\\"display: inherit; pointer-events: none\\"
+      ></iframe>
+    </div>
+  </body>
+</html>
+
+
+file-frame-2
+<!DOCTYPE html>
+<html lang=\\"en\\">
+  <head>
+    <meta http-equiv=\\"Content-Type\\" content=\\"text/html; charset=UTF-8\\" />
+    <link rel=\\"stylesheet\\" type=\\"text/css\\" href=\\"file-cid-0\\" />
+  </head>
+  <body>
+    <span>Final - correct</span>
+  </body>
+</html>
+
+
+file-cid-0
+@charset \\"utf-8\\";
+
+.rr-block { background: rgb(204, 204, 204); }
+
+noscript { display: none !important; }
+
+html.rrweb-paused * { animation-play-state: paused !important; }
+"
+`;
+
 exports[`style-sheet-remove-events-play-at-2500 1`] = `
 "file-frame-1
 <html>