おお、これは表示系のテストが容易になりそう! Seleniumは多数のブラウザを操作してテストを自動化できます。RubyやJavaなど様々なプログラミング言語向けにソース出力が可能で、各言語で作られたシステムと組み合わせることができます。 そんなSeleniumをnodeと組み合わせて使えるのがNightWatchです。書き方も使い方も柔軟で、これはテスト以外の用途でも活躍しそうです。

まずはテストの書き方。次のようなコードになります。

module.exports = {
  "Demo test Google" : function (client) {
    client
      .url("http://www.google.com")
      .waitForElementVisible("body", 1000)
      .assert.title("Google")
      .assert.visible("input[type=text]")
      .setValue("input[type=text]", "nightwatch")
      .waitForElementVisible("button[name=btnG]", 1000)
      .click("button[name=btnG]")
      .pause(1000)
      .assert.containsText("#main", "The Night Watch")
      .end();
  }
};

特徴としてはスタイルシートのセレクタが使えることでしょう。これによって自動操作がかなり楽に書けるようになりそうです。コマンドライン版の実行スクリプトがあるので、手軽にテストが実行できます。

$ bin/nightwatch 

[ github module ]

Running:  Demo test GitHub
✔  Element <body> was visible after 329 milliseconds.
✔  Testing if the page title equals "beatfactor/nightwatch · GitHub".
✔  Testing if element < .container .breadcrumb a span> is visible.
✔  Checking project title is set tot nightwatch
OK. 4 assertions passed.

[ google module ]

Running:  Demo test Google
✔  Element </body><body> was visible after 274 milliseconds.
✔  Testing if the page title equals "Google".
✔  Testing if element <input [type=text]/> is visible.
✖  Element <button [name=btnG]> was not visible in 1000 milliseconds.  - expected "false" but got: false

TEST FAILURE: 1 assertions failed, 7 passed and 4 skipped.
FAILED:  1 assertions failed, 3 passed and 4 skipped

さらにJUnitのXMLレポート出力に対応しているので、HudsonやTeamcityといったCIサーバと組み合わせて管理ができるようになっています。

Webブラウザの表示に関してテストを行うのであれば、やはりJavaScriptの方が親和性が高いです。CSSセレクタやXPathを使って柔軟に、かつ素早くブラウザテストを実行しましょう。

NightWatchはnode/JavaScript製のオープンソース・ソフトウェア(MIT License)です。

Nightwatch.js beatfactor/nightwatch