samedi 2 janvier 2021

How can I test code inside an Angular subscribe block without values being overwritten in subsequent subscribe blocks?

I'm using ngx-socket-io in an Angular application, and I have a component which includes various .subscribe blocks inside an ngOnInit(), which will subsequently run when data is received from the server

My problem is that when I call ngOnInit() inside my test suite, I am unable to test if a component variable is set to something inside one specific subscribe block, because it will be overwritten inside another subscribe block.

For example:

Component:

  ngOnInit(): void {
    this.setupBroadcastSubscriptions();
  }

  public setupBroadcastSubscriptions() {
    this.joinGameService.isHost()
      .subscribe((data: any) => {
         this.hostName = data.hostName;
      });
    this.gameService.onUserDisconnection()
      .subscribe((data: any) => {
        this.toastr.info(data.message);
        this.playersInLobby = data.players;
        this.hostName = data.players.find(player => player.isHost).username;
      });
}

Test:

  test('when the first user enters a lobby, it should set the hostName to the user emitted from the server', () => {
    component.ngOnInit();
    expect(component.hostName).toEqual('james');
  });

(Mocks in test suite are omitted for brevity)

I want to test what is happening specifically with hostName inside the isHost subscription. However, hostName will be overwritten inside the onUserDisconnection subscription.

One solution for this would be to create a method inside the subscribe blocks and test that method individually, but I don't want to test private methods.

What's the best approach for this?

Aucun commentaire:

Enregistrer un commentaire