web-dev-qa-db-fra.com

quelle est la vraie différence entre ng test et ng e2e

J'ai peur que quelqu'un ferme ma question mais je n'ai pas trouvé de question satisfaisante (peut-être parce que je suis très limité dans le monde Angular 2+ et j'ai compris quelque chose de mal)).

Pour autant que je puisse comprendre après quelques Hello World et quelques démos YouTube regardées:

test ng:

  • vous écrivez votre test en utilisant le langage Jasmine
  • vous testez votre test avec de nombreux navigateurs disponibles en utilisant Karma
  • vous exécutez des tests unitaires ou intégrés
  • tout xxx.compnent.spec.ts exécuter et un rapport final similaire à JUnit est affiché dans le navigateur

ng e2e:

  • vous écrivez votre test en utilisant le langage Jasmine
  • vous testez votre test avec de nombreux navigateurs disponibles en utilisant Karma

  • vous écrivez vos tests en tenant compte de l'imbrication de l'événement utilisateur

    eg. page.navigateTo();
page.getParagraphText()
  .then(msg => expect(msg).toEqual('Welcome to app!!'))
  .then(msg => expect(msg).toEqual('xxx'))
  .then(done, done.fail);

  • vous exécutez le test de bout en bout en utilisant le rapporteur principalement après avoir déployé l'application une sorte d'environnement de pré-production

  • les tests sous dossier e2e sont déclenchés et le résultat est imprimé dans la console de ligne de commande

En théorie, le second est spécifique de bout en bout où l'accent est mis sur la simulation d'un flux complet effectué par un utilisateur final.

J'espère que jusqu'à ce que ce soit correct, je me demande ce qui se passe derrière la scène qui les rend vraiment différents. Je ne veux pas comparer ce qui est mieux, mais je manque certainement un point parce que j'ai créé quelques tests en utilisant exactement la même idée faite par l'utilisateur final et je l'ai déclenchée par ng test.

Par exemple:

...

it('should display the modal when `create Paste` is clicked', () => {

    let createPasteButton = fixture.debugElement.query(By.css("button"));
    //create a spy on the createPaste  method
    spyOn(component,"createPaste").and.callThrough();

    //triggerEventHandler simulates a click event on the button object
    createPasteButton.triggerEventHandler('click',null);

    //spy checks whether the method was called
    expect(component.createPaste).toHaveBeenCalled();
    fixture.detectChanges();
    expect(component.showModal).toBeTruthy("showModal should now be true");
    expect(element.innerHTML).toContain("source-modal");
});

...

Je me suis souvenu avoir lu quelque chose comme "le rapporteur offre un comportement d'attente/de sommeil pendant l'exécution des tests" mais je ne peux pas voir où cette valeur agrégée lorsque je vois les tests effectués sans rapporteur a pu simuler un utilisateur final également. Tant que vous codez vos tests pour faire exactement le même flux que celui fait par un utilisateur final, ce sera le même test e2e proposé dans le dossier e2e créé par Angular Cli.

Si mon étude m'a conduit à comprendre correctement comme indiqué ci-dessus, la seule vraie différence est la façon dont moi, en tant que développeur, organise mes tests. Il n'y a rien de vraiment différent derrière la scène.

Encore une fois, j'apprécierais que cela clarifie la question à des fins didactiques: il n'est nullement question de comparer les cadres ici.

angularjasmineprotractorangular-clikarma-jasmine
28
Jim C

Vous êtes sur la bonne voie pour tout comprendre.

  • Ng test (Jasmine + Angular Tests de tests d'utilitaires lancés via Karma):

Vous utilisez le framework jasmine pour écrire vos tests et les définir comme des suites et attendre des résultats que vous pouvez tester, mais l'essentiel est que vous utilisez en fait le lanceur de karma pour exécuter des tests directement sur le navigateur. Ceci est normalement configuré dans l'application angular.

Cela signifie qu'un seul serveur exécute les tests et c'est tout. Vous testez avec vos propres valeurs et vérifiez que vos composants fonctionnent correctement.

Le but est de vérifier pour des composants uniques (test unitaire) ou plusieurs modules/composants (tests d'intégration) qu'une seule fonction/petit workflow fonctionne correctement comme prévu sans effets secondaires.

  • Ng E2E (jasmin + rapporteur):

Protractor est un cadre de test de bout en bout pour les applications Angular et AngularJS. Protractor exécute des tests sur votre application exécutée dans un navigateur réel, interagissant avec elle comme le ferait un utilisateur.

Ici, les tests que vous avez écrits agiront en tant qu'utilisateur. Cela signifie que votre application s'exécute dans votre navigateur et qu'un autre programme exécutera les tests par rapport à votre application, simulant une interaction utilisateur.

Ceci est très important, car cela signifie deux choses:

  1. Les tests unitaires et les tests d'intégration utilisent des données statiques et factices pour exécuter les tests.
  2. Les tests de rapporteur utilisent des données réelles et effectuent les appels HTTP (ou tout ce que vous utilisez) pour récupérer les données et les consommer/tester.

L'objectif du rapporteur est de valider un workflow opérationnel complet dans votre application. Par exemple, j'écrirai mon test unitaire pour mon composant de connexion, j'écrirai un test unitaire pour mon service de connexion, j'écrirai un test d'intégration pour l'ensemble de mon module et quel que soit le comportement à tester qui dépend de plusieurs composants/services. Une fois cela fait, j'écrirai plus tard un test de bout en bout complet qui validera tout mon processus d'authentification dans mon application.

Gardez à l'esprit qu'il y a un ratio qui est important dans les tests qui est très logique:

  • Les tests unitaires devraient représenter 70% de vos tests.
  • Les tests d'intégration devraient représenter 20% de vos tests.
  • Les tests E2E devraient représenter 10% de vos tests.

Pourquoi donc ? Parce que si vous avez testé correctement un grand nombre de vos composants, vous n'aurez pas besoin de le tester à nouveau dans vos tests de bout en bout.

Conclusion:

  • Ils fonctionnent différemment et leur objectif est de tester différentes choses (fonction de l'unité/flux de travail complet).
  • Ils sont complémentaires, ce qui signifie que si vous ne réalisez que des tests unitaires/d'intégration, vous n'aurez jamais la garantie qu'un workflow fonctionnera de A à Z; ainsi que si vous écrivez uniquement des tests E2E, vous ne pourrez jamais confirmer qu'il n'y a pas d'effets secondaires dans votre flux de travail.

N.B.: Soyez également conscient de ces points:

  • Jasmine, Karma et Protractor peuvent être personnalisés à volonté, vous pouvez donc les faire sortir dans un fichier XML qui pourrait être traité par un travail Jenkins au lieu d'une ligne de commande qui n'est pas pratique.
  • Oui, vous pouvez écrire le même code pour les deux et tester efficacement la même chose, mais gardez à l'esprit que ce que vous voulez, c'est être efficace et écrire du code de test maintenable. Les ratios dont j'ai parlé sont très importants.

J'espère que cela t'aides.

37
Alex Beugnet