Ensure we are ignoring commas within strings

 - the added test case didn't actually fail before due to some voodoo with `m.replace(/,/g, '\u200C');` which took me ages to figure out.  Anyhow I figure test and refactor is good in case we replace the css library

Author: eoghanmurray

packages/rrweb-snapshot/src/css.ts

@@ -440,21 +440,21 @@ export function parse(css: string, options: ParserOptions = {}): Stylesheet {
         const char = input[i];
         currentPart += char;
 
-        if (char === '(' && !currentStringChar) {
+        const hasStringEscape = i > 0 && input[i - 1] === '\\';
+
+        if (currentStringChar) {
+          if (currentStringChar === char && !hasStringEscape) {
+            currentStringChar = null;
+          }
+        } else if (char === '(') {
           nestedLevel++;
-        } else if (char === ')' && !currentStringChar) {
+        } else if (char === ')') {
           nestedLevel--;
         } else if (char === ',' && nestedLevel === 0) {
           parts.push(currentPart.slice(0, -1).trim());
           currentPart = '';
         } else if ('\'"'.includes(char)) {
-          if (currentStringChar === char) {
-            if (!(i > 0 && input[i - 1] === '\\')) {
-              currentStringChar = null;
-            }
-          } else {
-            currentStringChar = char;
-          }
+          currentStringChar = char;
         }
       }
 

packages/rrweb-snapshot/test/css.test.ts

@@ -150,6 +150,18 @@ li[attr="weirder\\"("] a:hover, li[attr="weirder\\")"] a {
     expect(
       (weirderresult.stylesheet!.rules[0] as Rule)!.selectors!.length,
     ).toEqual(2);
+
+    const commainstrresult = parse(
+      `
+li[attr="has,comma"] a:hover {
+  background-color: red;
+}
+`,
+    );
+    expect(
+      (commainstrresult.stylesheet!.rules[0] as Rule)!.selectors!.length,
+    ).toEqual(1);
+
   });
 
   it('parses imports with quotes correctly', () => {