I get the following error when I run my jasmine component test:
Error: Error in ./AppComponent class AppComponent - inline template:10:2 caused by: Cannot read property 'unsubscribe' of undefined TypeError: Cannot read property 'unsubscribe' of undefined at MdMenu.ngOnDestroy (webpack:///Users/joost/Documents/Angular2Workspace/Miaxello/~/@angular/material/menu/menu-directive.js:44:0 <- src/test.ts:25370:30) at _View_AppComponent0.destroyInternal (/DynamicTestModule/AppComponent/component.ngfactory.js:296:29) at _View_AppComponent0.AppView.destroyLocal (webpack:///Users/joost/Documents/Angular2Workspace/Miaxello/~/@angular/core/src/linker/view.js:153:0 <- src/test.ts:34349:14) at _View_AppComponent0.DebugAppView.destroyLocal (webpack:///Users/joost/Documents/Angular2Workspace/Miaxello/~/@angular/core/src/linker/view.js:314:0 <- src/test.ts:34510:43) at _View_AppComponent0.AppView._destroyRecurse (webpack:///Users/joost/Documents/Angular2Workspace/Miaxello/~/@angular/core/src/linker/view.js:141:0 <- src/test.ts:34337:14) at _View_AppComponent_Host0.AppView._destroyRecurse (webpack:///Users/joost/Documents/Angular2Workspace/Miaxello/~/@angular/core/src/linker/view.js:139:0 <- src/test.ts:34335:25) at _View_AppComponent_Host0.AppView.destroy (webpack:///Users/joost/Documents/Angular2Workspace/Miaxello/~/@angular/core/src/linker/view.js:127:0 <- src/test.ts:34323:14) at ComponentRef_.destroy (webpack:///Users/joost/Documents/Angular2Workspace/Miaxello/~/@angular/core/src/linker/component_factory.js:118:51 <- src/test.ts:20668:82) at ComponentFixture.destroy (webpack:///Users/joost/Documents/Angular2Workspace/Miaxello/~/@angular/core/bundles/core-testing.umd.js:261:0 <- src/test.ts:4275:35) at webpack:///Users/joost/Documents/Angular2Workspace/Miaxello/~/@angular/core/bundles/core-testing.umd.js:719:61 <- src/test.ts:4733:78
When I remove the <md-menu>...</md-menu> element that successfully tests jasmine.
my component template app.component.html:
<div [class.dark-theme]="isDarkTheme"> <md-toolbar color="primary"> <span> <md-icon class="icon-20">apps</md-icon> Miaxello </span> <button md-icon-button [md-menu-trigger-for]="menu"> <md-icon>more_vert</md-icon> </button> </md-toolbar> <md-menu #menu="mdMenu"> <button md-menu-item>Settings</button> </md-menu> </div> <h1> {{title}} </h1>
my spec file is app.component.spec.ts:
import { TestBed, async } from '@angular/core/testing'; import { AppComponent } from './app.component'; import {MaterialModule} from "@angular/material"; describe('App: miaxello', () => { beforeEach(() => { TestBed.configureTestingModule({ declarations: [ AppComponent ], imports: [ MaterialModule.forRoot() ] }); }); it('should create the app', async(() => { let fixture = TestBed.createComponent(AppComponent); let app = fixture.debugElement.componentInstance; expect(app).toBeTruthy(); })); });
my package.json file:
{ "name": "miaxello", "version": "0.0.0", "license": "MIT", "angular-cli": {}, "scripts": { "start": "ng serve", "lint": "tslint \"src/**/*.ts\"", "test": "ng test", "pree2e": "webdriver-manager update", "e2e": "protractor" }, "private": true, "dependencies": { "@angular/common": "~2.1.0", "@angular/compiler": "~2.1.0", "@angular/core": "~2.1.0", "@angular/forms": "~2.1.0", "@angular/http": "~2.1.0", "@angular/platform-browser": "~2.1.0", "@angular/platform-browser-dynamic": "~2.1.0", "@angular/router": "~3.1.0", "@angular/material": "2.0.0-alpha.10", "core-js": "^2.4.1", "rxjs": "5.0.0-beta.12", "ts-helpers": "^1.1.1", "zone.js": "^0.6.23" }, "devDependencies": { "@types/jasmine": "^2.2.30", "@types/node": "^6.0.42", "angular-cli": "1.0.0-beta.19-3", "codelyzer": "1.0.0-beta.1", "jasmine-core": "2.4.1", "jasmine-spec-reporter": "2.5.0", "karma": "1.2.0", "karma-chrome-launcher": "^2.0.0", "karma-cli": "^1.0.1", "karma-jasmine": "^1.0.2", "karma-remap-istanbul": "^0.2.1", "protractor": "4.0.9", "ts-node": "1.2.1", "tslint": "3.13.0", "typescript": "~2.0.3", "webdriver-manager": "10.2.5" } }
Thanks in advance for your help.
Hi,
Jost