Expected spy navigate to have been called with [ 'accounts' ] but it was never called

Question

I am writing unit test for Angular app. I want to test if router.navigate is taking me to correct location or not .

When API responds success router.navigate takes to different location. But the test fails with 'Expected spy navigate to have been called with [ 'accounts' ] but it was never called.'

AccountsListComponent.ts

 deleteRecord(id) {
    this.http.delete('/api/accounts/' + id)
    .subscribe(res => {
        if (res['status'] == "FAILURE") {
          console.log("failure");
        } else {
          console.log("API responded success"); //this is printed
          this.router.navigate([ '/accounts' ]); // I want to test this
        }
      }, (err) => {
           console.log(err);
      }
    );
  }

component.spec.ts

  routerStub = {
      navigate: jasmine.createSpy('navigate'),
    };

    TestBed.configureTestingModule({
      imports:[RouterTestingModule,FormsModule,ReactiveFormsModule,HttpClientTestingModule,RouterTestingModule.withRoutes([{ path: 'accountsList', component: AccountsListComponent}])],
      declarations: [ AccountDetailComponent,AccountsListComponent ],
      schemas:[CUSTOM_ELEMENTS_SCHEMA]
    })


it ('should delete account, if account exist and take back to accountsList page', ()=> {
    let spyOnDelete = spyOn (component,'deleteRecord').and.callThrough();
    fixture.detectChanges();
    component.record.AccountID = "account";
    fixture.detectChanges();
    let deleteButtonDOM = fixture.debugElement.query(By.css('#deletebtn'));
    deleteButtonDOM.triggerEventHandler('click',null);
    fixture.detectChanges();
    expect(spyOnDelete).toHaveBeenCalled(); //passes
    const req = _HttpTestingController.expectOne('/api/accounts/'+ component.record.AccountID);
    expect(req.request.method).toBe("DELETE");
    req.flush({status:"SUCCESS"});
    expect(routerStub.navigate).toHaveBeenCalledWith('accounts');//fails???

  }) 

Answer 1

You are spying on your function deleteRecord, that means the call will go through without executing the function. You should not spy on the function you are testing, rather you should spy on http.delete() function.