先日から CI づいているので今度は JavaScript のユニットテストの分を調べました。
現在のwtnabeの普段の開発手法
- Jasmine gem と guard-livereload を使って
- ブラウザで自動reloadさせながら Jasmine でユニットテストを書く
ということをしています。これはやっぱりブラウザで動かせる Firebug などの開発者ツールがとても強力なので、何かあったときに探っていくのに便利であることが理由として大きいです。あとブラウザで見ることができる方がなんか安心というのもあります。
しかしこのままでは CI と相性がよくありません。だから今まで CI は無視してたのです。
rake jasmine:ciはGUIブラウザ前提
一応 Jasmine gem には
rake jasmine:ci
というタスクが定義されているのですが、これは基本的に Selenium でブラウザを起動してテストを動かして結果を受け取るというもので、
基本的には GUI のブラウザが動くことが前提
になっています。ということは CI サーバで使うには X を起こすか Xvfb とか使って Firefox などのブラウザをサーバ上で動かす必要があります。これは面倒くさいうえにとても重たい。できれば避けたいです。
PhantomJSはなんでもできるけどテスト準備が面倒
ということで headless ブラウザとして有名な PhantomJS を使うのかなぁ、なんかでも PhantomJS で CI みたいな記事はやたら面倒くさい構成っぽいよなぁと思っていたら神降臨。
Twitter / @os0x: @wtnabe jasmineをheadlessで動 …
おぉ、そう言えば jasmine-headless-webkit はすでにチェック済みでした。
ただ正直 headless ブラウザはよく分からないんですよね。結局みんな WebKit 使ってるんでしょ？ なんでいくつもあるの？ という感じ。で、有名な PhantomJS にしてみようか、本家のページにも Jasmine や QUnit とか使ってテスト動かせるよって書いてあるし、と思っていたのですが、結局のところ HTML を読み込んだうえで何か操作するというのが基本なので、JavaScript の読み込みやテストの実行はこっちでお膳立てする必要があります。要するに
PhantomJSはいろいろできるけどテストの実行には特化していないので準備が面倒
なんですね。
jasmine-headless-webkitですべて解決
jasmine-headless-webkit – The fastest way to run your Jasmine specs!
そこで jasmine-headless-webkit. 何をしてくれるかと言うと
- Jasmine gem と同じように設定ファイルを読んでくれて
- test runner に当たる HTML を自動的に生成してくれて
- headless WebKit ブラウザをさっと立ち上げてテストを実行して
- 結果を CLI にそのまま表示してくれる（reporterは選べる）
というもので、使い方は単に
$ jasmine-headless-webkit
と叩くだけ。するとカレントディレクトリから Jasmine gem 標準の
spec/javascripts/support/jasmine.yml
を探しにいって1、これを読み込んで Jasmine gem と同じように設定を解釈して動作します（たぶん）。
つまり普段 Jasmine gem でテスト書いてる人の CI 向けのツールとしてはカンペキです。何も変える必要がなく、単に叩くコマンドが違うだけ。
しかも
CoffeeScriptからの変換も全部自動で面倒みてくれます
あなたが神か。
開発者ツールで中を覗いてみたくならなければ、
普段使いもこれでいいじゃん
て感じです。いやーいいもの教えてもらいました。周回遅れは楽でいいです。はい。
あ、ちなみにこれも Ruby で書かれているので Ruby のインストールが必要ですし、qt4 やらなんやらも必要です2。WebKit 系のこうしたツールはソースからビルドするタイプのパッケージシステムを使っている方が楽かもしれません。
PhantomJSの今後の可能性
PhantomJS のサイトからもリンクされていますが、
というものがあるそうです。今のところ technical-demo と書かれていますけど、Selenium から PhantomJS が使えるようになるかもしれません。これが安定して使えるようになれば Jasmine に限らずいろいろ可能性が広がりますね。