angularunit-testingjasmineeventemitterangular-event-emitter

Subscribe EventEmmiter in an other service angular unit test


I try to test EventEmitter is correctly call in an angular service. But I have two service.

Service One

public methodToTestInServiceOne(message: string) {
  this.serviceTwo.methodInServiceTwo(message);
}

Service Two

public onMessageStart = new EventEmitter();
public onMessageEnd = new EventEmitter();

public methodInServiceTwo(message: string): void {
    this.onMessageStart.emit(message);
    /* Code... */
    this.onMessageEnd.emit(message);
  }

Unit test Service One

describe("serviceOne", (): void => {
  let serviceOne: ServiceOne;
  let serviceTwo: ServiceTwo;

  beforeEach((): void => {
    TestBed.configureTestingModule({ providers: [] });
    service = TestBed.inject(ServiceOne);
    serviceTwo = TestBed.inject(ServiceTwo);
  });

  describe("methodToTestInServiceOne", (): void => {
    it("should call EventEmmiter", (): void => {
      let isMessageSend: boolean = false;

      serviceTwo.onMessageEnd.subscribe((message: string): void => {
        isMessageSend = true;
      });

      serviceOne.methodToTestInServiceOne("Hello World !");

      expect(isMessageSend).toBeTruthy();
    });
  });
});

This code doesn't works, but if I called directly my service two.

serviceTwo.methodInServiceTwo("Hello World !")

The test works ! Please, how I can test my EventEmitter calling serviceOne ?


Solution

  • Try putting ServiceOne and ServiceTwo in the providers array of the TestBed.

    Try this:

    describe("serviceOne", (): void => {
      let serviceOne: ServiceOne;
      let serviceTwo: ServiceTwo;
    
      beforeEach((): void => {
        TestBed.configureTestingModule({ 
          providers: [
            ServiceOne,
            ServiceTwo, // !! - Add these two here - !!
          ] 
        });
        service = TestBed.inject(ServiceOne);
        serviceTwo = TestBed.inject(ServiceTwo);
      });
    
      describe("methodToTestInServiceOne", (done): void => { // !! add done here
        it("should call EventEmmiter", (): void => {
          let isMessageSend: boolean = false;
    
          serviceTwo.onMessageEnd.subscribe((message: string): void => {
            console.log(`1.) subscribing to message, ${message}`);
            console.log(`2.) Setting isMessageSend to true`);
            isMessageSend = true;
            done(); // !! call done to let Jasmine know we are done with the test
          });
    
          serviceOne.methodToTestInServiceOne("Hello World !");
          console.log(`3.) Checking isMessageSend is truthy`);
          expect(isMessageSend).toBeTruthy();
        });
      });
    });
    
    public methodToTestInServiceOne(message: string) {
      console.log('[Service One] calling method in service two');
      this.serviceTwo.methodInServiceTwo(message);
    }
    ....
    public methodInServiceTwo(message: string): void {
        this.onMessageStart.emit(message);
        /* Code... */
        console.log('[Service Two] onMessageEnd being emitted');
        this.onMessageEnd.emit(message);
      }