web-dev-qa-db-fra.com

Quelle est la différence entre tick () et flush () dans les tests angular?

Sur la documentation angular, je vois ces deux fonctions, tick() et flush() . Les deux de ceux-ci semblent faire des choses similaires. Dans la documentation angular, il est indiqué pour tick:

Simule le passage du temps asynchrone pour les temporisateurs dans la zone fakeAsync.

et pour le rinçage:

Simule le passage du temps asynchrone pour les temporisateurs dans la zone fakeAsync en vidant la file d'attente des macrotask jusqu'à ce qu'elle soit vide. La valeur renvoyée correspond aux millisecondes de temps qui se seraient écoulées.

Quelqu'un peut-il m'expliquer la différence?

EDIT (répondu dans les commentaires):

De plus, dans la documentation angulairetick() est utilisé sans paramètres, et le commentaire sur cette ligne utilise même l'expression "flush"

it('should display error when TwainService fails', fakeAsync(() => {
  // tell spy to return an error observable
  getQuoteSpy.and.returnValue(
    throwError('TwainService test failure'));

  fixture.detectChanges(); // onInit()
  // sync spy errors immediately after init

  tick(); // flush the component's setTimeout()

  fixture.detectChanges(); // update errorMessage within setTimeout()

  expect(errorMessage()).toMatch(/test failure/, 'should display error');
  expect(quoteEl.textContent).toBe('...', 'should show placeholder');
}));
angulartypescripttestingionic-frameworkjasmine
8
Justin Kavalan

Ils font différentes choses par rapport aux opérations asynchrones qui ont été précédemment démarrées . Par exemple; l'appel de setTimeout(...) démarre une opération asynchrone.

  • tick() avance temps vers l'avant.
  • flush() déplace le temps à la fin.

Cela peut être mieux illustré par les tests unitaires de ces fonctions.

Tick

Ce test unitaire montre que le tick est utilisé pour avancer le temps en pas jusqu'à ce que 10 les minuteries sont terminées. Tick ​​est appelé plusieurs fois.

https://github.com/angular/angular/blob/master/packages/core/test/fake_async_spec.ts#L205


      it('should clear periodic timers', fakeAsync(() => {
           let cycles = 0;
           const id = setInterval(() => { cycles++; }, 10);

           tick(10);
           expect(cycles).toEqual(1);

           discardPeriodicTasks();

           // Tick once to clear out the timer which already started.
           tick(10);
           expect(cycles).toEqual(2);

           tick(10);
           // Nothing should change
           expect(cycles).toEqual(2);
         }));

Affleurer

Ce test unitaire montre que toutes les tâches asynchrones doivent être terminées à son retour et que la valeur renvoyée vous indique combien de temps il leur a fallu pour terminer.

https://github.com/angular/angular/blob/master/packages/core/test/fake_async_spec.ts#L27

      it('should flush multiple tasks', fakeAsync(() => {
           let ran = false;
           let ran2 = false;
           setTimeout(() => { ran = true; }, 10);
           setTimeout(() => { ran2 = true; }, 30);

           let elapsed = flush();

           expect(ran).toEqual(true);
           expect(ran2).toEqual(true);
           expect(elapsed).toEqual(30);
         }));
10
Reactgular