From 43e2aa9f7e27ab5c78f6c4ba48120ae9a94e19e4 Mon Sep 17 00:00:00 2001 From: Leon Radley Date: Thu, 3 Oct 2019 20:52:27 +0200 Subject: [PATCH] feat(@schematics/angular): add type option to component generator the type option allows you to change the default .component.ts suffix to new types. such as Route Dialog UI Container --- ...e__.__type@dasherize__.__style__.template} | 0 ...herize__.__type@dasherize__.html.template} | 0 ...rize__.__type@dasherize__.spec.ts.template | 25 +++++++++++++++++++ ...asherize__.__type@dasherize__.ts.template} | 6 ++--- ...ame@dasherize__.component.spec.ts.template | 25 ------------------- .../schematics/angular/component/index.ts | 11 +++++--- .../angular/component/index_spec.ts | 12 +++++++++ .../schematics/angular/component/schema.json | 5 ++++ 8 files changed, 52 insertions(+), 32 deletions(-) rename packages/schematics/angular/component/files/__name@dasherize@if-flat__/{__name@dasherize__.component.__style__.template => __name@dasherize__.__type@dasherize__.__style__.template} (100%) rename packages/schematics/angular/component/files/__name@dasherize@if-flat__/{__name@dasherize__.component.html.template => __name@dasherize__.__type@dasherize__.html.template} (100%) create mode 100644 packages/schematics/angular/component/files/__name@dasherize@if-flat__/__name@dasherize__.__type@dasherize__.spec.ts.template rename packages/schematics/angular/component/files/__name@dasherize@if-flat__/{__name@dasherize__.component.ts.template => __name@dasherize__.__type@dasherize__.ts.template} (68%) delete mode 100644 packages/schematics/angular/component/files/__name@dasherize@if-flat__/__name@dasherize__.component.spec.ts.template diff --git a/packages/schematics/angular/component/files/__name@dasherize@if-flat__/__name@dasherize__.component.__style__.template b/packages/schematics/angular/component/files/__name@dasherize@if-flat__/__name@dasherize__.__type@dasherize__.__style__.template similarity index 100% rename from packages/schematics/angular/component/files/__name@dasherize@if-flat__/__name@dasherize__.component.__style__.template rename to packages/schematics/angular/component/files/__name@dasherize@if-flat__/__name@dasherize__.__type@dasherize__.__style__.template diff --git a/packages/schematics/angular/component/files/__name@dasherize@if-flat__/__name@dasherize__.component.html.template b/packages/schematics/angular/component/files/__name@dasherize@if-flat__/__name@dasherize__.__type@dasherize__.html.template similarity index 100% rename from packages/schematics/angular/component/files/__name@dasherize@if-flat__/__name@dasherize__.component.html.template rename to packages/schematics/angular/component/files/__name@dasherize@if-flat__/__name@dasherize__.__type@dasherize__.html.template diff --git a/packages/schematics/angular/component/files/__name@dasherize@if-flat__/__name@dasherize__.__type@dasherize__.spec.ts.template b/packages/schematics/angular/component/files/__name@dasherize@if-flat__/__name@dasherize__.__type@dasherize__.spec.ts.template new file mode 100644 index 000000000000..6ea46afb72d7 --- /dev/null +++ b/packages/schematics/angular/component/files/__name@dasherize@if-flat__/__name@dasherize__.__type@dasherize__.spec.ts.template @@ -0,0 +1,25 @@ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { <%= classify(name) %><%= classify(type) %> } from './<%= dasherize(name) %>.<%= dasherize(type) %>'; + +describe('<%= classify(name) %><%= classify(type) %>', () => { + let component: <%= classify(name) %><%= classify(type) %>; + let fixture: ComponentFixture<<%= classify(name) %><%= classify(type) %>>; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ <%= classify(name) %><%= classify(type) %> ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(<%= classify(name) %><%= classify(type) %>); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/packages/schematics/angular/component/files/__name@dasherize@if-flat__/__name@dasherize__.component.ts.template b/packages/schematics/angular/component/files/__name@dasherize@if-flat__/__name@dasherize__.__type@dasherize__.ts.template similarity index 68% rename from packages/schematics/angular/component/files/__name@dasherize@if-flat__/__name@dasherize__.component.ts.template rename to packages/schematics/angular/component/files/__name@dasherize@if-flat__/__name@dasherize__.__type@dasherize__.ts.template index 7993328cbf83..de839a8ce79c 100644 --- a/packages/schematics/angular/component/files/__name@dasherize@if-flat__/__name@dasherize__.component.ts.template +++ b/packages/schematics/angular/component/files/__name@dasherize@if-flat__/__name@dasherize__.__type@dasherize__.ts.template @@ -7,13 +7,13 @@ import { Component, OnInit<% if(!!viewEncapsulation) { %>, ViewEncapsulation<% } <%= dasherize(name) %> works!

`,<% } else { %> - templateUrl: './<%= dasherize(name) %>.component.html',<% } if(inlineStyle) { %> + templateUrl: './<%= dasherize(name) %>.<%= dasherize(type) %>.html',<% } if(inlineStyle) { %> styles: []<% } else { %> - styleUrls: ['./<%= dasherize(name) %>.component.<%= style %>']<% } %><% if(!!viewEncapsulation) { %>, + styleUrls: ['./<%= dasherize(name) %>.<%= dasherize(type) %>.<%= style %>']<% } %><% if(!!viewEncapsulation) { %>, encapsulation: ViewEncapsulation.<%= viewEncapsulation %><% } if (changeDetection !== 'Default') { %>, changeDetection: ChangeDetectionStrategy.<%= changeDetection %><% } %> }) -export class <%= classify(name) %>Component implements OnInit { +export class <%= classify(name) %><%= classify(type) %> implements OnInit { constructor() { } diff --git a/packages/schematics/angular/component/files/__name@dasherize@if-flat__/__name@dasherize__.component.spec.ts.template b/packages/schematics/angular/component/files/__name@dasherize@if-flat__/__name@dasherize__.component.spec.ts.template deleted file mode 100644 index b22b9a9c884d..000000000000 --- a/packages/schematics/angular/component/files/__name@dasherize@if-flat__/__name@dasherize__.component.spec.ts.template +++ /dev/null @@ -1,25 +0,0 @@ -import { async, ComponentFixture, TestBed } from '@angular/core/testing'; - -import { <%= classify(name) %>Component } from './<%= dasherize(name) %>.component'; - -describe('<%= classify(name) %>Component', () => { - let component: <%= classify(name) %>Component; - let fixture: ComponentFixture<<%= classify(name) %>Component>; - - beforeEach(async(() => { - TestBed.configureTestingModule({ - declarations: [ <%= classify(name) %>Component ] - }) - .compileComponents(); - })); - - beforeEach(() => { - fixture = TestBed.createComponent(<%= classify(name) %>Component); - component = fixture.componentInstance; - fixture.detectChanges(); - }); - - it('should create', () => { - expect(component).toBeTruthy(); - }); -}); diff --git a/packages/schematics/angular/component/index.ts b/packages/schematics/angular/component/index.ts index 1c91fedb2485..84783fe31008 100644 --- a/packages/schematics/angular/component/index.ts +++ b/packages/schematics/angular/component/index.ts @@ -49,15 +49,18 @@ function addDeclarationToNgModule(options: ComponentOptions): Rule { return host; } + options.type = !!options.type ? 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) - + '.component'; + + '.' + + strings.dasherize(options.type); const relativePath = buildRelativePath(modulePath, componentPath); - const classifiedName = strings.classify(`${options.name}Component`); + const classifiedName = strings.classify(options.name) + strings.classify(options.type); const declarationChanges = addDeclarationToModule(source, modulePath, classifiedName, @@ -77,7 +80,7 @@ function addDeclarationToNgModule(options: ComponentOptions): Rule { const exportRecorder = host.beginUpdate(modulePath); const exportChanges = addExportToModule(source, modulePath, - strings.classify(`${options.name}Component`), + strings.classify(options.name) + strings.classify(options.type), relativePath); for (const change of exportChanges) { @@ -95,7 +98,7 @@ function addDeclarationToNgModule(options: ComponentOptions): Rule { const entryComponentRecorder = host.beginUpdate(modulePath); const entryComponentChanges = addEntryComponentToModule( source, modulePath, - strings.classify(`${options.name}Component`), + strings.classify(options.name) + strings.classify(options.type), relativePath); for (const change of entryComponentChanges) { diff --git a/packages/schematics/angular/component/index_spec.ts b/packages/schematics/angular/component/index_spec.ts index 59f1c97bc04e..3968de0b552f 100644 --- a/packages/schematics/angular/component/index_spec.ts +++ b/packages/schematics/angular/component/index_spec.ts @@ -24,6 +24,7 @@ describe('Component Schematic', () => { inlineTemplate: false, changeDetection: ChangeDetection.Default, style: Style.Css, + type: 'Component', skipTests: false, module: undefined, export: false, @@ -256,6 +257,17 @@ describe('Component Schematic', () => { expect(tree.files).not.toContain('/projects/bar/src/app/foo/foo.component.css'); }); + it('should respect the type option', async () => { + const options = { ...defaultOptions, type: 'Route' }; + const tree = await schematicRunner.runSchematicAsync('component', options, appTree).toPromise(); + const content = tree.readContent('/projects/bar/src/app/foo/foo.route.ts'); + const testContent = tree.readContent('/projects/bar/src/app/foo/foo.route.spec.ts'); + expect(content).toContain('export class FooRoute implements OnInit'); + expect(testContent).toContain('describe(\'FooRoute\''); + expect(tree.files).toContain('/projects/bar/src/app/foo/foo.route.css'); + expect(tree.files).toContain('/projects/bar/src/app/foo/foo.route.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}`; diff --git a/packages/schematics/angular/component/schema.json b/packages/schematics/angular/component/schema.json index 95f25cdc2dc4..2cbc2524a8f7 100644 --- a/packages/schematics/angular/component/schema.json +++ b/packages/schematics/angular/component/schema.json @@ -88,6 +88,11 @@ ], "x-user-analytics": 5 }, + "type": { + "type": "string", + "description": "Adds a developer-defined type to the filename, in the format \"name.type.ts\".", + "default": "Component" + }, "spec": { "type": "boolean", "description": "When true (the default), generates a \"spec.ts\" test file for the new component.",