Wait for ngOnInit to finish in Jasmine Angular2

Question

I'm unit testing a component and this is what I have:

describe('Component: nav', () => {    beforeEach(() => addProviders([     provide(UserService, {useClass: MockUserService}),     NavComponent   ]));    it('should have a property \'firstName\' with the value \'Crazypug\'',     async(inject([NavComponent], (component) => {       component.ngOnInit();       expect(component.firstName).toEqual('Crazypug')     }))   );  }); 

This is the ngOnInit function:

ngOnInit() {     this.userService.getFirstNameCall().subscribe(       data => {this.firstName = data.firstname; }); } 

When I run the test I get:

Expected undefined to equal 'Crazypug'

How can I let Jasmine wait for the ngOnInit function to finish? I found some solutions on SO but from a long time ago (in angular2 terms of time). They were very complicated or outdated.

Answer 1

You should replace async function for fakeAsync

import {..., tick, fakeAsync} from '@angular/core/testing'; ... fakeAsync(inject([NavComponent], (component) => {   component.ngOnInit();   tick();   expect(component.firstName).toEqual('Crazypug') }))