运行角度测试时无法识别 RxJs 运算符答案

【问题标题】：RxJs operators are not recognized while running angular tests运行角度测试时无法识别 RxJs 运算符
【发布时间】：2020-05-19 07:35:17
【问题描述】：

所以，我有一个组件，我在其中订阅 ngOnInit 生命周期的表单控件之一中的值更改。但是在为它编写测试的时候，我得到了一个与跳过不是函数有关的错误。

我的组件文件如下所示

  ngOnInit() {
    this.buildForm();
    this.cronTextSubscription = this.cronForm.get('emailCron').valueChanges
      .skip(3)
      .debounceTime(3000)
      .distinctUntilChanged()
      .subscribe(cronPattern => {
        this.updateEmailCronPattern(cronPattern);
      });
    this.fetchCronExpression();
  }

在运行测试时，我收到以下错误。

 TypeError: this.cronForm.get(...).valueChanges.skip is not a function

我是 Angular 测试的新手，因此非常感谢任何帮助。

【问题讨论】：

您的语法来自 RxJS 5。检查测试中您使用的是 RX5 还是 6。如果您使用的是 6，那么您应该改用 .pipe
使用管道代替对我有用。感谢您的帮助。

标签： javascript angular testing rxjs observable

【解决方案1】：

如果此代码在项目中有效，但在测试中出现问题，那么您需要验证测试中 this.cronForm.get('emailCron') 是否返回正确的数据。

另外你在这里使用了相当老的 rxjs 语法，请检查你的 rxjs 版本。也许是 6（但在这种情况下，项目也应该失败）。

那么你的代码应该是这样的：

  ngOnInit() {
    this.buildForm();
    this.cronTextSubscription = this.cronForm.get('emailCron').valueChanges.pipe(
      skip(3),
      debounceTime(3000),
      distinctUntilChanged(),
    ).subscribe(cronPattern => {
      this.updateEmailCronPattern(cronPattern);
    });
    this.fetchCronExpression();
  }

【讨论】：