角度,主题单元测试

时间:2019-02-20 09:19:33

标签: angular unit-testing jasmine rxjs observable

我们最近在Angular 7中实现了一个主要基于this solution的消息服务,但是在单元测试实现上却停留了一段时间。

我们有这项服务:

@Injectable()
export class MessageService {
  private subject = new Subject<any>();
  sendMessage(message: MessageInput) {
    this.subject.next(message);
  }
  clearMessage() {
    this.subject.next();
  }
  getMessage(): Observable<any> {
    return this.subject.asObservable();
  }
}

我们有了这个实现,监听另一个组件发送的消息:

ngOnInit() {
this.subscription = this.messageService.getMessage().subscribe(
  (message: MessageInput) => {
    if (message) {
      .....
    }
  }, () => {
      .....
  }
)};

我们想对实现进行单元测试,但是我们无法模拟消息的发送和接收。我们正在尝试:

beforeEach(() => {
  TestBed.configureTestingModule({
    schemas: [NO_ERRORS_SCHEMA],
    declarations: [...],
    providers: [
      ...
      MessageService
    ],
    imports: [...]
  });
  fixture = TestBed.createComponent(...);
  component = fixture.componentInstance;
  fixture.detectChanges();
});

it('makes ngOnInit expected calls', () => {
  const messageService: MessageService = fixture.debugElement.injector.get(
    MessageService
  );
  component.ngOnInit();
  expect(component.subscription).toBeDefined();
  const message: MessageInput = {text: TypeMessage...., data: '...'};
  const nextSpy = spyOn(messageService.getMessage(), 'subscribe');
  messageService.sendMessage(message);
  expect(nextSpy).toHaveBeenCalled();
});

我们在那里迷失了方向,有人可以帮助我们吗?谢谢!

2 个答案:

答案 0 :(得分:1)

如果您查看at the source,则会注意到,每次调用asObservable时,都会创建并返回一个新对象。因此,您基本上是在监视错误的对象。

您可以通过以下重构来解决这个问题:

@Injectable()
export class MessageService {
  private subject = new Subject<any>();
  public readonly messages$ = this.subject.asObservable();

  sendMessage(message: MessageInput) {
    this.subject.next(message);
  }
  clearMessage() {
    this.subject.next();
  }
  getMessage(): Observable<any> {
    return this.messages$;
  }
}

并如下更新测试:

it('makes ngOnInit expected calls', () => {
  const messageService: MessageService = fixture.debugElement.injector.get(MessageService);
  const nextSpy = spyOn(messageService.messages$, 'subscribe');

  component.ngOnInit();
  messageService.sendMessage(message); 

  expect(component.subscription).toBeDefined();
  expect(nextSpy).toHaveBeenCalled();
});

答案 1 :(得分:1)

如果您的目标只是模拟邮件的发送/接收(您的服务), 您可以仅对消息服务使用模拟。

mockSubject = new Subject();
mockSubject =next({'Message'})

mockMessangerService= {
 getMessage:  jasmine.createSpy('openConfirmModal').and.returnValue(mockSubject.asObservable()),
 sendMessage: jasmine.createSpy('sendMessage')
}

TestBed.configureTestingModule({
 ...
 }).overrideComponent(*component*,
{   
  set: { providers: [{provide: MessageService , useValue: mockMessangerService}]}
}....

那么您就可以测试您的间谍

expect(mockMessangerService.getMessage).toHaveBeenCalled();
expect(mockMessangerService.sendMessage).toHaveBeenCalledWith('Message');