fix: adjust globalifySelector to not split selectors with parentheses. (#632)

gregschmit · web-flow · commit c435ebd633b9 · 2024-06-12T13:16:31.000+02:00
Fixes #501
diff --git a/src/modules/globalifySelector.ts b/src/modules/globalifySelector.ts
@@ -6,7 +6,7 @@
  * escaped combinators like `\~`.
  */
 // TODO: maybe replace this ugly pattern with an actual selector parser? (https://github.com/leaverou/parsel, 2kb)
-const combinatorPattern = /(?<!\\)(?:\\\\)*([ >+~,]\s*)(?![^[]+\]|\d)/g;
+const combinatorPattern = /(?<!\\)(?:\\\\)*([ >+~,]\s*)(?![^(]*\))(?![^[]+\]|\d)/g;
 
 export function globalifySelector(selector: string) {
   const parts = selector.trim().split(combinatorPattern);
diff --git a/test/modules/globalifySelector.test.ts b/test/modules/globalifySelector.test.ts
@@ -58,4 +58,10 @@ describe('globalifySelector', () => {
       `:global(p:nth-child(n+8):nth-child(-n+15))`,
     );
   });
+
+  it('works with selector with whitespace in parenthesis: :is()', async () => {
+    expect(globalifySelector('article :is(h1, h2)')).toBe(
+      `:global(article) :global(:is(h1, h2))`,
+    );
+  });
 });
