Merge pull request #83 from marcelduran/master

Parse attribute selectors with comma
reworkcss · May 16, 2014 · b5b5e38 · b5b5e38
2 parents 1347729 + b00ff74
commit b5b5e38
Show file tree

Hide file tree

Showing 3 changed files with 250 additions and 1 deletion.
diff --git a/index.js b/index.js
@@ -191,7 +191,15 @@ module.exports = function(css, options){
     if (!m) return;
     /* @fix Remove all comments from selectors
      * http://ostermiller.org/findcomment.html */
-    return trim(m[0]).replace(/\/\*([^*]|[\r\n]|(\*+([^*/]|[\r\n])))*\*\/+/g, '').split(/\s*,\s*/);
+    return trim(m[0])
+      .replace(/\/\*([^*]|[\r\n]|(\*+([^*/]|[\r\n])))*\*\/+/g, '')
+      .replace(/(?:"[^"]*"|'[^']*')/g, function(m) {
+        return m.replace(/,/g, '\u200C');
+      })
+      .split(/\s*,\s*/)
+      .map(function(s) {
+        return s.replace(/\u200C/g, ',');
+      });
   }
 
   /**

diff --git a/test/cases/comma-attribute.css b/test/cases/comma-attribute.css
@@ -0,0 +1,39 @@
+.foo[bar="baz,quz"] {
+  foobar: 123;
+}
+
+.bar,
+#bar[baz="qux,foo"],
+#qux {
+  foobar: 456;
+}
+
+.baz[qux=",foo"],
+.baz[qux="foo,"],
+.baz[qux="foo,bar,baz"],
+.baz[qux=",foo,bar,baz,"],
+.baz[qux=" , foo , bar , baz , "] {
+  foobar: 789;
+}
+
+.qux[foo='bar,baz'],
+.qux[bar="baz,foo"],
+#qux[foo="foobar"],
+#qux[foo=',bar,baz, '] {
+  foobar: 012;
+}
+
+#foo[foo=""],
+#foo[bar=" "],
+#foo[bar=","],
+#foo[bar=", "],
+#foo[bar=" ,"],
+#foo[bar=" , "],
+#foo[baz=''],
+#foo[qux=' '],
+#foo[qux=','],
+#foo[qux=', '],
+#foo[qux=' ,'],
+#foo[qux=' , '] {
+  foobar: 345;
+}
diff --git a/test/cases/comma-attribute.json b/test/cases/comma-attribute.json
@@ -0,0 +1,202 @@
+{
+  "type": "stylesheet",
+  "stylesheet": {
+    "rules": [
+      {
+        "type": "rule",
+        "selectors": [
+          ".foo[bar=\"baz,quz\"]"
+        ],
+        "declarations": [
+          {
+            "type": "declaration",
+            "property": "foobar",
+            "value": "123",
+            "position": {
+              "start": {
+                "line": 2,
+                "column": 3
+              },
+              "end": {
+                "line": 2,
+                "column": 14
+              },
+              "source": "comma-attribute.css"
+            }
+          }
+        ],
+        "position": {
+          "start": {
+            "line": 1,
+            "column": 1
+          },
+          "end": {
+            "line": 3,
+            "column": 2
+          },
+          "source": "comma-attribute.css"
+        }
+      },
+      {
+        "type": "rule",
+        "selectors": [
+          ".bar",
+          "#bar[baz=\"qux,foo\"]",
+          "#qux"
+        ],
+        "declarations": [
+          {
+            "type": "declaration",
+            "property": "foobar",
+            "value": "456",
+            "position": {
+              "start": {
+                "line": 8,
+                "column": 3
+              },
+              "end": {
+                "line": 8,
+                "column": 14
+              },
+              "source": "comma-attribute.css"
+            }
+          }
+        ],
+        "position": {
+          "start": {
+            "line": 5,
+            "column": 1
+          },
+          "end": {
+            "line": 9,
+            "column": 2
+          },
+          "source": "comma-attribute.css"
+        }
+      },
+      {
+        "type": "rule",
+        "selectors": [
+          ".baz[qux=\",foo\"]",
+          ".baz[qux=\"foo,\"]",
+          ".baz[qux=\"foo,bar,baz\"]",
+          ".baz[qux=\",foo,bar,baz,\"]",
+          ".baz[qux=\" , foo , bar , baz , \"]"
+        ],
+        "declarations": [
+          {
+            "type": "declaration",
+            "property": "foobar",
+            "value": "789",
+            "position": {
+              "start": {
+                "line": 16,
+                "column": 3
+              },
+              "end": {
+                "line": 16,
+                "column": 14
+              },
+              "source": "comma-attribute.css"
+            }
+          }
+        ],
+        "position": {
+          "start": {
+            "line": 11,
+            "column": 1
+          },
+          "end": {
+            "line": 17,
+            "column": 2
+          },
+          "source": "comma-attribute.css"
+        }
+      },
+      {
+        "type": "rule",
+        "selectors": [
+          ".qux[foo='bar,baz']",
+          ".qux[bar=\"baz,foo\"]",
+          "#qux[foo=\"foobar\"]",
+          "#qux[foo=',bar,baz, ']"
+        ],
+        "declarations": [
+          {
+            "type": "declaration",
+            "property": "foobar",
+            "value": "012",
+            "position": {
+              "start": {
+                "line": 23,
+                "column": 3
+              },
+              "end": {
+                "line": 23,
+                "column": 14
+              },
+              "source": "comma-attribute.css"
+            }
+          }
+        ],
+        "position": {
+          "start": {
+            "line": 19,
+            "column": 1
+          },
+          "end": {
+            "line": 24,
+            "column": 2
+          },
+          "source": "comma-attribute.css"
+        }
+      },
+      {
+        "type": "rule",
+        "selectors": [
+          "#foo[foo=\"\"]",
+          "#foo[bar=\" \"]",
+          "#foo[bar=\",\"]",
+          "#foo[bar=\", \"]",
+          "#foo[bar=\" ,\"]",
+          "#foo[bar=\" , \"]",
+          "#foo[baz='']",
+          "#foo[qux=' ']",
+          "#foo[qux=',']",
+          "#foo[qux=', ']",
+          "#foo[qux=' ,']",
+          "#foo[qux=' , ']"
+        ],
+        "declarations": [
+          {
+            "type": "declaration",
+            "property": "foobar",
+            "value": "345",
+            "position": {
+              "start": {
+                "line": 38,
+                "column": 3
+              },
+              "end": {
+                "line": 38,
+                "column": 14
+              },
+              "source": "comma-attribute.css"
+            }
+          }
+        ],
+        "position": {
+          "start": {
+            "line": 26,
+            "column": 1
+          },
+          "end": {
+            "line": 39,
+            "column": 2
+          },
+          "source": "comma-attribute.css"
+        }
+      }
+    ]
+  }
+}