Fixed: support of pseudo classes that use parenthesis

Ref postcss/postcss-selector-matches#2

Author: MoOx

CHANGELOG.md

@@ -1,3 +1,7 @@
+# 1.0.2 - 2015-06-13
+
+- Fixed: support of pseudo classes that use parenthesis
+
 # 1.0.1 - 2015-04-30
 
 - Fixed: the module now works in non babel environments

package.json

@@ -1,6 +1,6 @@
 {
   "name": "postcss-selector-not",
-  "version": "1.0.1",
+  "version": "1.0.2",
   "description": "PostCSS plugin to transform :not() W3C CSS leve 4 pseudo class to :not() CSS level 3 selectors",
   "keywords": [
     "postcss",

src/index.js

@@ -4,10 +4,10 @@ import list from "postcss/lib/list"
 import balancedMatch from "balanced-match"
 
 function explodeSelector(pseudoClass, selector) {
-  if (selector && selector.indexOf(pseudoClass) > -1) {
-    const start = `${pseudoClass}(`
-    const end = ")"
-    const matches = balancedMatch(start, end, selector)
+  const position = selector.indexOf(pseudoClass)
+  if (selector && position > -1) {
+    const pre = selector.slice(0, position)
+    const matches = balancedMatch("(", ")", selector.slice(position))
     const selectors = []
     const bodySelectors = matches.body ?
       list
@@ -17,7 +17,7 @@ function explodeSelector(pseudoClass, selector) {
     const postSelectors = matches.post ? explodeSelector(pseudoClass, matches.post) : [""]
     postSelectors.forEach(postSelector => {
       bodySelectors.forEach(bodySelector => {
-        selectors.push(`${matches.pre}${pseudoClass}(${bodySelector})${postSelector}`)
+        selectors.push(`${pre}${pseudoClass}(${bodySelector})${postSelector}`)
       })
     })
     return selectors

test/index.js

@@ -50,5 +50,11 @@ tape("postcss-selector-not", t => {
     "should transform :not() recursively"
   )
 
+  t.equal(
+    transform(".foo:not(:nth-child(-n+2), .bar) {}"),
+    ".foo:not(:nth-child(-n+2)), .foo:not(.bar) {}",
+    "should transform childs with parenthesis"
+  )
+
   t.end()
 })