From 557eddd85e9f7103175680c0a4c0bf52ed702869 Mon Sep 17 00:00:00 2001
From: Eoghan Murray <eoghan@getthere.ie>
Date: Tue, 21 May 2024 00:27:26 +0100
Subject: [PATCH 1/4] Fix and test for bug #1457 (Uncaught SyntaxError: Regular
 expression too large)

 - see test case which is extracted from a real world css file; the selector regex was able to traverse the curly brace as when looking for quotes, it wasn't taking into account that the start quote could be escaped
---
 packages/rrweb-snapshot/src/css.ts           |  2 +-
 packages/rrweb-snapshot/test/rebuild.test.ts | 10 ++++++++++
 2 files changed, 11 insertions(+), 1 deletion(-)

diff --git a/packages/rrweb-snapshot/src/css.ts b/packages/rrweb-snapshot/src/css.ts
index 1a3157d40f..8098509cfc 100644
--- a/packages/rrweb-snapshot/src/css.ts
+++ b/packages/rrweb-snapshot/src/css.ts
@@ -433,7 +433,7 @@ export function parse(css: string, options: ParserOptions = {}): Stylesheet {
     }
 
     // Use match logic from https://github.com/NxtChg/pieces/blob/3eb39c8287a97632e9347a24f333d52d916bc816/js/css_parser/css_parse.js#L46C1-L47C1
-    const m = match(/^(("(?:\\"|[^"])*"|'(?:\\'|[^'])*'|[^{])+)/);
+    const m = match(/^(((?<!\\)"(?:\\"|[^"])*"|(?<!\\)'(?:\\'|[^'])*'|[^{])+)/);
     if (!m) {
       return;
     }
diff --git a/packages/rrweb-snapshot/test/rebuild.test.ts b/packages/rrweb-snapshot/test/rebuild.test.ts
index 097ff0989a..daf7d10db8 100644
--- a/packages/rrweb-snapshot/test/rebuild.test.ts
+++ b/packages/rrweb-snapshot/test/rebuild.test.ts
@@ -203,4 +203,14 @@ ul li.specified c:hover img, ul li.specified c.\\:hover img {
       expect(getDuration(cachedEnd) * factor).toBeLessThan(getDuration(end));
     });
   });
+
+  it('should not incorrectly interpret escaped quotes', () => {
+    // the ':hover' in the below is a decoy which is not part of the selector,
+    // previously that part was being incorrectly consumed by the selector regex
+    const should_not_modify =
+      ".tailwind :is(.before\\:content-\\[\\'\\'\\])::before { --tw-content: \":hover\"; content: var(--tw-content); }.tailwind :is(.\\[\\&\\>li\\]\\:before\\:content-\\[\\'-\\'\\] > li)::before { color: pink; }";
+    expect(adaptCssForReplay(should_not_modify, cache)).toEqual(
+      should_not_modify,
+    );
+  });
 });

From 46b97f7a461c1b01334d108b83d7543e4951117d Mon Sep 17 00:00:00 2001
From: eoghanmurray <eoghanmurray@users.noreply.github.com>
Date: Mon, 20 May 2024 23:37:21 +0000
Subject: [PATCH 2/4] Apply formatting changes

---
 .changeset/eleven-bobcats-peel.md | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/.changeset/eleven-bobcats-peel.md b/.changeset/eleven-bobcats-peel.md
index 75f7263e1f..e3dbcf911e 100644
--- a/.changeset/eleven-bobcats-peel.md
+++ b/.changeset/eleven-bobcats-peel.md
@@ -1,6 +1,6 @@
 ---
-'rrweb-snapshot': patch
-'rrweb': patch
+"rrweb-snapshot": patch
+"rrweb": patch
 ---
 
 better support for coexistence with older libraries (e.g. MooTools & Prototype.js) which modify the in-built `Array.from` function

From a88db42c48053d3de51a225ddd8258ce9894ecb2 Mon Sep 17 00:00:00 2001
From: Eoghan Murray <eoghan@getthere.ie>
Date: Tue, 21 May 2024 00:37:44 +0100
Subject: [PATCH 3/4] Create fair-ducks-clean.md

---
 .changeset/fair-ducks-clean.md | 6 ++++++
 1 file changed, 6 insertions(+)
 create mode 100644 .changeset/fair-ducks-clean.md

diff --git a/.changeset/fair-ducks-clean.md b/.changeset/fair-ducks-clean.md
new file mode 100644
index 0000000000..19269db760
--- /dev/null
+++ b/.changeset/fair-ducks-clean.md
@@ -0,0 +1,6 @@
+---
+"rrweb-snapshot": patch
+"rrweb": patch
+---
+
+Fix and test for bug #1457 which was affecting replay of complex tailwind css

From de2363a128db61a118c8a30fd01fa570c0aa44ca Mon Sep 17 00:00:00 2001
From: Eoghan Murray <eoghan@getthere.ie>
Date: Wed, 22 May 2024 11:01:46 +0100
Subject: [PATCH 4/4] Fix @import regex bit which was stopping consumption in
 the middle of a url - need to consume quotes.

Thanks dave.kindel@pendo.io for reporting and isolating this case
---
 packages/rrweb-snapshot/src/css.ts           | 12 +++++++++++-
 packages/rrweb-snapshot/test/rebuild.test.ts |  9 +++++++++
 2 files changed, 20 insertions(+), 1 deletion(-)

diff --git a/packages/rrweb-snapshot/src/css.ts b/packages/rrweb-snapshot/src/css.ts
index 8098509cfc..220e1a1fce 100644
--- a/packages/rrweb-snapshot/src/css.ts
+++ b/packages/rrweb-snapshot/src/css.ts
@@ -864,7 +864,17 @@ export function parse(css: string, options: ParserOptions = {}): Stylesheet {
    */
 
   function _compileAtrule(name: string) {
-    const re = new RegExp('^@' + name + '\\s*([^;]+);');
+    const re = new RegExp(
+      '^@' +
+        name +
+        '\\s*((?:' +
+        [
+          '(?<!\\\\)"(?:\\\\"|[^"])*"',
+          "(?<!\\\\)'(?:\\\\'|[^'])*'",
+          '[^;]',
+        ].join('|') +
+        ')+);',
+    );
     return () => {
       const pos = position();
       const m = match(re);
diff --git a/packages/rrweb-snapshot/test/rebuild.test.ts b/packages/rrweb-snapshot/test/rebuild.test.ts
index daf7d10db8..5d544ccfa7 100644
--- a/packages/rrweb-snapshot/test/rebuild.test.ts
+++ b/packages/rrweb-snapshot/test/rebuild.test.ts
@@ -213,4 +213,13 @@ ul li.specified c:hover img, ul li.specified c.\\:hover img {
       should_not_modify,
     );
   });
+
+  it('should not incorrectly interpret at rules', () => {
+    // the ':hover' in the below is a decoy which is not part of the selector,
+    const should_not_modify =
+      '@import url("https://fonts.googleapis.com/css2?family=Rubik:ital,wght@0,400;0,500;0,700;1,400&display=:hover");';
+    expect(adaptCssForReplay(should_not_modify, cache)).toEqual(
+      should_not_modify,
+    );
+  });
 });