fix: numeric parsing (#109)

* Update Numeric Tests

* Update Numeric parsing

Author: jonathantneal

lib/ValuesParser.js

@@ -179,7 +179,7 @@ module.exports = class ValuesParser extends Parser {
       } else if (Word.testWord(tokens, this)) {
         // we need to catch variables before the numeric and operator tests
         Word.fromTokens(tokens, this);
-      } else if (Numeric.test(value) || Numeric.testUnit(value)) {
+      } else if (Numeric.test(value)) {
         Numeric.fromTokens(tokens, this);
       } else if (UnicodeRange.test(value)) {
         UnicodeRange.fromTokens(tokens, this);

lib/nodes/Numeric.js

@@ -8,13 +8,52 @@
   The above copyright notice and this permission notice shall be
   included in all copies or substantial portions of this Source Code Form.
 */
-const isNumber = require('is-number');
 
 const { registerWalker } = require('../walker');
 
 const Node = require('./Node');
 
-const unitRegex = /%|ch|cm|em|ex|in|mm|ms|pc|pt|px|s|q|rem|vh|vmax|vmin|vw$/i;
+/** A Number is:
+ * 1. None or one plus or minus symbol; then
+ * 2. Either,
+ *    2.1. One or more digits; and / or,
+ *    2.2. One period symbol; followed by,
+ *         2.2.1. One or more digits;
+ *    then,
+ * 3. If one "e" letter,
+ *    3.1. One "e" letter; followed by,
+ *         3.1.1. None or one plus or minus symbol; followed by,
+ *                3.1.1.1. One or more digits.
+ * @see https://drafts.csswg.org/css-syntax/#consume-a-number
+ */
+const numberRegex = /^([+-]?(?:\d+(?:\.\d*)?|\.\d+)(?:[Ee][+-]?\d+)?)$/;
+
+/** A Unit is:
+ * 1. Either,
+ *    1.1. One dash; followed by,
+ *         1.1.1. One letter, non-ASCII, underscore, dash; or,
+ *         1.1.2. One escape slash; followed by,
+ *              1.1.2.1 One non-newline;
+ *         or,
+ *    1.2. One letter, non-ASCII, underscore; or,
+ *    1.3. One escape slash; followed by,
+ *       1.3.1. One non-newline;
+ *    then,
+ * 2. Zero or more of;
+ *    2.1 One letter, non-ASCII, underscore, dash; then / or,
+ *    2.2 One escape slash; followed by,
+ *        2.2.1. One non-newline.
+ * @see https://drafts.csswg.org/css-syntax/#consume-numeric-token
+ */
+const unitRegex = /^(-?(?:[-A-Z_a-z]|[^\x00-\x7F]|\\[^\n\f\r])(?:[-\w]|[^\x00-\x7F]|\\[^\n\f\r])*|%)$/; // eslint-disable-line no-control-regex
+
+/** A Numeric is:
+ * 1. One Number; followed by,
+ *    1.1 Zero or one Unit.
+ */
+const numericRegex = new RegExp(
+  `^${numberRegex.source.slice(1, -1) + unitRegex.source.slice(1, -1)}?$`
+);
 
 class Numeric extends Node {
   constructor(options = {}) {
@@ -25,33 +64,17 @@ class Numeric extends Node {
 
   static fromTokens(tokens, parser) {
     parser.fromFirst(tokens, Numeric);
-    let [[, value]] = tokens;
-    const unit = Numeric.parseUnit(value);
-    value = value.replace(unit, '');
+
+    const [[, rawValue]] = tokens;
+    const [, value, unit = ''] = rawValue.match(numericRegex);
 
     const { lastNode } = parser;
-    lastNode.unit = unit || '';
+    lastNode.unit = unit;
     lastNode.value = value;
   }
 
-  static parseUnit(what) {
-    const matches = what.match(unitRegex);
-    const [result] = matches || [];
-    return result;
-  }
-
   static test(what) {
-    return isNumber(what);
-  }
-
-  static testUnit(what) {
-    const unit = Numeric.parseUnit(what);
-
-    if (unit) {
-      const remaining = what.replace(unit, '');
-      return isNumber(remaining);
-    }
-    return false;
+    return numericRegex.test(what);
   }
 }
 

package.json

@@ -35,7 +35,6 @@
   ],
   "dependencies": {
     "color-name": "^1.1.4",
-    "is-number": "^7.0.0",
     "is-url-superb": "^3.0.0",
     "postcss": "^7.0.5",
     "url-regex": "^5.0.0"

test/fixtures/numeric.js

@@ -36,7 +36,9 @@ module.exports = {
     '500ms',
     '0.5s + 0.5s',
     '-.3s',
-    '-.3s + 0.5s'
+    '-.3s + 0.5s',
+    '1138--thx',
+    '32deg'
   ],
   throws: ['+-2.', '.', '.rem', '.2.3rem']
 };

test/snapshots/numeric.test.js.md

@@ -1340,3 +1340,81 @@ Generated by [AVA](https://ava.li).
         value: '500',
       },
     ]
+
+## 1138--thx
+
+> Snapshot 1
+
+    '1138--thx'
+
+> Snapshot 2
+
+    '1138--thx'
+
+> Snapshot 3
+
+    [
+      Numeric {
+        raws: {
+          after: '',
+          before: '',
+        },
+        source: {
+          end: {
+            column: 1,
+            line: 1,
+          },
+          input: Input {
+            css: '1138--thx',
+            hasBOM: false,
+            id: '<input css 28>',
+          },
+          start: {
+            column: 1,
+            line: 1,
+          },
+        },
+        type: 'numeric',
+        unit: '--thx',
+        value: '1138',
+      },
+    ]
+
+## 32deg
+
+> Snapshot 1
+
+    '32deg'
+
+> Snapshot 2
+
+    '32deg'
+
+> Snapshot 3
+
+    [
+      Numeric {
+        raws: {
+          after: '',
+          before: '',
+        },
+        source: {
+          end: {
+            column: 1,
+            line: 1,
+          },
+          input: Input {
+            css: '32deg',
+            hasBOM: false,
+            id: '<input css 29>',
+          },
+          start: {
+            column: 1,
+            line: 1,
+          },
+        },
+        type: 'numeric',
+        unit: 'deg',
+        value: '32',
+      },
+    ]