![](/img/trans.png)
[英]Unit Testing Angular components with rxjs Subjects using Jasmine
[英]Angular, Subjects Unit Testing
我们最近在 Angular 7 中主要基于这个解决方案实现了一个消息服务,但我们坚持单元测试实现。
我们有这样的服务:
@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();
});
我们在那里迷路了,有人可以帮助我们吗? 谢谢!
如果您查看源代码,您会注意到每当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();
});
如果您的目标只是模拟消息(您的服务)的发送/接收,您可以只对消息服务使用模拟。
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');
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.