カテゴリー:
環境構築
タグ:
 CentOS Rspec Bootstrap Rails4 Glyphicons Capybara 環境構築 PhantomJS Poltergeist

このエントリーをはてなブックマークに追加
更新日時:
2014年06月12日(木)
作成日時:
2014年06月12日(木)

前の記事 / 次の記事

パーフェクトRuby on Rails を読んで
Poltergeistを使ってみようと思ったけど激嵌まったのでメモ。

やりたいことはRailsのJavaScriptのテストを
ブラウザを使わないヘッドレスな環境ででやりたいぞと。

環境との相性が良い場合はこんなに嵌まることはないんだと思うんだけど。
主に嵌まったポイントは次の3点。

  • "cp: missing destination file operand after `/tmp/'" と言われてPhantomJSのrpmをつくれない。
  • マスターデータを保存しているテーブルの内容が毎回消える。
  • "/fonts/glyphicons-regular.woff" が無いと言われてPoltergeistがこける。

目次

  1. 環境
  2. 各gemの所在
  3. PhantomJSのインストール
  4. Rspec, Capybara, Poltergeist, DatabaseCleanerのインストール
  5. Rspecの設定
  6. CapybaraとPoltergeistの設定
  7. DatabaseCleanerの設定
  8. Bootstrap(Glyphicons)の設定
  9. バグってるJavaScriptがあれば直す

1.環境

  • centos: 6.3
  • phantomjs: 1.9.7
  • rails4: 4.0.1
  • rspec-rails: 2.14.2
  • capybara: 2.2.1
  • poltergeist: 1.5.1
  • database_cleaner: 1.2.0
  • bootstrap-sass: 3.1.1.1

2.各gemの所在

3.PhantomJSのインストール

参考

Phantomjs/Build

を見て言われた通りにする。

まずインストールに必要なものを揃える。

sudo yum install gcc gcc-c++ make git openssl-devel freetype-devel fontconfig-devel

適当なディレクトリに git clone する。

git clone git://github.com/ariya/phantomjs.git

phantomjsっていうディレクトリができてるので
その中に入って1.9をチェックアウトしてbuildする。
(buildは超時間がかかるので寝る前とかに実行した方がいい。自分の環境では3時間。)

cd phantomjs
git checkout 1.9
./build.sh

rpm-buildがインストールされてなかったらインストールする。

sudo yum install rpm-build

rpmディレクトリに移動してmkrpmする。

cd rpm
./mkrpm.sh phantomjs

で、何事もなく通ればいいんだけど、

cp: missing destination file operand after `/tmp/'

とか言われて完走できなかったのでググったらそれっぽいのがあったので真似して頑張る。

PhantomJS 1.10 の RPM を生成できない場合の対処法

"mkrpm.sh" の

次の部分を

rpm=$(rpmbuild --define "_topdir ${topdir}" \
  --buildroot ${buildroot} --clean -bb ${name}.spec 2>/dev/null | \

次のようにする

rpm=$(QA_RPATHS=$[ 0x0002 ] rpmbuild --define "_topdir ${topdir}" \
  --buildroot ${buildroot} --clean -bb ${name}.spec 2>/dev/null | \

で、再度

./mkrpm.sh phantomjs

4.Rspec, Capybara, Poltergeist, DatabaseCleanerのインストール

参考

普通にGemfileに書いてインストール。

$ vi Gemfile
group :development, :test do
  gem 'rspec-rails'
  gem 'capybara'
  gem 'poltergeist'
  gem 'database_cleaner'
end
$ bundle install

5.Rspecの設定

参考

については特に書かない。
設定済みということで。

6.CapybaraとPoltergeistの設定

参考

spec_helper.rb に次の行を追加する。

$vi spec/spec_helper.rb
require 'capybara/rails'
require 'capybara/rspec'
require 'capybara/poltergeist'
Capybara.javascript_driver = :poltergeist

7.DatabaseCleanerの設定

参考

何でDatabaseCleanerが必要なのかというのは
poltergeistを介してJavaScriptのテストを行った時にトランザクションを使って
DBの状態を元に戻すことができないので、その辺をうまいこと頑張ってもらう。

まずuse_transactional_fixturesの機能をoffにする。
DBの戻しはdatabase_cleanerに任せるので競合する機能を潰しておく。

RSpec.configure do |config|
  config.use_transactional_fixtures = false
end

次に場合に応じたdatabase_cleanerの設定を定義する。

except: にしていしているのは truncation 時の例外テーブル。
マスターデータ的な何かをDBに登録している場合は、例外として指定しておかないと消えてしまう。

これを指定しても上手くいかない場合は、起動時に seeds.rb を投入する等して必要なレコードが
再作成されるようにしておく。

RSpec.configure do |config|
  # 起動した時
  config.before(:suite) do
    #load Rails.root.join('db', 'seeds.rb')
    DatabaseCleaner.clean_with :truncation,  { except: %w(countries cities) }
  end
  # 通常のテストケース(非JavaScript)
  config.before(:each) do
    DatabaseCleaner.strategy = :transaction
  end
  # JavaScriptであるテストケース
  config.before(:each, js: true) do
    DatabaseCleaner.strategy = :truncation,  { except: %w(countries cities) }
  end

  config.before(:each) do
    DatabaseCleaner.start
  end

  config.after(:each) do
    DatabaseCleaner.clean
  end
end

8. Bootstrap(Glyphicons)の設定

参考

やっと使えるようになったかと思いきや
BootstrapやGlyphiconsを使っている場合は更にもう一手間必要。

/fonts/glyphicons-regular.woff

が無いとか言われてコケるので、Glyphiconsのファイルを修正する。
具体的にはGlyphiconsに書かれているフォントのパスを相対パスではなく、
/assets からのパスで記述する必要がある。
(相対パスのままだとPoltergeistから見えない、見えないとコケる。)

フォントの指定に限った話ではなくて、
precompile後のファイルに読めないパスがあるとPoltergeistがこけるって
ことだと思うので、Poltergeistに関わらずいずれ直す運命にあるのでとにかく直す。

bootstrap-sassを使っている場合は
3.1.1.1 で問題が修正されているので 3.1.1.1 以上にアップデートする。

それ以外の場合でgemで頑張れない場合は直接ファイルを修正する。

 $vi glyphicons.css
 '../fonts/glyphicons-regular.woff'

とかなってるところのパスをインストールしたパスに応じて、
例えば

 $vi glyphicons.css
 '/assets/glyphicons/web/html_css/fonts/glyphicons-regular.woff'

とかに書き換える。
'.woff' 以外もとにかく相対パスで指定されてるところは全て '/assets' からのパスに書き換える。
glyphicons.css 以外のファイルでも、例えばhalflings.cssとか、相対パスで指定されているヶ所があったら全て書き換える。

ちなみに '/assets' からのパスは、例えば実際に格納されている場所が、
"app/assets/stylesheets/glyphicons/glyphicons-regular.woff" だったら

/assets/glyphicons/glyphicons-regular.woff

になる。

9.バグってるJavaScriptがあれば直す

更に、バグったJavaScriptのコードが混入してると、
直接そのテストに関係なくてもPoltergeistがこけるのでバグってるコードは全て修正する。
というか、バグってる限りこけ続けるのでこけなくなるまで修正する。
(ブラウザを使って人力で動かす場合は動いてもPoltergeistはこける。)