web-dev-qa-db-ja.com

Vue.jsでのエンドツーエンド（e2e）テストの適切な方法は何ですか

原因として、xpathで Selenium-standalone を使用してアプリをテストできます。ただし、SPAのテストはいつか困難になる可能性があります。

しかし、たとえばangularjsのチームはこの目的のために 分度器 を提供しています。

分度器の背後にある理由は、angularjsがロードされるまで分度器が待機し、さらにいくつかの機能があることです。

分度器は、AngularJSアプリケーションの自動化に非常に役立ついくつかの新しいロケーター戦略と機能を提供します。例には、waitForAngular、By.binding、By.repeater、By.textarea、By.model、WebElement.all、WebElement.evaluateなどが含まれます。

だから、質問はです：Vuejsでのe2eテストのためのツールまたはベストプラクティスですか？

UPD：チュートリアル、例、およびvue.jsでのe2eテストに関するすべてのリンクをお気軽に投稿してください。ありがとう。

javascriptseleniumvue.jsacceptance-testinge2e-testing
34
Sergei Panfilov

考えているツールは Nightwatch です。これにより、Vue.jsでE2Eテストを実行できます。

さらに良いことに、これはvue-cliを使用しているときにデフォルトでバンドルされており、すぐに実行できます。

Nightwatchをデフォルトでアクティブにしてプロジェクトを作成するコマンドラインはvue init webpack myProjectNameです。

ここに smalltutorials があります。

編集：最近私は Webdriver.io を頻繁に使用しましたが、ナイトウォッチよりも好むと言わなければなりません（より良いドキュメント、ライブギターのあるリアクティブコミュニティ、タイムリーに処理される問題など）。

23
Alex

https://devexpress.github.io/testcafe を使用することをお勧めします。

長所：

  • 簡単インストール
  • 完全なテストハーネス
  • javascript ES2016と（async/await）
  • 柔軟なセレクターシステム
  • 再試行ポリシーを使用したスマートアサーション
  • レポート

簡単なチュートリアルを参照してください here

17
mlosev

Cypress をお勧めします。

  • 単一のNPM依存関係
  • すぐに使えるビデオ録画
  • テストのすべてのステップを示すGUI。

素晴らしいドキュメント： https://on.cypress.io/intro

Vue特にこのチュートリアルを参照してください： https://vuejsdevelopers.com/2018/01/29/vue-js-e2e-test-hacker-news/ およびVue components https://github.com/bahmutov/cypress-vue-unit-test の単体テストを行いたい場合

幸せなテスト。

6
gleb bahmutov