fix: Fix CSS rules captured in Safari (#1253)

* fix: Fix CSS rules captured in Safari

* Apply formatting changes

* add changeset

* fix

---------

Co-authored-by: mydea <mydea@users.noreply.github.com>

packages/rrweb-snapshot/src/utils.ts

@@ -76,6 +76,17 @@ export function getCssRuleString(rule: CSSRule): string {
       // ignore
     }
   }
+  return validateStringifiedCssRule(cssStringified);
+}
+
+export function validateStringifiedCssRule(cssStringified: string): string {
+  // Safari does not escape selectors with : properly
+  if (cssStringified.includes(':')) {
+    // Replace e.g. [aa:bb] with [aa\\:bb]
+    const regex = /(\[(?:[\w-]+)[^\\])(:(?:[\w-]+)\])/gm;
+    return cssStringified.replace(regex, '$1\\$2');
+  }
+
   return cssStringified;
 }