setTimeout（）を含む関数のテスト

Question

私のコンポーネントには、アニメーションが完了するまでの時間を与えるためにsetTimeout()を含むclose関数があります。

public close() { 
    this.animate = "inactive" 
    setTimeout(() => { 
     this.show = false 
    }, 250) 
} 

this.showngIfにバインドされています。

this.animateは、アニメーションにバインドされています。

私はsetTimeout()がある場合にどのように適切にこの関数をテストするん

it("tests the exit button click",() => { 
    comp.close() 
    fixture.detectChanges() 
    //verifies the element is no longer in the DOM 
    const popUpWindow = fixture.debugElement.query(By.css("#popup-window")) 
    expect(popUpWindow).toEqual(null) 
}) 

この機能をテストする必要がテストを持っていますか？

私はjasmine.clock().tick(251)を使用していましたが、ウィンドウは消えません。これについても考えていますか？

Answer 1

次の2つのいずれかを実行できます。

1：実際の要素が実際に姿を消したかどうかを確認、その後、テストでsetTimeout()で250 + 1ミリ秒待ちます。

2：テストの時間をシミュレートするためfakeAsync()とtick()を使用する - tick()は元close()でのsetTimeoutを解決し、チェックがfixture.whenStable().then(...)に右後発生する可能性があります。例えば

：

it("tests the exit button click", fakeAsync(() => { 
    comp.close() 
    tick(500) 
    fixture.detectChanges() 

    fixture.whenStable().then(() => { 
    const popUpWindow = fixture.debugElement.query(By.css("#popup-window")) 
    expect(popUpWindow).toBe(null) 
    }) 
})) 

それは実際に元のメソッドを待っているよりもはるかに高速であるように私は、第二1を使用することをお勧め。それでも1を使用している場合は、テストの前にタイムアウト時間を短くしてテストを速くしてみてください。