fix: unit parsing (#58)

Author: evilebottnawi

lib/unit.js

@@ -4,68 +4,117 @@ var dot = ".".charCodeAt(0);
 var exp = "e".charCodeAt(0);
 var EXP = "E".charCodeAt(0);
 
+// Check if three code points would start a number
+// https://www.w3.org/TR/css-syntax-3/#starts-with-a-number
+function likeNumber(value) {
+  var code = value.charCodeAt(0);
+  var nextCode;
+
+  if (code === plus || code === minus) {
+    nextCode = value.charCodeAt(1);
+
+    if (nextCode >= 48 && nextCode <= 57) {
+      return true;
+    }
+
+    var nextNextCode = value.charCodeAt(2);
+
+    if (nextCode === dot && nextNextCode >= 48 && nextNextCode <= 57) {
+      return true;
+    }
+
+    return false;
+  }
+
+  if (code === dot) {
+    nextCode = value.charCodeAt(1);
+
+    if (nextCode >= 48 && nextCode <= 57) {
+      return true;
+    }
+
+    return false;
+  }
+
+  if (code >= 48 && code <= 57) {
+    return true;
+  }
+
+  return false;
+}
+
+// Consume a number
+// https://www.w3.org/TR/css-syntax-3/#consume-number
 module.exports = function(value) {
   var pos = 0;
   var length = value.length;
-  var dotted = false;
-  var sciPos = -1;
-  var containsNumber = false;
   var code;
+  var nextCode;
+  var nextNextCode;
+
+  if (length === 0 || !likeNumber(value)) {
+    return false;
+  }
+
+  code = value.charCodeAt(pos);
+
+  if (code === plus || code === minus) {
+    pos++;
+  }
 
   while (pos < length) {
     code = value.charCodeAt(pos);
 
-    if (code >= 48 && code <= 57) {
-      containsNumber = true;
-    } else if (code === exp || code === EXP) {
-      if (sciPos > -1 || pos === 0) {
-        break;
-      }
-      sciPos = pos;
+    if (code < 48 || code > 57) {
+      break;
+    }
 
-      var nextCode = value.charCodeAt(pos + 1);
+    pos += 1;
+  }
 
-      if (
-        nextCode === plus ||
-        nextCode === minus ||
-        (nextCode >= 48 && nextCode <= 57)
-      ) {
-        if (nextCode === plus || nextCode === minus) {
-          var nextNextCode = value.charCodeAt(pos + 2);
+  code = value.charCodeAt(pos);
+  nextCode = value.charCodeAt(pos + 1);
 
-          if (nextNextCode < 48 || nextNextCode > 57) {
-            break;
-          }
+  if (code === dot && nextCode >= 48 && nextCode <= 57) {
+    pos += 2;
 
-          pos += 1;
-        }
+    while (pos < length) {
+      code = value.charCodeAt(pos);
 
-        pos += 1;
-      } else {
+      if (code < 48 || code > 57) {
         break;
       }
-    } else if (code === dot) {
-      if (dotted) {
-        break;
-      }
-      dotted = true;
-    } else if (code === plus || code === minus) {
-      if (pos !== 0) {
-        break;
-      }
-    } else {
-      break;
-    }
 
-    pos += 1;
+      pos += 1;
+    }
   }
 
-  if (sciPos + 1 === pos) pos--;
+  code = value.charCodeAt(pos);
+  nextCode = value.charCodeAt(pos + 1);
+  nextNextCode = value.charCodeAt(pos + 2);
+
+  if (
+    (code === exp || code === EXP) &&
+    ((nextCode >= 48 && nextCode <= 57) ||
+      ((nextCode === plus || nextCode === minus) &&
+        nextNextCode >= 48 &&
+        nextNextCode <= 57))
+  ) {
+    pos += nextCode === plus || nextCode === minus ? 3 : 2;
+
+    while (pos < length) {
+      code = value.charCodeAt(pos);
 
-  return containsNumber
-    ? {
-        number: value.slice(0, pos),
-        unit: value.slice(pos)
+      if (code < 48 || code > 57) {
+        break;
       }
-    : false;
+
+      pos += 1;
+    }
+  }
+
+  return {
+    number: value.slice(0, pos),
+    unit: value.slice(pos)
+  };
 };

test/unit.js

@@ -12,15 +12,15 @@ var tests = [
   },
   {
     fixture: "2.",
-    expected: { number: "2.", unit: "" }
+    expected: { number: "2", unit: "." }
   },
   {
     fixture: "+2.",
-    expected: { number: "+2.", unit: "" }
+    expected: { number: "+2", unit: "." }
   },
   {
     fixture: "-2.",
-    expected: { number: "-2.", unit: "" }
+    expected: { number: "-2", unit: "." }
   },
   {
     fixture: "+-2.",
@@ -149,6 +149,126 @@ var tests = [
   {
     fixture: "-100.1e-1e-1px",
     expected: { number: "-100.1e-1", unit: "e-1px" }
+  },
+  {
+    fixture: ".5px",
+    expected: { number: ".5", unit: "px" }
+  },
+  {
+    fixture: "+.5px",
+    expected: { number: "+.5", unit: "px" }
+  },
+  {
+    fixture: "-.5px",
+    expected: { number: "-.5", unit: "px" }
+  },
+  {
+    fixture: ".5e1px",
+    expected: { number: ".5e1", unit: "px" }
+  },
+  {
+    fixture: "-.5e1px",
+    expected: { number: "-.5e1", unit: "px" }
+  },
+  {
+    fixture: "+.5e1px",
+    expected: { number: "+.5e1", unit: "px" }
+  },
+  {
+    fixture: ".5e1e1px",
+    expected: { number: ".5e1", unit: "e1px" }
+  },
+  {
+    fixture: ".5.5px",
+    expected: { number: ".5", unit: ".5px" }
+  },
+  {
+    fixture: "1e",
+    expected: { number: "1", unit: "e" }
+  },
+  {
+    fixture: "1e1",
+    expected: { number: "1e1", unit: "" }
+  },
+  {
+    fixture: "1ee",
+    expected: { number: "1", unit: "ee" }
+  },
+  {
+    fixture: "1e+",
+    expected: { number: "1", unit: "e+" }
+  },
+  {
+    fixture: "1e-",
+    expected: { number: "1", unit: "e-" }
+  },
+  {
+    fixture: "1e+1",
+    expected: { number: "1e+1", unit: "" }
+  },
+  {
+    fixture: "1e++1",
+    expected: { number: "1", unit: "e++1" }
+  },
+  {
+    fixture: "1e--1",
+    expected: { number: "1", unit: "e--1" }
+  },
+  {
+    fixture: "+10",
+    expected: { number: "+10", unit: "" }
+  },
+  {
+    fixture: "-10",
+    expected: { number: "-10", unit: "" }
+  },
+  {
+    fixture: ".2px",
+    expected: { number: ".2", unit: "px" }
+  },
+  {
+    fixture: "-.2px",
+    expected: { number: "-.2", unit: "px" }
+  },
+  {
+    fixture: "+.2px",
+    expected: { number: "+.2", unit: "px" }
+  },
+  {
+    fixture: ".a",
+    expected: false
+  },
+  {
+    fixture: ".",
+    expected: false
+  },
+  {
+    fixture: "+",
+    expected: false
+  },
+  {
+    fixture: "-",
+    expected: false
+  },
+  {
+    fixture: "-a",
+    expected: false
+  },
+  {
+    fixture: "+a",
+    expected: false
+  },
+  {
+    fixture: "+.a",
+    expected: false
+  },
+  {
+    fixture: "-.a",
+    expected: false
+  },
+  {
+    fixture: "",
+    expected: false
   }
 ];