JasmineをCLIで走らせるならjasmine-headless-webkitが楽すぎる

先日から 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 のサイトからもリンクされていますが、

GhostDriver by detro

というものがあるそうです。今のところ technical-demo と書かれていますけど、Selenium から PhantomJS が使えるようになるかもしれません。これが安定して使えるようになれば Jasmine に限らずいろいろ可能性が広がりますね。

  1. オプションで変更も可能 

  2. GUIのない環境では Xvfbも必要。 

More

Categories

Tool 日々 Web Biz Net Apple MS ことば News Unix howto Food PHP Movie Edu Community Book Security Text TV Perl Ruby Music Pdoc 生き方 RDoc ViewCVS CVS Rsync Disk Mail FreeBSD Cygwin PDF Photo Zebedee Debian OSX Comic Cron Sysadmin Font Analog iCal Sunbird DNS Linux Wiki Emacs Thunderbird Sitecopy Terminal Drawing tDiary AppleScript Life Money Omni PukiWiki Xen XREA Zsh Screen CASL Firefox Fink zsh haXe Ecmascript PATH_INFO SQLite PEAR Lighttpd FastCGI Subversion au prototype.js jsUnit Apache Trac Template Java Rhino Mochikit Feed Bloglines CSS del.icio.us SBS qwikWeb gettext Ajax JSDoc Rails HTML CHM EPWING NDTP EB IE CLI ck ThinkPad Toy WSH RFC readline rlwrap ImageMagick epeg Frenzy sysprep Ubuntu MeCab DTP ERD DBMS eclipse Eclipse Awk RD Diigo XAMPP RubyGems PHPDoc iCab DOM YAML Camino Geekmonkey w3m Scheme Gauche Lisp JSAN Google VMware DSL SLAX Safari Markdown Textile IRC Jabber Fastladder MacPorts LLSpirit CPAN Mozilla Twitter OpenFL Rswatch ITS NTP GUI Pragger Yapra XML Mobile Git Study JSON VirtualBox Samba Pear Growl Mercurial Rack Capistrano Rake Win RSS Mechanize Sitemaps Android JavaScript Python RTM OOo iPod Yahoo Unicode Github iTunes God SBM friendfeed Friendfeed HokuUn Sinatra TDD Test Project Evernote iPad Geohash Location Map Search Simplenote Image WebKit RSpec Phone CSV WiMAX USB Chrome RubyKaigi RubyKaigi2011 Space CoffeeScript Nokogiri Hpricot Rubygems jQuery Node GTD CI UX Design VCS Kanazawa.rb Kindle Amazon Agile Vagrant Chef Windows Composer Dotenv PaaS Itamae SaaS Docker Swagger Grape WebAPI Microservices OmniAuth HTTP 分析基盤 CDN Terraform IaaS HCL Webpack Vue.js BigQuery Middleman CMS AWS PNG Laravel Selenium OAuth OpenAPI GitHub UML GCP TypeScript SQL Hanami Develop Document Jekyll