RSpecとCapybaraでリモートサーバー上のWebページをテストする

RSpecとCapybaraを組み合わせて、任意のWebページのテストを行う手順についてです。

Railsで開発していないWebサイトをテストする場合や、受け入れ検証のみを
RSpecで行う場合を想定しています。

以下、手順です。空のRailsアプリを作成し、その中のRSpecから対象のWebページにアクセスし
テストを行います。

◆Railsアプリ作成からテストの実行まで

1.Railsアプリの作成
いつものとおり、以下のコマンドを実行します。(今回はcapybarasampleというアプリ名にしました。)

rails new capybarasample

2.capybaraなどのインストール
必要なものをインストールするため、以下の記述ををGemfileに追加します。

group :development, :test do
　gem 'rspec-rails'
　gem 'capybara'
　gem 'launchy'
　gem 'database_cleaner'
　gem 'spork' #sporkを使うのであれば必要
end

追加後、bundle install を実行します。

3.RSpecの初期化
以下のコマンドを実行します。

rails g rspec:install

4.integration testの雛形作成
以下のコマンドを実行します。(今回はテスト名をsampleとしました。)

rails g integration_test sample

5.capybaraでリモートサーバーにアクセスするための設定
spec_helper.rbに以下の記述を追加します。

Capybara.current_driver = :selenium #Capybaraのドライバーをseleniumに設定。
Capybara.app_host = 'http://www.xxxx.xx.jp' #テスト対象のWebアプリのルートURL

6.テストを記述
integration test(今回はsamples_spec.rb)にテストを記述します。
例えばこんな感じです。

#coding:utf-8

require 'spec_helper'
describe "Samples" do  

  describe "GET /samples", :js => true do 

    before(:each) do

      visit('/')

    end
    it "ルートページを表示する" do

      page.should have_content("ホームページ")

    end
    it "東京の天気を検索する" do

      click_link "気象情報画面に遷移するリンク名"

      find('h1').should have_content("気象情報")

      

      select("東京都", :from => "ドロップダウンリストのid")

      find('h1').should have_content("東京都")

    end

    

    it "「天気予報」でページ内を検索する" do

      fill_in "テキストボックスのid", :with => "天気予報"

      click_button "検索ボタンのid"

      page.should have_content("天気予報")

    end

  end

end

RSpecでRailsのテストをする場合と書き方は変わりません。

7.テストの実行
以下のコマンドで、RSpecを実行します。

rspec spec/
(sporkを使うのであれば、予めsporkを起動した後、別コンソールで rspec spec/ --drb を実行。)

以上で、任意のWebページのテストは実行できると思います。

◆(おまけ)画面キャプチャの取得
ドキュメントなどを作成する際に、画面のキャプチャを取っておきたい場合があるかと思います。
画面キャプチャが取れることを確認したので、その手順も載せておきます。

1.画面キャプチャを取るヘルパーメソッドを作成
spec_helper.rb に以下を記述します。

def save_screenshot(num)

  page.driver.browser.save_screenshot "tmp/capybara/" + num.to_s + "_#{Time.now.strftime("%Y%m%d%H%M%S")}.png"

end

ここでは tmp/capybara フォルダ内に、引数で渡されたテスト番号 + 結果取得日時 + .png のファイル名で
画面キャプチャを作成しています。

2.ヘルパーの呼び出し
上で作成したヘルパーを、画面キャプチャを取得したいタイミングでよびだします。

it "ルートページを表示する" do

      page.should have_content("ホームページ")

      

      save_screenshot(1)

    end

save_screenshot(1) でテスト番号を引数に渡して呼び出しています。

◆(おまけ)画面キャプチャのエクセル出力
Axlsx でテスト支援では、一歩進んで、画面キャプチャやテストケースをエクセルに出力しています。
実際の仕事では、こちらの方が便利かも知れません。

以上です。