capybaraはE2Eテストツールであり、ビューの単位テストができるようにしてくれる。
ちなみに、Rails5.1からはcapybaraがデフォルトのgemに入っている。
準備
今回のテストはrspecとcapybaraを使ってみる。
install
1
2
3
4
5
6
7
| group :test do
gem 'rspec-rails'
gem 'poltergeist'
gem 'capybara-screenshot'
gem 'database_rewinder'
gem 'factory_girl_rails'
end
|
gemの説明をしてみると、
poltergeistはcapybara用ドライバーである。poltergeistを使えばphantomJSが提供するブラウザでテストすることができる。それとJSの実装やスクリーンショットも撮ることもできる。
capybara-screenshotはスクリーンショットの便利性のために使う。
database_rewinderはdatabaseのクリーナーであり、factory_girl_railsはモデルオブジェクトを作るために入れる。
rails generate rspec:install
spec/rails_helper.rbに以下のように書き込む。
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
| require 'rspec/rails'
require 'capybara/rails'
require 'capybara/rspec'
require 'capybara/poltergeist'
require 'database_rewinder'
# capybara
Capybara.app_host = "http://example.com"
Capybara.always_include_port = true
Capybara.default_max_wait_time = 5
Capybara::Screenshot.autosave_on_failure = false
Capybara.javascript_driver = :poltergeist
Capybara.register_driver :poltergeist do |app|
Capybara::Poltergeist::Driver.new(app, {
inspector: true,
js_errors: false,
timeout: 1000,
phantomjs_options: [
'--load-images=no',
'--ignore-ssl-errors=yes',
'--ssl-protocol=any'
]
})
end
# database_rewinder
RSpec.configure do |config|
config.before :suite do
DatabaseRewinder.clean_all
end
config.before(:each) do
DatabaseRewinder.clean
end
config.before(:each, js: true) do
DatabaseRewinder.strategy = :truncation
end
config.after :all do
DatabaseRewinder.clean
end
end
|
poltergeistを使うためにphantomJsをインストールする。
macだとPhantomJSはbrew install phantomjsで簡単に入れられる。
簡単なテスト
まず、テストのため、scaffoldでmodel, controller, viewを作る。
1
| $ rails g scaffold post title:string content:text
|
そしたらこういうビューが作られる。
このページでPostを作成するテストをしてみる。
specフォルダーにpostsのフォルダーを追加、その中にindex_spec.rbというファイルを作成する。
そして、そのファイルに
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
| require 'rails_helper'
feature 'Post一覧画面の表示' do
scenario 'Postが作成できること', js: true do
visit posts_url
expect(page).to have_css('h1', text: 'Posts')
screenshot_and_open_image
click_link('New Post')
sleep 0.5
screenshot_and_open_image
fill_in('post_title', with: 'Title01')
screenshot_and_open_image
fill_in('post_content', with: 'Content01')
screenshot_and_open_image
click_button('Create Post')
sleep 0.5
find('p#notice', text: 'Post was successfully created.').visible?
screenshot_and_open_image
click_link('Back')
sleep 0.5
screenshot_and_open_image
end
end
|
こういうコードを入れてみる。
capybaraはいろんなDSLを提供している。
みたらすぐわかるくらいsimpleでわかりやすく使えるようになっている。
ちなみに、fill_in('post_title', with: 'Title01')はfind('input[name="post[title]"]').set('Title01')に変えることもできる。同じようにclick_linkもfind('hogehoge).clickに変えられる。
このテストの結果は
1
2
3
4
5
| Post一覧画面の表示
Postが作成できること
Finished in 4.42 seconds (files took 3.02 seconds to load)
1 example, 0 failures
|
こうなっていて、下はスクリーンショット。
参考
RailsでRSpec+Capybara+factory_girl+その他テスト系gemのインストール方法
Rails + Capybara + Rspecをセットアップして簡単なテストが通るまで