fix(transforms): add NaN check to all size transforms (#413)

__tests__/common/transforms.test.js

@@ -355,6 +355,9 @@ describe('common', () => {
         expect(value).toBe("12.00sp");
         expect(value2).toBe("12.00sp");
       });
+      it('should throw an error if prop value is Nan', () => {
+        expect( () => transforms["size/sp"].transformer({value: "a"})).toThrow();
+      });
     });
 
     describe('size/dp', () => {
@@ -368,6 +371,9 @@ describe('common', () => {
         expect(value).toBe("12.00dp");
         expect(value2).toBe("12.00dp");
       });
+      it('should throw an error if prop value is Nan', () => {
+        expect( () => transforms["size/dp"].transformer({value: "a"})).toThrow();
+      });
     });
 
     describe('size/remToSp', () => {
@@ -377,6 +383,9 @@ describe('common', () => {
         });
         expect(value).toBe("16.00sp");
       });
+      it('should throw an error if prop value is Nan', () => {
+        expect( () => transforms["size/dp"].transformer({value: "a"})).toThrow();
+      });
     });
 
     describe('size/remToDp', () => {
@@ -386,6 +395,9 @@ describe('common', () => {
         });
         expect(value).toBe("16.00dp");
       });
+      it('should throw an error if prop value is Nan', () => {
+        expect( () => transforms["size/dp"].transformer({value: "a"})).toThrow();
+      });
     });
 
     describe('size/px', () => {
@@ -395,6 +407,9 @@ describe('common', () => {
         });
         expect(value).toBe("10px");
       });
+      it('should throw an error if prop value is Nan', () => {
+        expect( () => transforms["size/dp"].transformer({value: "a"})).toThrow();
+      });
     });
 
     describe('size/remToPt', () => {
@@ -404,6 +419,9 @@ describe('common', () => {
         });
         expect(value).toBe("16.00f");
       });
+      it('should throw an error if prop value is Nan', () => {
+        expect( () => transforms["size/dp"].transformer({value: "a"})).toThrow();
+      });
     });
 
     describe('size/remToPx', () => {
@@ -413,6 +431,9 @@ describe('common', () => {
         });
         expect(value).toBe("16px");
       });
+      it('should throw an error if prop value is Nan', () => {
+        expect( () => transforms["size/dp"].transformer({value: "a"})).toThrow();
+      });
     });
 
     describe('size/rem', () => {
@@ -422,6 +443,9 @@ describe('common', () => {
         });
         expect(value).toBe("1rem");
       });
+      it('should throw an error if prop value is Nan', () => {
+        expect( () => transforms["size/dp"].transformer({value: "a"})).toThrow();
+      });
     });
 
     describe('content/quote', () => {

lib/common/transforms.js

@@ -47,6 +47,10 @@ function wrapValueWith(character, prop) {
 function wrapValueWithDoubleQuote(prop) {
 	return wrapValueWith('"', prop);
 }
+
+function throwSizeError(name, value, unitType) {
+  throw `Invalid Number: '${name}: ${value}' is not a valid number, cannot transform to '${unitType}' \n`;
+}
 /**
  * @namespace Transforms
  */
@@ -463,7 +467,9 @@ module.exports = {
     type: 'value',
     matcher: isFontSize,
     transformer: function(prop) {
-      return parseFloat(prop.value).toFixed(2) + 'sp';
+      const val = parseFloat(prop.value);
+      if (isNaN(val)) throwSizeError(prop.name, prop.value, 'sp');
+      return val.toFixed(2) + 'sp';
     }
   },
 
@@ -482,7 +488,9 @@ module.exports = {
     type: 'value',
     matcher: isNotFontSize,
     transformer: function(prop) {
-      return parseFloat(prop.value).toFixed(2) + 'dp';
+      const val = parseFloat(prop.value);
+      if (isNaN(val)) throwSizeError(prop.name, prop.value, 'dp');
+      return val.toFixed(2) + 'dp';
     }
   },
 
@@ -501,7 +509,9 @@ module.exports = {
     type: 'value',
     matcher: isFontSize,
     transformer: function(prop) {
-      return (parseFloat(prop.value) * 16).toFixed(2) + 'sp';
+      const val = parseFloat(prop.value);
+      if (isNaN(val)) throwSizeError(prop.name, prop.value, 'sp');
+      return (val * 16).toFixed(2) + 'sp';
     }
   },
 
@@ -521,7 +531,9 @@ module.exports = {
     type: 'value',
     matcher: isNotFontSize,
     transformer: function(prop) {
-      return (parseFloat(prop.value) * 16).toFixed(2) + 'dp';
+      const val = parseFloat(prop.value);
+      if (isNaN(val)) throwSizeError(prop.name, prop.value, 'dp');
+      return (val * 16).toFixed(2) + 'dp';
     }
   },
 
@@ -541,7 +553,9 @@ module.exports = {
     type: 'value',
     matcher: isSize,
     transformer: function(prop) {
-      return parseFloat(prop.value) + 'px';
+      const val = parseFloat(prop.value);
+      if (isNaN(val)) throwSizeError(prop.name, prop.value, 'px');
+      return val + 'px';
     }
   },
 
@@ -560,7 +574,9 @@ module.exports = {
     type: 'value',
     matcher: isSize,
     transformer: function(prop) {
-      return parseFloat(prop.value) + 'rem';
+      const val = parseFloat(prop.value);
+      if (isNaN(val)) throwSizeError(prop.name, prop.value, 'rem');
+      return val + 'rem';
     }
   },
 
@@ -579,7 +595,9 @@ module.exports = {
     type: 'value',
     matcher: isSize,
     transformer: function(prop) {
-      return (parseFloat(prop.value) * 16).toFixed(2) + 'f';
+      const val = parseFloat(prop.value);
+      if (isNaN(val)) throwSizeError(prop.name, prop.value, 'pt');
+      return (val * 16).toFixed(2) + 'f';
     }
   },
 
@@ -597,7 +615,9 @@ module.exports = {
     type: 'value',
     matcher: isSize,
     transformer: function(prop) {
-      return `CGFloat(${(parseFloat(prop.value) * 16).toFixed(2)})`;
+      const val = parseFloat(prop.value);
+      if (isNaN(val)) throwSizeError(prop.name, prop.value, 'CGFloat');
+      return `CGFloat(${(val * 16).toFixed(2)})`;
     }
   },
 
@@ -616,7 +636,9 @@ module.exports = {
     type: 'value',
     matcher: isSize,
     transformer: function(prop) {
-      return (parseFloat(prop.value) * 16).toFixed(0) + 'px';
+      const val = parseFloat(prop.value);
+      if (isNaN(val)) throwSizeError(prop.name, prop.value, 'px');
+      return (val * 16).toFixed(0) + 'px';
     }
   },