I am using angular-cli with angular2 v4.0 with angular stuff.
Dydy .. what's with all the mistakes? I am trying to learn karma, and if I run tests on npm, I get 34 errors related to the material.
Can't bind to 'routerLinkActive' since it isn't a known property of 'a' Can't bind to 'md-menu-trigger-for' since it isn't a known property of 'button' Can't bind to 'md-menu-trigger-for' since it isn't a known property of 'button' If 'md-menu' is an Angular component, then verify that it is part of this module.
On and incl.
How can I make angular material enjoyable with karma?
My application works great, but if before karma ... there will be a complete disaster.
thanks
EDIT:
I have many! declarations, entryComponents, imports and suppliers in my @NgModule app.module.ts file. It seems I should add each of them, for example. my dashboard.component.spec.ts file. I add one by one and do not become stupid. I really don't want to add unrelated components. How can I just import the app.module.ts file? I have 50 more to import ...
This is the type of error I get:
Failed: Uncaught (in promise): Error: Component BlankComponent is not part of any NgModule or the module has not been imported into your module.
If I import, then a big..error will go away just to complain about something else.
How to optimize?
import { async, ComponentFixture, TestBed } from '@angular/core/testing'; import { DashboardComponent } from './dashboard.component'; import { MaterialModule, MdDatepickerModule, MdNativeDateModule } from '@angular/material'; import { LoggedinService } from '../loggedin.service'; import { BusyService } from '../busy.service'; import { DbBusyService } from '../dbbusy.service'; import { RouterModule } from '@angular/router'; import { ROUTES } from '../app.routes'; import { LoginComponent } from '../login/login.component'; import { CallbackComponent } from '../callback/callback.component'; describe('DashboardComponent', () => { let component: DashboardComponent; let fixture: ComponentFixture<DashboardComponent>; beforeEach(async(() => { TestBed.configureTestingModule({ declarations: [ DashboardComponent, LoginComponent, CallbackComponent], imports: [ MaterialModule, RouterModule.forRoot(ROUTES, { useHash: true }) ], providers: [ LoggedinService, BusyService, DbBusyService ] }) .compileComponents(); })); beforeEach(() => { fixture = TestBed.createComponent(DashboardComponent); component = fixture.componentInstance; fixture.detectChanges(); }); it('should create', () => { expect(component).toBeTruthy(); }); });
I tried this but got the following error. Therefore, I assume that there is a way o to import app.module and add to TestBed.configureTestingModule, but it is not clear how to do this.
import { AppModule } from '../app.module'; beforeEach(async(() => { TestBed.configureTestingModule({ declarations: [ DashboardComponent, LoginComponent, CallbackComponent], imports: [ MaterialModule, RouterModule.forRoot(ROUTES, { useHash: true }), AppModule ], providers: [ LoggedinService, BusyService, DbBusyService ] }) .compileComponents(); }));
Crash: The DashboardComponent type is part of the declarations of 2 modules: AppModule and DynamicTestModule! Please consider porting the DashboardComponent to a higher module that imports the AppModule and DynamicTestModule. You can also create a new NgModule that exports and includes the DashboardComponent, then imports this NgModule into the AppModule and DynamicTestModule.