fix(@schematics/angular): Allow empty string in the type option

Currently, Component and Class have the options to add custom type. In the case of class, It's already working fine with an empty string in type but in the case of component When setting the type to an empty string the file names generated will contain an extra period (.) which breaks the flow. With this PR, It will generate the files without an extra period (.) Reference #16811 and #16891
angular · Feb 26, 2020 · 1c1f1cd · 1c1f1cd
1 parent 678180e
commit 1c1f1cd
Show file tree

Hide file tree

Showing 4 changed files with 28 additions and 5 deletions.
diff --git a/...t/files/__name@dasherize@if-flat__/__name@dasherize__.__type@dasherize__.spec.ts.template b/...t/files/__name@dasherize@if-flat__/__name@dasherize__.__type@dasherize__.spec.ts.template
@@ -1,6 +1,6 @@
 import { async, ComponentFixture, TestBed } from '@angular/core/testing';
 
-import { <%= classify(name) %><%= classify(type) %> } from './<%= dasherize(name) %>.<%= dasherize(type) %>';
+import { <%= classify(name) %><%= classify(type) %> } from './<%= dasherize(name) %><%= type ? '.' + dasherize(type): '' %>';
 
 describe('<%= classify(name) %><%= classify(type) %>', () => {
   let component: <%= classify(name) %><%= classify(type) %>;

diff --git a/...ponent/files/__name@dasherize@if-flat__/__name@dasherize__.__type@dasherize__.ts.template b/...ponent/files/__name@dasherize@if-flat__/__name@dasherize__.__type@dasherize__.ts.template
@@ -7,15 +7,15 @@ import { Component, OnInit<% if(!!viewEncapsulation) { %>, ViewEncapsulation<% }
       <%= dasherize(name) %> works!
     </p>
   `,<% } else { %>
-  templateUrl: './<%= dasherize(name) %>.<%= dasherize(type) %>.html',<% } if(inlineStyle) { %>
+  templateUrl: './<%= dasherize(name) %><%= type ? '.' + dasherize(type): '' %>.html',<% } if(inlineStyle) { %>
   styles: [<% if(displayBlock){ %>
     `
       :host {
         display: block;
       }
     `<% } %>
   ],<% } else { %>
-  styleUrls: ['./<%= dasherize(name) %>.<%= dasherize(type) %>.<%= style %>']<% } %><% if(!!viewEncapsulation) { %>,
+  styleUrls: ['./<%= dasherize(name) %><%= type ? '.' + dasherize(type): '' %>.<%= style %>']<% } %><% if(!!viewEncapsulation) { %>,
   encapsulation: ViewEncapsulation.<%= viewEncapsulation %><% } if (changeDetection !== 'Default') { %>,
   changeDetection: ChangeDetectionStrategy.<%= changeDetection %><% } %>
 })

diff --git a/packages/schematics/angular/component/index.ts b/packages/schematics/angular/component/index.ts
@@ -7,13 +7,15 @@
  */
 import { strings } from '@angular-devkit/core';
 import {
+  FileOperator,
   Rule,
   SchematicsException,
   Tree,
   apply,
   applyTemplates,
   chain,
   filter,
+  forEach,
   mergeWith,
   move,
   noop,
@@ -49,15 +51,15 @@ function addDeclarationToNgModule(options: ComponentOptions): Rule {
       return host;
     }
 
-    options.type = !!options.type ? options.type : 'Component';
+    options.type = options.type != null ? options.type : 'Component';
 
     const modulePath = options.module;
     const source = readIntoSourceFile(host, modulePath);
 
     const componentPath = `/${options.path}/`
                           + (options.flat ? '' : strings.dasherize(options.name) + '/')
                           + strings.dasherize(options.name)
-                          + '.'
+                          + (options.type ? '.' : '')
                           + strings.dasherize(options.type);
     const relativePath = buildRelativePath(modulePath, componentPath);
     const classifiedName = strings.classify(options.name) + strings.classify(options.type);
@@ -155,6 +157,16 @@ export default function (options: ComponentOptions): Rule {
         'if-flat': (s: string) => options.flat ? '' : s,
         ...options,
       }),
+      !options.type ? forEach((file => {
+        if (!!file.path.match(new RegExp('..'))) {
+          return {
+            content: file.content,
+            path: file.path.replace('..', '.'),
+          };
+        } else {
+          return file;
+        }
+      }) as FileOperator) : noop(),
       move(parsedPath.path),
     ]);
 

diff --git a/packages/schematics/angular/component/index_spec.ts b/packages/schematics/angular/component/index_spec.ts
@@ -297,6 +297,17 @@ describe('Component Schematic', () => {
     expect(tree.files).toContain('/projects/bar/src/app/foo/foo.route.html');
   });
 
+  it('should allow empty string in the type option', async () => {
+    const options = { ...defaultOptions, type: '' };
+    const tree = await schematicRunner.runSchematicAsync('component', options, appTree).toPromise();
+    const content = tree.readContent('/projects/bar/src/app/foo/foo.ts');
+    const testContent = tree.readContent('/projects/bar/src/app/foo/foo.spec.ts');
+    expect(content).toContain('export class Foo implements OnInit');
+    expect(testContent).toContain("describe('Foo'");
+    expect(tree.files).toContain('/projects/bar/src/app/foo/foo.css');
+    expect(tree.files).toContain('/projects/bar/src/app/foo/foo.html');
+  });
+
   it('should use the module flag even if the module is a routing module', async () => {
     const routingFileName = 'app-routing.module.ts';
     const routingModulePath = `/projects/bar/src/app/${routingFileName}`;