javascript - Angular 4 test fails when SetTimeout is used -

i have written simple test expect component truthy. working put settimeout in oninit started failing below.

error: timeout - async callback not invoked within timeout specified jasmine.default_timeout_interval.

describe('appcomponent', () => {   let appcomponent: appcomponent;   let fixture: componentfixture<appcomponent>;    beforeeach(async(() => {     var errormessages = new array<errormessage>();     errormessages.push(new errormessage(500));      testbed.configuretestingmodule({       declarations: [         appcomponent       ],       imports: [         routertestingmodule,         messagesmodule       ],       providers: [         { provide: authservice, usevalue: testhelper.createauthservicespy() },         { provide: errorhandlingservice, usevalue: testhelper.createerrorhandlingservicespy(errormessages) }       ]     }).compilecomponents();      fixture = testbed.createcomponent(appcomponent);     appcomponent = fixture.debugelement.componentinstance;     fixture.detectchanges();   }));    it('should create app', async(() => {     expect(appcomponent).tobetruthy();   }));    it('should show error in case of failure', async(() => {     expect(appcomponent.errormessage.length).tobe(1);   }));    it('should username loggedin user', async(() => {     expect(appcomponent.username).tobe("username");   })); }); 

all 3 of them fails , when commented settimeout started passing.

export class appcomponent implements oninit {     username: string = "";     errormessage: message[] = [];     showerror: boolean = false;     private activatedroute: activatedroute;     constructor(public authservice: authservice, private renderer: renderer, private errorhandlingservice: errorhandlingservice, private router: router, private titleservice: title) {         localstorage.removeitem(appconstants.authenticationlocalstoragekey);     }      ngoninit(): void {         this.router.events.subscribe(event => {             if (event instanceof navigationend) {                 var title = this.gettitle(this.router.routerstate, this.router.routerstate.root).join('-');                 this.titleservice.settitle(title);             }         });          this.errorhandlingservice.geterrors().subscribe(errormessages => {             let errormessage: errormessage = errormessages.pop();             this.errormessage = errormessage ? [{ severity: 'error', summary: `error code: ${errormessage.statuscode}`, detail: `(${errormessage.text})` }] : [];             this.renderer.setelementproperty(document.body, "scrolltop", 0);             this.showerror = true;             settimeout(() => {                 this.showerror = false;             }, appconstants.errormessagefadetime);         });         this.authservice.getusername().subscribe(data => this.username = data             , error => this.errorhandlingservice.handleerror(error, 'could not username'));     }      ondeactivate() {         //scroll top of page after routing         this.renderer.setelementproperty(document.body, "scrolltop", 0);     }      private gettitle(state, parent) {         var data = [];         if (parent && parent.snapshot.data && parent.snapshot.data.title) {             data.push(parent.snapshot.data.title);         }          if (state && parent) {             data.push(... this.gettitle(state, state.firstchild(parent)));         }         return data;     }   } 

below html

<div>         <div class="center-text">             <div class="errormessage" *ngif="showerror"><p-messages [value]="errormessage"></p-messages></div>             <router-outlet (deactivate)="ondeactivate()"></router-outlet>         </div>     </div> 

i tried fakesync , done still getting same error, suggestion?

i suggest create fake class below,

let erroroccured = false;  class fakeauthservice {     geterrors(){      return observable.of(erroroccured);     } }    providers: [     { provide: authservice, useclass: fakeauthservice},    ] 

inject testbed beforeeach by

authservice = testbed.get(authservice); 

declare variable in beforeeach async

let authservice : authservice 

update 1 :

have settimeout logic inside completion event of subscription

this.errorhandlingservice.geterrors().subscribe(errormessages => {     let errormessage: errormessage = errormessages.pop();     this.errormessage = errormessage ? [{ severity: 'error', summary: `error code: ${errormessage.statuscode}`, detail: `(${errormessage.text})` }] : [];     this.renderer.setelementproperty(document.body, "scrolltop", 0);     this.showerror = true;  },error=>{},  ()=>{     settimeout(() => {         this.showerror = false;     }, appconstants.errormessagefadetime); });