web-dev-qa-db-fra.com

Tester une fonction contenant un setTimeout ()

J'ai une fonction de fermeture dans mon composant qui contient une setTimeout() afin de donner le temps à l'animation de se terminer.

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

this.show est lié à une ngIf.

this.animate est lié à une animation.

J'ai un test qui doit tester cette fonction

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)
})

Comment testez-vous correctement cette fonction quand il y a une setTimeout()?

J'utilisais jasmine.clock().tick(251) mais la fenêtre ne disparaîtrait jamais. des idées à ce sujet aussi?

angulartestingjasminesettimeoutkarma-jasmine
18
ed-tester

Vous pouvez faire l'une des deux choses suivantes:

1: Attendez réellement dans le test 250 + 1 ms dans une setTimeout(), puis vérifiez si l'élément a réellement disparu.

2: utilisez fakeAsync() et tick() pour simuler la durée du test - une tick() résoudra setTimeout dans la close() originale et la vérification pourrait avoir lieu juste après dans une fixture.whenStable().then(...).

Par exemple:

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)
  })
}))

Je suggère d'utiliser le second, car il est beaucoup plus rapide que d'attendre la méthode originale. Si vous utilisez toujours le premier, essayez de réduire le délai d’exécution avant le test pour accélérer son exécution.

44
Mezo Istvan

J'ai juste essayé ceci dans mon projet et fonctionne:

jasmine.clock (). tick (10);

1
Jack Luo