fix(@schematics/angular): fix extra comma added when use --change-det…

…ection=onPush and --style=none to generate a component (cherry picked from commit a5e9976)
angular · Mar 30, 2022 · cf3cb2e · cf3cb2e
1 parent 4cd2331
commit cf3cb2e
Show file tree

Hide file tree

Showing 2 changed files with 26 additions and 3 deletions.
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
@@ -6,15 +6,15 @@ import { Component, OnInit<% if(!!viewEncapsulation) { %>, ViewEncapsulation<% }
     <p>
       <%= dasherize(name) %> works!
     </p>
-  `,<% } else { %>
-  templateUrl: './<%= dasherize(name) %><%= type ? '.' + dasherize(type): '' %>.html',<% } if(inlineStyle) { %>
+  `<% } else { %>
+  templateUrl: './<%= dasherize(name) %><%= type ? '.' + dasherize(type): '' %>.html'<% } if(inlineStyle) { %>,
   styles: [<% if(displayBlock){ %>
     `
       :host {
         display: block;
       }
     `<% } %>
-  ]<% } else if (style !== 'none') { %>
+  ]<% } else if (style !== 'none') { %>,
   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_spec.ts b/packages/schematics/angular/component/index_spec.ts
@@ -397,4 +397,27 @@ describe('Component Schematic', () => {
     );
     expect(tree.files).not.toContain('/projects/bar/src/app/foo/foo.component.spec.ts');
   });
+
+  it('should respect templateUrl when style=none and changeDetection=OnPush', async () => {
+    const options = { ...defaultOptions, style: Style.None, changeDetection: 'OnPush' };
+    const tree = await schematicRunner.runSchematicAsync('component', options, appTree).toPromise();
+    const content = tree.readContent('/projects/bar/src/app/foo/foo.component.ts');
+    expect(content).not.toMatch(/styleUrls: /);
+    expect(content).toMatch(/templateUrl: '.\/foo.component.html',\n/);
+    expect(content).toMatch(/changeDetection: ChangeDetectionStrategy.OnPush/);
+  });
+
+  it('should respect inlineTemplate when style=none and changeDetection=OnPush', async () => {
+    const options = {
+      ...defaultOptions,
+      style: Style.None,
+      changeDetection: 'OnPush',
+      inlineTemplate: true,
+    };
+    const tree = await schematicRunner.runSchematicAsync('component', options, appTree).toPromise();
+    const content = tree.readContent('/projects/bar/src/app/foo/foo.component.ts');
+    expect(content).not.toMatch(/styleUrls: /);
+    expect(content).toMatch(/template: `(\n(.|)*){3}\n\s*`,\n/);
+    expect(content).toMatch(/changeDetection: ChangeDetectionStrategy.OnPush/);
+  });
 });