fix(react): validate style value before proceeding with app/lib/compo…

…nent generate (#1725)
nrwl · Aug 15, 2019 · 5b6da28 · 5b6da28
1 parent e29dcf9
commit 5b6da28
Show file tree

Hide file tree

Showing 5 changed files with 52 additions and 6 deletions.
diff --git a/packages/react/src/schematics/application/application.ts b/packages/react/src/schematics/application/application.ts
@@ -50,6 +50,7 @@ import {
   regeneratorVersion
 } from '../../utils/versions';
 import { addImportToModule } from '../../../../angular/src/utils/ast-utils';
+import { assertValidStyle } from '../../utils/assertion';
 
 interface NormalizedSchema extends Schema {
   projectName: string;
@@ -321,6 +322,8 @@ function normalizeOptions(host: Tree, options: Schema): NormalizedSchema {
     ? null
     : options.style;
 
+  assertValidStyle(options.style);
+
   return {
     ...options,
     name: toFileName(options.name),

diff --git a/packages/react/src/schematics/component/component.ts b/packages/react/src/schematics/component/component.ts
@@ -23,6 +23,7 @@ import {
 } from '@nrwl/workspace/src/utils/ast-utils';
 import { CSS_IN_JS_DEPENDENCIES } from '../../utils/styled';
 import { reactRouterVersion } from '../../utils/versions';
+import { assertValidStyle } from '../../utils/assertion';
 
 interface NormalizedSchema extends Schema {
   projectSourceRoot: Path;
@@ -124,24 +125,24 @@ function normalizeOptions(
   context: SchematicContext
 ): NormalizedSchema {
   const { className, fileName } = names(options.name);
-
   const componentFileName = options.pascalCaseFiles ? className : fileName;
-
   const { sourceRoot: projectSourceRoot, projectType } = getProjectConfig(
     host,
     options.project
   );
 
+  const styledModule = /^(css|scss|less|styl)$/.test(options.style)
+    ? null
+    : options.style;
+
+  assertValidStyle(options.style);
+
   if (options.export && projectType === 'application') {
     context.logger.warn(
       `The "--export" option should not be used with applications and will do nothing.`
     );
   }
 
-  const styledModule = /^(css|scss|less|styl)$/.test(options.style)
-    ? null
-    : options.style;
-
   return {
     ...options,
     styledModule,

diff --git a/packages/react/src/schematics/library/library.ts b/packages/react/src/schematics/library/library.ts
@@ -39,6 +39,7 @@ import {
   findComponentImportPath
 } from '../../utils/ast-utils';
 import { reactRouterVersion } from '../../utils/versions';
+import { assertValidStyle } from '../../utils/assertion';
 
 export interface NormalizedSchema extends Schema {
   name: string;
@@ -283,5 +284,7 @@ function normalizeOptions(
     }
   }
 
+  assertValidStyle(normalized.style);
+
   return normalized;
 }
diff --git a/packages/react/src/utils/assertion.spec.ts b/packages/react/src/utils/assertion.spec.ts
@@ -0,0 +1,22 @@
+import { assertValidStyle } from './assertion';
+
+describe('assertValidStyle', () => {
+  it('should accept style option values from app, lib, component schematics', () => {
+    const schemas = [
+      require('../schematics/application/schema.json'),
+      require('../schematics/component/schema.json'),
+      require('../schematics/library/schema.json')
+    ];
+
+    schemas.forEach(schema => {
+      const values = schema.properties.style['x-prompt'].items;
+      expect(() =>
+        values.forEach(value => assertValidStyle(value)).not.toThrow()
+      );
+    });
+  });
+
+  it('should throw for invalid values', () => {
+    expect(() => assertValidStyle('bad')).toThrow(/Unsupported/);
+  });
+});
diff --git a/packages/react/src/utils/assertion.ts b/packages/react/src/utils/assertion.ts
@@ -0,0 +1,17 @@
+const VALID_STYLES = [
+  'css',
+  'scss',
+  'less',
+  'styl',
+  'styled-components',
+  '@emotion/styled'
+];
+export function assertValidStyle(style: string): void {
+  if (VALID_STYLES.indexOf(style) === -1) {
+    throw new Error(
+      `Unsupported style option found: ${style}. Valid values are: "${VALID_STYLES.join(
+        '", "'
+      )}"`
+    );
+  }
+}