5

RxJs Observables を使用して Angular で非常に単純なテストを実行しようとしていますが、不足しています。これは私が基本的にテストしようとしているものです:

// We're inside some Angular component here...
let testMe = 0;

function somethingOrOther(): void {

    this.someService.methodReturningObservable()
      .subscribe(
          (nextValue: number): void => {
              testMe += nextValue;
          }
      ) 
}

testMeオブザーバブル ビハインドが値を発行したときに適切に更新されることをテストするにはどうすればよいmethodReturningObservableですか?

私はこれでそれを試みました：

it(`works 'cuz I want it to`, fakeAsync(() => {
    spyOn(this.someService, 'methodReturningObservable').and.returnValue(cold('a', {a: 10}));

    tick();

    expect(component.testMe).toBe(10);
}));

だから、tick()ここでは何もしていないようです。cold私のスパイで放出する価値 はありません。

ビー玉セクションの下のhttps://netbasal.com/testing-observables-in-angular-a2dbbfaf5329getTestScheduler.flush()に示されているように、代わりに試しました。

このようなビー玉を使用して、オブザーバブルに値を発行できますか? これは AngularJS ではダイジェストをトリガーするだけで非常に簡単でしたが、オブザーバブルの次のコールバックで Anguar に許可してもらえないようです。

4

1 に答える 1

3

簡単なStackblitzをまとめて、説明した単純なコンポーネント メソッドのテストにどのようにアプローチするかを示します。

その Stackblitz の仕様は次のとおりです。

it(`works with "of" 'cuz I want it to`, () => {
    spyOn(someService, 'methodReturningObservable').and.returnValue(of(10));
    component.somethingOrOther();
    expect(component.testMe).toBe(10);
});

コードに加えた変更の一部:

  • コンポーネントメソッドを機能させるには、コンポーネントメソッドに小さな変更を加える必要がありました。Stackblitz の詳細。
  • このcold()関数は大理石のテスト ライブラリからのものですが、このような単純な関数にはやり過ぎです。サブスクライブできるコールド同期オブザーバブルを作成できる Observable 作成メソッドが利用可能です (ただし、この方法で本当にテストしたい場合は、以下で詳しく説明します) rxjs。of
  • 上記の仕様は同期オブザーバブルを使用しているためfakeAsync()、すぐに完了するため、 は必要ありません。
  • テスト対象のメソッドは、テストするために明示的に呼び出す必要があり、上記の行で実行されますcomponent.somethingOrOther()。

Stackblitz でわかるように、このテストは問題なくパスします。

さて、この単純なケースでもマーブル テストを使用したい場合は、そのために Stackblitz に別の仕様を設定します。それは次のとおりです。

it(`works with "cold" 'cuz I want it to`, () => {
    spyOn(someService, 'methodReturningObservable').and.returnValue(cold('a', { a: 10 }));
    component.somethingOrOther();
    getTestScheduler().flush(); // flush the observables
    expect(component.testMe).toBe(10);
});
  • コンポーネント関数を呼び出す必要があることに注意してください
  • getTestScheduler のフラッシュも行う必要があります。

両方のテストが Stackblitz でパスするようになりました。

Angular でのマーブル テストの公式ドキュメントはこちらです。

これが役立つことを願っています。

于 2018-12-14T03:55:07.843 に答える