单元测试Angular服务

Question

I'm struggling with testing a service in an Angular project. The service is pretty small but i can't figure out how to test the observer in the class.

I am trying to test a method of this class. The public methods must do what it promises to do. When I call the 'pop' method, the test fails. Since the pop method is public and has a Message as return values, this method should return a message after invoke it. The underlying code is less relegant in the case of testing.

The reason the test fails is because the observer is still undefined at that moment. I suggest that the reason is because the callback method is not executed at the moment when i call the pop method in the test, thus the addMessage observer is not intialized yet.

Since I have just started on this project, I am cautious about assumptions about the code. Does anyone have a suggestion on how I could test this code?

Is it right that the pop method is public or should it be private?

Edit: The pop method is used by a few other classes an can't be private. My question is actualy: Is this implementation of this service right?

    import { Injectable } from '@angular/core';
    import { Observable } from 'rxjs';
    import { share} from 'rxjs/operators';
    import { Observer } from 'rxjs';
    import { Message } from 'primeng/components/common/api';


    @Injectable()
    export class FeedBackService {
      obsAddMessage: Observable;
      obsClearMessages: Observable;
      /** @internal */
      private clearMessages: Observer;
      private addMessage: Observer;

      /**
       * Creates an instance of FeedBackService.
       */
      constructor() {
        this.obsAddMessage = new Observable(observer => this.addMessage = observer).pipe(share());
        this.obsClearMessages = new Observable(observer => this.clearMessages = observer).pipe(share());
      }


      /**
       * Synchronously create and show a new message instance.
       *
       * @param {(string | Message)} type The type of the message, or a Message object.
       * @param {string=} title The message title.
       * @param {string=} body The message body.
       * @returns {Message}
       *          The newly created Message instance.
       */
      pop( type: string | Message, title?: string, body?: string ): Message {
        const message: any = typeof type === 'string' ? {severity: type, summary: title, detail: body} : type;

        if (!this.addMessage) {
          throw new Error('No Containers have been initialized to receive messages.');
        } else {
          this.addMessage.next(message);
        }
        return message;
      }
    }

The Test:

import {Message} from 'primeng/components/common/api';
    import {FeedBackService} from './feedback.service';


    fdescribe('Service: Feedback', () => {

      let feedbackService: FeedBackService;
      const MESSAGE: Message = {severity: 'This is a message', summary: 'Title', detail: 'Body'};
      const SEVERITY = 'severity';
      const SUMMARY = 'summary';
      const DETAIL = 'detail';

      beforeEach(() => {
        feedbackService = new FeedBackService();
      });



      it('#pop should return the message when passing in a message', () => {
        let returnMessage = feedbackService.pop(MESSAGE);
        expect(returnMessage).toEqual(MESSAGE);
      });
    });

The Error:

Answer 1

Like any Observable, obsAddMessage isn't executed until subscribed to, and therefore as you demonstrated the observer is still undefined if you attempt to push a new value in before subscribing. The solution is simply to set up a subscribe before calling feedbackService.pop() .

I set up a simple Stackblitz to show what I mean. The spec from that Stackblitz is:

it('#pop should return the message when passing in a message', () => {
  feedbackService.obsAddMessage.subscribe(message => console.log(message));
  let returnMessage = feedbackService.pop(MESSAGE);
  expect(returnMessage).toEqual(MESSAGE);
});

I hope this helps.