若干ハマるポイントがあったので、記事にしておく。たぶん最もシンプルな設定だと思う。
node_modules
以下のモジュールが必要。
📄Gruntfile.js
$ npm install --save-dev coffee-script $ npm install --save-dev protractor $ npm install --save-dev grunt-protractor-runner $ npm install --save-dev protractor-coffee-preprocessor
coffee-scriptはyo angular --coffee
してる人には不要。すでにインスコ済みのはずなので。他のモジュールたちはその名の通りの機能を提供するパッケージ。
パッケージを導入したら、seleniumドライバをインスコするために、以下のコマンドをぶっ叩く。
$ node_modules/protractor/bin/webdriver-manager update
設定ファイル
続いて、Gruntjileにprotractorのタスクを追記する。
... protractor: { options: { configFile: "node_modules/protractor/referenceConf.js", // Default config file keepAlive: true, // If false, the grunt process stops when the test fails. noColor: false, // If true, protractor will not use colors in its output. args: { // Arguments passed to the command } }, e2e: { // Grunt requires at least one target to run so you can simply put 'all: {}' here too. options: { configFile: "test/protractor.conf.js", // Target-specific config file args: {} // Target-specific arguments } }, }, ...
ほとんど公式サイトのまま。e2e
というのが任意のターゲット名となる。ここではtest/protractor.conf.js
を設定ファイルと指定している。
さっそくそのファイルを作成しよう。
📄test/protractor.conf.js
exports.config = { specs: ["e2e/*.coffee"], baseUrl: "http://localhost:9000", plugins: [ "protractor-coffee-preprocessor" ] };
specs
で指定するパスは、この設定ファイル(本例ではproctractor.conf.js)からの相対パスで指定する点に注意。私はそれ知らずに結構ハマってしまった・・・。baseUrl
にはgrunt server
で起動しているサーバのURL、plugins
に先程インスコしたプリプロセッサを指定すると、テスト実行時にCoffeeScriptを自動的にコンパイルしてくれる。
E2Eテスト
それでは最初のテストを作成してみよう。yoemanで雛形を作った場合のトップページをテストしてみる。
📄index_test.coffee
describe 'Setting up protractor', -> beforeEach -> @prot = protractor.getInstance() it 'works', -> browser.get '/#/' h1 = @prot.findElement(By.tagName('h1')) expect(h1.getText()).toBe("'Allo, 'Allo!")
さっそく実行してみよう。事前にサーバを起動しておくのを忘れずに。
$ grunt server (別コンソールで) $ grunt protractor:e2e
よし、これでバリバリE2Eテストが書けるぜ。
関連する記事
- rubocop + pre-commitで規約違反のコードをコミットできないようにする
- 【Linux】トラックパッドでジェスチャーを可能にする
- MNPで通信キャリアを変えようとするとカオスを味わえるタイランドの考察
- 【実践】Railsにて検索結果をそのままCSV出力する(やや手抜きで)
- Ubuntu 22.04インストールしてからやること