angularpromisespyon

How to spyOn method that returns Promise -Angular


The below method calls CheckLastEmployee method which returns true/false.

async nextEmployee(empId:number) {
    let isLast;
    await this.CheckLastEmployee(empId).then(x=>{isLast=x});
    if (isLast) {
        Submit();
    }
}

More logic inside CheckLastEmployee....copied a part of the code..

async CheckLastEmployee(empId:number){
    let enrollment = new Map<string, boolean>();
    await this.GetEnrolledPrograms().then(res => enrollment = res);
    if(empId==10)
        return true;
    else
        return false;
}

Test case .spec.ts

 it('Is Last Employee-submit',()=>{
        spyOn(component,'CheckLastEmployee').and.returnValue(Promise.resolve(true));
        spyOn(component,'Submit');
        component.nextEmployee(10);
        expect(component.Submit).toHaveBeenCalled();
    }

the above test case fails.


Solution

  • I think your test is missing async/await. Furthermore, I think in order to be able to see if your submit method was called, you need to spy on that method as well. Please try the following implementation to see if it solves your issue:

    it('Is Last Employee-submit', fakeAsync( () => {
        spyOn(component, 'CheckLastEmployee').and.resolveTo(true);
        let spy = spyOn(component, 'submit');  // Spy on submit method
        component.nextEmployee(10);
        tick(); // Try this
        expect(spy).toHaveBeenCalled(); // Now expect the spy to have been called if isLast is defined
    }));
    

    In case the above test didnt work, you can try tick(1000)(1000 milliseconds) or another value as well to just see if the test is failing due to a race condition or not.

    Side note:

    You need to import tick and fakeAsync:

    import {fakeAsync, tick} from '@angular/core/testing';