When my angular component is loaded it displays a modal (ng-bootstrap).
In my test i try to access this modal but i cant access it since it seems to be loaded after my test runs.
component.ts
ngOnInit() {
Promise.resolve().then(() => { // promise is needed because of angular bug: https://github.com/angular/angular/issues/15634
this.ciamModal = this.modalService.open(this.ciamcheck, {ariaLabelledBy: "modal-basic-title", keyboard: false});
this.ciamModal.result.then((result) => {
// will be closed from code
}, (reason) => {
this.router.navigate(["/somewhere"]);
});
});
}
component.spec.ts
beforeEach(() => {
TestBed.configureTestingModule({
imports: [AppModule, AdminModule, SharedModule],
providers: [
{provide: APP_BASE_HREF, useValue: "/"},
{ provide: LOCALE_ID, useValue: "de" }
]
})
.compileComponents();
fixture = TestBed.createComponent(UserCreatorComponent);
component = fixture.componentInstance;
});
it("should display ciam lookup dialog", async((done) => {
fixture.whenStable().then(() => {
fixture.detectChanges();
expect(fixture.debugElement.query(By.css("#modal-basic-title")).nativeElement.innerHTML).toContain("E-Mail");
});
component.ngOnInit();
}));
when running the test i get the following error message:
TypeError: Cannot read property 'nativeElement' of null
at eval (webpack:///./src/app/admin/user-creator/user-creator.component.spec.ts?:117:95)
at ZoneDelegate.invoke (webpack:///./node_modules/zone.js/dist/zone.js?:387:26)
at AsyncTestZoneSpec.onInvoke (webpack:///./node_modules/zone.js/dist/zone-testing.js?:712:39)
at ProxyZoneSpec.onInvoke (webpack:///./node_modules/zone.js/dist/zone-testing.js?:284:39)
at ZoneDelegate.invoke (webpack:///./node_modules/zone.js/dist/zone.js?:386:32)
at Zone.run (webpack:///./node_modules/zone.js/dist/zone.js?:137:43)
at eval (webpack:///./node_modules/zone.js/dist/zone.js?:871:34)
at ZoneDelegate.invokeTask (webpack:///./node_modules/zone.js/dist/zone.js?:420:31)
at AsyncTestZoneSpec.onInvokeTask (webpack:///./node_modules/zone.js/dist/zone-testing.js?:696:25)
at ProxyZoneSpec.onInvokeTask (webpack:///./node_modules/zone.js/dist/zone-testing.js?:315:39)
at ZoneDelegate.invokeTask (webpack:///./node_modules/zone.js/dist/zone.js?:420:31)
at AsyncTestZoneSpec.onInvokeTask (webpack:///./node_modules/zone.js/dist/zone-testing.js?:696:25)
at ProxyZoneSpec.onInvokeTask (webpack:///./node_modules/zone.js/dist/zone-testing.js?:315:39)
error properties: Object({ rejection: TypeError: Cannot read property 'nativeElement' of null, promise: [object Promise], zone: Zone({ _properties: Object({ ProxyZoneSpec: ProxyZoneSpec({ defaultSpecDelegate: null, name: 'ProxyZone', properties: <circular reference: Object>, propertyKeys: null, lastTaskState: Object({ microTask: false, macroTask: true, eventTask: true, change: 'microTask' }), isNeedToTriggerHasTask: false, tasks: [ ZoneTask({ _zone: <circular reference: Object>, runCount: 0, _zoneDelegates: [ ZoneDelegate({ _taskCounts: Object, zone: <circular reference: Object>, _parentDelegate: ZoneDelegate, _forkZS: <circular reference: Object>, _forkDlgt: ZoneDelegate, _forkCurrZone: <circular reference: Object>, _interceptZS: <circular reference: Object>, _interceptDlgt: ZoneDelegate, _interceptCurrZone: <circular reference: Object>, _invokeZS: <circular reference: Object>, _invokeDlgt: ZoneDelegate, _invokeCurrZone: <circular reference: Object>, _handleErrorZS: <circular reference: Object>, _h ...
Error: Uncaught (in promise): TypeError: Cannot read property 'nativeElement' of null
at resolvePromise (webpack:///./node_modules/zone.js/dist/zone.js?:813:31)
at eval (webpack:///./node_modules/zone.js/dist/zone.js?:876:17)
at ZoneDelegate.invokeTask (webpack:///./node_modules/zone.js/dist/zone.js?:419:36)
at Zone.runTask (webpack:///./node_modules/zone.js/dist/zone.js?:187:47)
at drainMicroTaskQueue (webpack:///./node_modules/zone.js/dist/zone.js?:594:35)
I already tried several different approaches with fakeAsync and tick() and without async with different variations - with the same or simmilar result as seen above.
Does somebody have a tip for me on how to do it right?
Aucun commentaire:
Enregistrer un commentaire