allows multiple selectors for :has() and fixes joined selector space …

…detection
AlexVipond · May 21, 2021 · 12486fd · 12486fd
1 parent 55427f5
commit 12486fd
Show file tree

Hide file tree

Showing 5 changed files with 85 additions and 6 deletions.
diff --git a/src/pipes/index.ts b/src/pipes/index.ts
@@ -349,8 +349,8 @@ export function dir (directionality: 'rtl' | 'ltr') {
   return pseudoFn('dir', directionality)
 }
 
-export function has (selector: string) {
-  return pseudoFn('has', selector)
+export function has (...selectors: string[]) {
+  return pseudoFn('has', ...selectors)
 }
 
 export function hostFn (selector: string) {

diff --git a/src/pipes/util.ts b/src/pipes/util.ts
@@ -53,11 +53,16 @@ export function toFamily (selector: string): {
 //
 // Notably, this implementation doesn't support attribute values that include
 // spaces after closed square brackets, even though it's valid CSS.
-const attributeSpaceRE = /(\[[^\]]*?)(\s)(.*?\])/
-const attributeSpaceAfterClosedSquareBracketRE = /(\[[^\]]*?)(\s)(.*?\])/
+const attributeSpaceRE = /(\[[^\]]*?)(\s)(.*?\])/,
+      joinedSelectorSpaceRE = /(,\s)/
+// const attributeSpaceAfterClosedSquareBracketRE = /(\[[^\]]*?)(\s)(.*?\])/
 const ATTRIBUTE_SPACE_REPLACEMENT = 'Qx3qlPtYnH-YhkuNvdNez' // nanoid
 export function toWithoutAttributeSpaces (): Pipe {
   return selector => {
+    while(joinedSelectorSpaceRE.test(selector)) {
+      selector = selector.replace(joinedSelectorSpaceRE, `,${ATTRIBUTE_SPACE_REPLACEMENT}`)
+    }
+
     while(attributeSpaceRE.test(selector)) {
       selector = selector.replace(attributeSpaceRE, (match, before, space, after) => `${before}${ATTRIBUTE_SPACE_REPLACEMENT}${after}`)
     }

diff --git a/tests/node/pipes-util.test.ts b/tests/node/pipes-util.test.ts
@@ -39,12 +39,19 @@ suite(`toFamily parses simple targets with multiple relatives`, () => {
   )
 })
 
-suite(`toFamily parses complex targets`, () => {
+suite(`toFamily parses complex targets that include spaces inside attribute values`, () => {
   assert.equal(
     toFamily('.haha ~ ["name"="with multiple spaces"].business'),
     { relative: '.haha ~ ', selected: '["name"="with multiple spaces"].business' }
   )
 })
+
+suite(`toFamily parses complex targets that include spaces between joined selectors`, () => {
+  assert.equal(
+    toFamily('.haha ~ :not(.business, .poop)'),
+    { relative: '.haha ~ ', selected: ':not(.business, .poop)' }
+  )
+})
 
 suite(`toFamily parses complex targets with complex relatives`, () => {
   assert.equal(
@@ -60,4 +67,11 @@ suite(`toFamily doesn't support attribute values that include spaces after close
   )
 })
 
+suite(`toFamily doesn't support attribute values that include spaces after closed square brackets`, () => {
+  assert.equal(
+    toFamily('.haha ~ ["name"="] "]'),
+    { relative: '.haha ~ [\"name\"=\"] ', selected: '"]' } // Neither half is a valid selector
+  )
+})
+
 suite.run()
diff --git a/tests/node/pseudoFn.test.ts b/tests/node/pseudoFn.test.ts
@@ -38,6 +38,11 @@ suite(`has`, () => {
     pipes.has('.poop')(),
     ':has(.poop)',
   )
+
+  assert.is(
+    pipes.has('.haha', '.business')(),
+    ':has(.haha, .business)',
+  )
 })
 
 suite(`hostFn`, () => {

diff --git a/tests/node/toOperated.test.ts b/tests/node/toOperated.test.ts
@@ -41,6 +41,61 @@ suite(`toOperated`, () => {
   )
 })
 
-
+suite(`asdfasdf`, context => {
+  assert.is(
+    toOperated([
+      {
+        "id": "B6tx0Teu",
+        "pipe": "contains any element that matches a selector, which I'll specify",
+        "args": [
+          [
+            {
+              "id": "cmAQvcva",
+              "pipe": "contains any element that matches a selector, which I'll specify",
+              "args": [
+                [
+                  {
+                    "id": "vpGIBkQj",
+                    "pipe": "has a tag, which I'll specify",
+                    "args": ["poop"]
+                  },
+                  {
+                    "id": "biVhxLpU",
+                    "pipe": "has a class, which I'll specify",
+                    "args": ["stinky"]
+                  }
+                ],
+                [
+                  {
+                    "id": "eEU5_DkV",
+                    "pipe": "has an ID, which I'll specify",
+                    "args": ["fart"]
+                  }
+                ]
+              ]
+            },
+            {
+              "id": "1v7zPR5F",
+              "pipe": "has a tag, which I'll specify",
+              "args": ["butt"]
+            }
+          ]
+        ]
+      },
+      {
+        "id": "0lEZLWhl",
+        "pipe": "has a class, which I'll specify",
+        "args": ["lol"]
+      },
+      {
+        "id": "sdpEaF5l",
+        "pipe": "has a tag, which I'll specify",
+        "args": ["poopy"]
+      }
+    ]),
+    'poopy:has(butt:has(poop.stinky, #fart)).lol'
+  )
+
+})
 
 suite.run()