web-dev-qa-db-fra.com

Quelle est la bonne façon de tester de bout en bout (e2e) dans Vue.js

Je peux utiliser Selenium-standalone avec xpath pour tester une application. Mais tester SPA pourrait parfois être difficile.

Mais, par exemple l'équipe d'angularjs fournit rapporteur à cet effet.

La raison derrière le rapporteur comme je peux le voir est que le rapporteur attend que les angularjs soient chargés et quelques fonctionnalités supplémentaires:

Protractor fournit de nouvelles stratégies et fonctions de localisation qui sont très utiles pour automatiser l'application AngularJS. Les exemples incluent des choses comme: waitForAngular, By.binding, By.repeater, By.textarea, By.model, WebElement.all, WebElement.evaluate, etc.

Donc, la question est : Est-ce un outil ou une meilleure pratique pour les tests e2e dans Vuejs?

UPD: n'hésitez pas à publier des liens vers des tutoriels, des exemples et tout ce qui est cool sur les tests e2e dans vue.js. Merci.

34
Sergei Panfilov

L'outil auquel vous pensez est Nightwatch . Avec cela, vous pouvez faire des tests E2E avec Vue.js.

Encore mieux, cela est fourni par défaut lorsque vous utilisez vue-cli, prêt à courir.

La ligne de commande pour créer un projet avec Nightwatch activé par défaut est vue init webpack myProjectName.

Voici petittutoriels à ce sujet.

EDIT: Dernièrement, j'ai beaucoup utilisé Webdriver.io , et je dois dire que je le préfère à Nightwatch (meilleure documentation, communauté réactive avec un gitter en direct, problèmes traités en temps opportun, etc.)

23
Alex

Je recommande d'utiliser https://devexpress.github.io/testcafe .

Avantages:

  • installation facile
  • harnais de test complet
  • javascript ES2016 avec (async/attente)
  • système de sélection flexible
  • assertions intelligentes avec stratégie de nouvelle tentative
  • rapports

Voir le tutoriel simple ici

17
mlosev

Je recommande Cypress .

  • dépendance NPM unique
  • enregistrement vidéo dès la sortie de la boîte
  • GUI qui montre chaque étape du test.

Nos documents sont excellents: https://on.cypress.io/intro

Pour Vue voir spécifiquement ce tutoriel: https://vuejsdevelopers.com/2018/01/29/vue-js-e2e-test-hacker-news/ et si vous voulez faire des tests unitaires des composants Vue https://github.com/bahmutov/cypress-vue-unit-test

Bon test.

6
gleb bahmutov