微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

单元测试 Angular:多次使用 control.setValue(...) 时,仅在测试结束时触发 valueChanges

如何解决单元测试 Angular:多次使用 control.setValue(...) 时,仅在测试结束时触发 valueChanges

我想用 FormControl 测试一个组件。以下是组件代码的风格:

[...]
export class MyComponent implements OnInit {
  control: FormControl = new FormControl();
  observable$: Observable<any>;

  ngOnInit() {
    this.observable$ = this.control.valueChanges.pipe([some modifiers]);
  }

}

和我的测试:

[...]

  it('should ...',() => {
    let result;
    component.observable$.subscribe((res) => {
      result = res;
    });

    expect(result).toVerifySomeCondition();

    component.control.setValue('some_value');
    expect(result).toVerifySomeOtherCondition();

    component.control.setValue('some_other_value');
    expect(result).toVerifySomeThirdCondition();
  });

...

问题是,订阅 component.observable$ 仅在测试结束时触发。所以测试失败了。

我尝试过类似的东西:

[...]

  it('should ...',fakeAsync(() => {
    let result;
    component.observable$.subscribe((res) => {
      result = res;
    });

    expect(result).toVerifySomeCondition();

    tick();

    component.control.setValue('some_value');
    expect(result).toVerifySomeOtherCondition();

    tick();

    component.control.setValue('some_other_value');
    expect(result).toVerifySomeThirdCondition();
  }));

...

但后来出现错误Error: 1 periodic timer(s) still in the queue.

如何测试 FormControl 的连续更改?

编辑:我也尝试过 fixture.detectChanges(),但没有成功。

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。