Fix parsing flex-basis in shorthand flex

Fixes the case in the flex shorthand where the third value isn't an explicit value or dimension, which was causing a parse error when called with (e.g.) `flex: 0 0 auto`.

Closes #246.

Author: matmannion

lib/properties/flex.js

@@ -53,17 +53,15 @@ module.exports.parse = function parse(v, opt = {}) {
           return name;
         }
         case "Identifier": {
-          if (name === "auto") {
-            flex["flex-basis"] = name;
-            return flex;
-          } else if (name === "none") {
+          if (name === "none") {
             return {
               "flex-grow": "0",
               "flex-shrink": "0",
               "flex-basis": "auto"
             };
           }
-          break;
+          flex["flex-basis"] = name;
+          return flex;
         }
         case "Number": {
           flex["flex-grow"] = itemValue;
@@ -92,7 +90,9 @@ module.exports.parse = function parse(v, opt = {}) {
         } else {
           return;
         }
-        if (val3.type === "Calc" && !val3.isNumber) {
+        if (val3.type === "GlobalKeyword" || val3.type === "Identifier") {
+          flex["flex-basis"] = val3.name;
+        } else if (val3.type === "Calc" && !val3.isNumber) {
           flex["flex-basis"] = `${val3.name}(${val3.value})`;
         } else if (val3.type === "Dimension") {
           flex["flex-basis"] = `${val3.value}${val3.unit}`;
@@ -123,6 +123,10 @@ module.exports.parse = function parse(v, opt = {}) {
             flex["flex-basis"] = `${val2.value}%`;
             break;
           }
+          case "Identifier": {
+            flex["flex-basis"] = val2.name;
+            break;
+          }
           default: {
             return;
           }

test/CSSStyleDeclaration.test.js

@@ -1143,6 +1143,18 @@ describe("CSSStyleDeclaration", () => {
     assert.strictEqual(style.getPropertyValue("flex-shrink"), "1");
     assert.strictEqual(style.getPropertyValue("flex-basis"), "250px");
     style.removeProperty("flex");
+    style.setProperty("flex", "0 0 auto");
+    assert.strictEqual(style.getPropertyValue("flex"), "0 0 auto");
+    assert.strictEqual(style.getPropertyValue("flex-grow"), "0");
+    assert.strictEqual(style.getPropertyValue("flex-shrink"), "0");
+    assert.strictEqual(style.getPropertyValue("flex-basis"), "auto");
+    style.removeProperty("flex");
+    style.setProperty("flex", "0 auto");
+    assert.strictEqual(style.getPropertyValue("flex"), "0 1 auto");
+    assert.strictEqual(style.getPropertyValue("flex-grow"), "0");
+    assert.strictEqual(style.getPropertyValue("flex-shrink"), "1");
+    assert.strictEqual(style.getPropertyValue("flex-basis"), "auto");
+    style.removeProperty("flex");
     style.setProperty("flex", "2");
     assert.strictEqual(style.getPropertyValue("flex-grow"), "2");
     assert.strictEqual(style.getPropertyValue("flex-shrink"), "1");