Angular 中可观察响应改变的测试值

问题描述

如果我想测试下面的代码

even: boolean;

ngOnInit(

this.myService.obs.subscribe(response: number => {

if (response % 2 === 0){ this.even = true } else {this.even = false}

});
)

对于 this.even 的值,在我使用 jasmine-marbles 的单元测试中是这样的


const responses = cold('a-b-c-',a: 3,b:4,c:5);
const expected = cold('-d-e-f',d: false,b: true,c: false);

component.ngOnInit();

expect(component.even).toEqual(expected);

显然这不起作用,因为 this.even 不是可观察的,而冷需要类型 TestColdobservable。有没有办法使用茉莉花弹珠或其他基本测试框架来测试 this 值随时间的变化?

解决方法

虽然我不擅长jasmine-marbles,但我认为这样的事情可以工作。

import { map } from 'rxjs/operators';
....
even$: Observable<boolean>;

ngOnInit(
  this.even$ = this.myService.obs.pipe(map(response => response % 2 === 0));
}

/////
// assuming responses is tied to myService.obs
const responses = cold('a-b-c-',a: 3,b:4,c:5);
const expected = cold('-d-e-f',d: false,b: true,c: false);

component.ngOnInit();

expect(component.even$).toEqual(expected);

基本上,我们将比较的两个事物都转换为 observable,您可以使用 even$ 管道订阅 HTML 中的 async observable。