fix(schematics): generated spec files not working (#12842)

If someone generates components with Angular Material by using our schematics and runs `ng test` afterwards, the tests will fail because: * The needed Material modules are not being imported * No animation module is specified (either `Noop` or `BrowserAnimationsModule`) * `fakeAsync` is used to run `compileComponents`. `async()` should be used to wait for `compileComponents` (see the default CLI component schematic) Fixes #12778
angular · Aug 26, 2018 · c09da0b · c09da0b
1 parent f6cded8
commit c09da0b
Show file tree

Hide file tree

Showing 5 changed files with 103 additions and 36 deletions.
diff --git a/...dress-form/files/__path__/__name@dasherize@if-flat__/__name@dasherize__.component.spec.ts b/...dress-form/files/__path__/__name@dasherize@if-flat__/__name@dasherize__.component.spec.ts
@@ -1,22 +1,40 @@
-
-import { fakeAsync, ComponentFixture, TestBed } from '@angular/core/testing';
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { ReactiveFormsModule } from '@angular/forms';
+import { NoopAnimationsModule } from '@angular/platform-browser/animations';
+import {
+  MatButtonModule,
+  MatCardModule,
+  MatInputModule,
+  MatRadioModule,
+  MatSelectModule,
+} from '@angular/material';
 
 import { <%= classify(name) %>Component } from './<%= dasherize(name) %>.component';
 
 describe('<%= classify(name) %>Component', () => {
   let component: <%= classify(name) %>Component;
   let fixture: ComponentFixture<<%= classify(name) %>Component>;
 
-  beforeEach(fakeAsync(() => {
+  beforeEach(async(() => {
     TestBed.configureTestingModule({
-      declarations: [ <%= classify(name) %>Component ]
-    })
-    .compileComponents();
+      declarations: [ <%= classify(name) %>Component ],
+      imports: [
+        NoopAnimationsModule,
+        ReactiveFormsModule,
+        MatButtonModule,
+        MatCardModule,
+        MatInputModule,
+        MatRadioModule,
+        MatSelectModule,
+      ]
+    }).compileComponents();
+  }));
 
+  beforeEach(() => {
     fixture = TestBed.createComponent(<%= classify(name) %>Component);
     component = fixture.componentInstance;
     fixture.detectChanges();
-  }));
+  });
 
   it('should compile', () => {
     expect(component).toBeTruthy();

diff --git a/.../dashboard/files/__path__/__name@dasherize@if-flat__/__name@dasherize__.component.spec.ts b/.../dashboard/files/__path__/__name@dasherize@if-flat__/__name@dasherize__.component.spec.ts
@@ -1,22 +1,40 @@
-
-import { fakeAsync, ComponentFixture, TestBed } from '@angular/core/testing';
+import { LayoutModule } from '@angular/cdk/layout';
+import { NoopAnimationsModule } from '@angular/platform-browser/animations';
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import {
+  MatButtonModule,
+  MatCardModule,
+  MatGridListModule,
+  MatIconModule,
+  MatMenuModule,
+} from '@angular/material';
 
 import { <%= classify(name) %>Component } from './<%= dasherize(name) %>.component';
 
 describe('<%= classify(name) %>Component', () => {
   let component: <%= classify(name) %>Component;
   let fixture: ComponentFixture<<%= classify(name) %>Component>;
 
-  beforeEach(fakeAsync(() => {
+  beforeEach(async(() => {
     TestBed.configureTestingModule({
-      declarations: [ <%= classify(name) %>Component ]
-    })
-    .compileComponents();
+      declarations: [< %= classify(name) %> Component],
+      imports: [
+        NoopAnimationsModule,
+        LayoutModule,
+        MatButtonModule,
+        MatCardModule,
+        MatGridListModule,
+        MatIconModule,
+        MatMenuModule,
+      ]
+    }).compileComponents();
+  }));
 
+  beforeEach(() => {
     fixture = TestBed.createComponent(<%= classify(name) %>Component);
     component = fixture.componentInstance;
     fixture.detectChanges();
-  }));
+  });
 
   it('should compile', () => {
     expect(component).toBeTruthy();

diff --git a/...matics/nav/files/__path__/__name@dasherize@if-flat__/__name@dasherize__.component.spec.ts b/...matics/nav/files/__path__/__name@dasherize@if-flat__/__name@dasherize__.component.spec.ts
@@ -1,23 +1,40 @@
+import { LayoutModule } from '@angular/cdk/layout';
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { NoopAnimationsModule } from '@angular/platform-browser/animations';
+import {
+  MatButtonModule,
+  MatIconModule,
+  MatListModule,
+  MatSidenavModule,
+  MatToolbarModule,
+} from '@angular/material';
 
-import { fakeAsync, ComponentFixture, TestBed } from '@angular/core/testing';
-import { MatSidenavModule } from '@angular/material/sidenav';
 import { <%= classify(name) %>Component } from './<%= dasherize(name) %>.component';
 
 describe('<%= classify(name) %>Component', () => {
   let component: <%= classify(name) %>Component;
   let fixture: ComponentFixture<<%= classify(name) %>Component>;
 
-  beforeEach(fakeAsync(() => {
+  beforeEach(async(() => {
     TestBed.configureTestingModule({
-      imports: [MatSidenavModule],
-      declarations: [<%= classify(name) %>Component]
-    })
-    .compileComponents();
+      declarations: [<%= classify(name) %>Component],
+      imports: [
+        NoopAnimationsModule,
+        LayoutModule,
+        MatButtonModule,
+        MatIconModule,
+        MatListModule,
+        MatSidenavModule,
+        MatToolbarModule,
+      ]
+    }).compileComponents();
+  }));
 
+  beforeEach(() => {
     fixture = TestBed.createComponent(<%= classify(name) %>Component);
     component = fixture.componentInstance;
     fixture.detectChanges();
-  }));
+  });
 
   it('should compile', () => {
     expect(component).toBeTruthy();

diff --git a/...tics/table/files/__path__/__name@dasherize@if-flat__/__name@dasherize__.component.spec.ts b/...tics/table/files/__path__/__name@dasherize@if-flat__/__name@dasherize__.component.spec.ts
@@ -1,22 +1,30 @@
-
-import { fakeAsync, ComponentFixture, TestBed } from '@angular/core/testing';
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { NoopAnimationsModule } from '@angular/platform-browser/animations';
+import { MatPaginatorModule, MatSortModule, MatTableModule } from '@angular/material';
 
 import { <%= classify(name) %>Component } from './<%= dasherize(name) %>.component';
 
 describe('<%= classify(name) %>Component', () => {
   let component: <%= classify(name) %>Component;
   let fixture: ComponentFixture<<%= classify(name) %>Component>;
 
-  beforeEach(fakeAsync(() => {
+  beforeEach(async(() => {
     TestBed.configureTestingModule({
-      declarations: [ <%= classify(name) %>Component ]
-    })
-    .compileComponents();
+      declarations: [ <%= classify(name) %>Component ],
+      imports: [
+        NoopAnimationsModule,
+        MatPaginatorModule,
+        MatSortModule,
+        MatTableModule,
+      ]
+    }).compileComponents();
+  }));
 
+  beforeEach(() => {
     fixture = TestBed.createComponent(<%= classify(name) %>Component);
     component = fixture.componentInstance;
     fixture.detectChanges();
-  }));
+  });
 
   it('should compile', () => {
     expect(component).toBeTruthy();

diff --git a/...atics/tree/files/__path__/__name@dasherize@if-flat__/__name@dasherize__.component.spec.ts b/...atics/tree/files/__path__/__name@dasherize@if-flat__/__name@dasherize__.component.spec.ts
@@ -1,22 +1,28 @@
-
-import { fakeAsync, ComponentFixture, TestBed } from '@angular/core/testing';
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { MatButtonModule, MatIconModule, MatTreeModule } from '@angular/material';
 
 import { <%= classify(name) %>Component } from './<%= dasherize(name) %>.component';
 
 describe('<%= classify(name) %>Component', () => {
   let component: <%= classify(name) %>Component;
   let fixture: ComponentFixture<<%= classify(name) %>Component>;
 
-  beforeEach(fakeAsync(() => {
+  beforeEach(async(() => {
     TestBed.configureTestingModule({
-      declarations: [ <%= classify(name) %>Component ]
-    })
-    .compileComponents();
+      declarations: [ <%= classify(name) %>Component ],
+      imports: [
+        MatButtonModule,
+        MatIconModule,
+        MatTreeModule,
+      ]
+    }).compileComponents();
+  }));
 
+  beforeEach(() => {
     fixture = TestBed.createComponent(<%= classify(name) %>Component);
     component = fixture.componentInstance;
     fixture.detectChanges();
-  }));
+  });
 
   it('should compile', () => {
     expect(component).toBeTruthy();