Add tests for custom string and length generic

Author: frenic

__fixtures__/typecheck.js

@@ -4,16 +4,22 @@ import * as CSS from '../index.js.flow';
 const css: CSS.Properties<*> = {
   flexGrow: 1,
   flexShrink: 1,
-  flexBasis: '1px',
+  flexBasis: 'max-content',
   flexDirection: 'row',
   MozAppearance: 'button',
   msOverflowStyle: 'scrollbar',
+
+  // Test custom string
+  borderBottomWidth: 'calc(1px)',
+  // This property has `TLength` (but not `(string & {})` itself) so
+  // if this fails it may have something to do with default generic values
+  borderBottomWidth: 'calc(1px)',
 };
 
 const cssWithFallbackValues: CSS.PropertiesFallback<*> = {
   flexGrow: [1],
   flexShrink: [1],
-  flexBasis: ['1px'],
+  flexBasis: ['max-content'],
   flexDirection: ['row'],
   MozAppearance: ['button'],
   msOverflowStyle: ['scrollbar'],
@@ -22,12 +28,16 @@ const cssWithFallbackValues: CSS.PropertiesFallback<*> = {
 const cssWithHyphenProperties: CSS.PropertiesHyphen<*> = {
   'flex-grow': 1,
   'flex-shrink': 0,
-  'flex-basis': '1px',
+  'flex-basis': 'max-content',
   'flex-direction': 'row',
   '-moz-appearance': 'button',
   '-ms-overflow-style': 'scrollbar',
 };
 
+const cssWithDifferentLength: CSS.Properties<{ px: number }> = {
+  width: { px: 1 },
+};
+
 const unknownProperty: CSS.Properties<*> = {
   unknownProperty: 1,
 };

__fixtures__/typecheck.ts

@@ -5,16 +5,22 @@ import * as CSS from '..';
 const css: CSS.Properties = {
   flexGrow: 1,
   flexShrink: 1,
-  flexBasis: '1px',
+  flexBasis: 'max-content',
   flexDirection: 'row',
   MozAppearance: 'button',
   msOverflowStyle: 'scrollbar',
+
+  // Test custom string to make sure `(string & {})` haven't broken
+  width: 'calc(1px)',
+  // This property has `TLength` (but not `(string & {})` itself) so
+  // if this fails it may have something to do with default generic values
+  borderBottomWidth: 'calc(1px)',
 };
 
 const cssWithFallbackValues: CSS.PropertiesFallback = {
   flexGrow: [1],
   flexShrink: [1],
-  flexBasis: ['1px'],
+  flexBasis: ['max-content'],
   flexDirection: ['row'],
   MozAppearance: ['button'],
   msOverflowStyle: ['scrollbar'],
@@ -23,12 +29,16 @@ const cssWithFallbackValues: CSS.PropertiesFallback = {
 const cssWithHyphenProperties: CSS.PropertiesHyphen = {
   'flex-grow': 1,
   'flex-shrink': 0,
-  'flex-basis': '1px',
+  'flex-basis': 'max-content',
   'flex-direction': 'row',
   '-moz-appearance': 'button',
   '-ms-overflow-style': 'scrollbar',
 };
 
+const cssWithDifferentLength: CSS.Properties<{ px: number }> = {
+  width: { px: 1 },
+};
+
 const unknownProperty: CSS.Properties = {
   unknownProperty: 1,
 };
@@ -40,5 +50,6 @@ const cssWithDisallowedFallbackValues: CSS.Properties = {
 css;
 cssWithFallbackValues;
 cssWithHyphenProperties;
+cssWithDifferentLength;
 unknownProperty;
 cssWithDisallowedFallbackValues;

__tests__/__snapshots__/dist.flow.ts.snap

@@ -1,3 +1,3 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`it detects errors 1`] = `"31:44 - Cannot assign object literal to \`unknownProperty\` because property \`unknownProperty\` is missing in \`Properties\` [1] but exists in object literal [2]."`;
+exports[`it detects errors 1`] = `"41:44 - Cannot assign object literal to \`unknownProperty\` because property \`unknownProperty\` is missing in \`Properties\` [1] but exists in object literal [2]."`;

__tests__/__snapshots__/dist.typescript.ts.snap

@@ -1,11 +1,11 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`it detects errors 1`] = `
-"32:2 - Type '{ unknownProperty: number; }' is not assignable to type 'Properties<0 | (string & {})>'.
+"42:2 - Type '{ unknownProperty: number; }' is not assignable to type 'Properties<0 | (string & {})>'.
   Object literal may only specify known properties, and 'unknownProperty' does not exist in type 'Properties<0 | (string & {})>'."
 `;
 
 exports[`it detects errors 2`] = `
-"36:2 - Type 'string[]' is not assignable to type '0 | \\"auto\\" | \\"inherit\\" | (string & {}) | \\"-moz-initial\\" | \\"initial\\" | \\"revert\\" | \\"unset\\" | undefined'.
+"46:2 - Type 'string[]' is not assignable to type '0 | \\"auto\\" | \\"inherit\\" | (string & {}) | \\"-moz-initial\\" | \\"initial\\" | \\"revert\\" | \\"unset\\" | undefined'.
   Type 'string[]' is not assignable to type '\\"unset\\"'."
 `;