AngularJSで単体テストとe2eテストを構成する方法は？

Question

JavaScriptシングルページアプリケーションの単体テストとエンドツーエンドテストが必要です。私はAngularJS分度器/キュウリを使ってe2e試験を行い、Chaiは単体テストを使用しています。

私は2つの異なるフォルダ（unitとe2eフォルダ）にe2eと単体テストを持っており、現在はpage objectデザインパターンを利用していません。ファイルは構造化されておらず、多くのコードを共有していないので、何度も繰り返しています。

私は、このアプローチは

は、私がテストコードのDRYを保ち、コードの最低額を書くような方法でテストを再編成することをお勧めありますアップスケールしない認識？

Answer 1

まず、ページオブジェクトパターンを使用してページオブジェクトを別のディレクトリに保存してください。ディレクトリpoを呼び出すことをお勧めします。ここで

は、我々が現在持っているあなたのためのサンプル、プロジェクト構造である：

$ cd e2e 
$ tree -L 1 
. 
├── config 
├── db 
├── helpers 
├── mocks 
├── po 
└── specs 

configは、我々のprotractorのconfigsを維持する特殊なディレクトリです - 複数のconfigsがあるかもしれません - 例えば、ローカルでテストする場合のために例えば、のテスト。

helpersは、基本的に私たちの "libs"/"utils"ディレクトリです。私たちはカスタムジャスミンマッチャー、ヘルパー機能を持つ追加の "ヘルパー"モジュールを保有しています。また、localStorageとsessionStorageモジュールは、window.localStorageとwindow.sessionStorageというオブジェクトに便利なラッパーです。

mocksは、私たちが保管するディレクトリです。protractor-http-mock mocksです。

poは、Page Objectsが定義されているディレクトリです。各ページオブジェクトは別々のファイルに格納されます。

specsはすべてのスペックが存在する場所で、論理的にはサブディレクトリに編成されています。

---

helpersライブラリのいくつかは、たとえばmade globally available via global次のとおりです。また

onPrepare: function() { 
    global.helpers = require("../helpers/helpers.js"); 
    // ... 
}, 

、ヘルパーとPOのインポートをより便利に、ツリー内のディレクトリを横断回避し、より良いnestednessを処理するためにします、我々はrequirePOと@Michael Radionovによって提案requireHelperヘルパー関数を使用してに切り替えました、以下を参照してください

• Using require with relative paths

また、@finspinが提案したアイデアは、各ページオブジェクトからノードパッケージを作成するのが大好きです。