Fix search color function calling in decl value

postcss · Jul 7, 2015 · cc3afce · cc3afce
1 parent 2b79521
commit cc3afce
Show file tree

Hide file tree

Showing 3 changed files with 15 additions and 2 deletions.
diff --git a/index.js b/index.js
@@ -30,11 +30,16 @@ module.exports = postcss.plugin("postcss-color-function", function() {
  * @return {String}        converted declaration value to rgba()
  */
 function transformColor(string, source) {
-  var index = string.indexOf("color(")
-  if (index == -1) {
+  var index = string.search(/(^|[^\w\-])color\(/)
+
+  if (index === -1) {
     return string
   }
 
+  // NOTE: regexp search beginning of line of non char symbol before `color(`.
+  //       Offset used for second case.
+  index = index === 0 ? index : index + 1
+
   var fn = string.slice(index)
   var balancedMatches = balanced("(", ")", fn)
   if (!balancedMatches) {

diff --git a/test/fixtures/color.css b/test/fixtures/color.css
@@ -3,4 +3,8 @@ body {
   background-color: color(red tint(50%));
   border-color: color(hsla(125, 50%, 50%, .4) hue(200));
   border-top-color: color(hwb(270, 10%, 0%) contrast(50%));
+
+  border-bottom-color: hover-color(red);
+
+  border-right-color: hover-color(color(red tint(50%)));
 }
diff --git a/test/fixtures/color.expected.css b/test/fixtures/color.expected.css
@@ -3,4 +3,8 @@ body {
   background-color: rgb(255, 128, 128);
   border-color: rgba(64, 149, 191, 0.4);
   border-top-color: rgb(248, 240, 255);
+
+  border-bottom-color: hover-color(red);
+
+  border-right-color: hover-color(rgb(255, 128, 128));
 }