Help us understand the problem. What is going on with this article?

CentOS上にてRSpec+Turnip+Capybara+Selenium Webdriver+Headlessでスクリーンショットを撮るまで

More than 3 years have passed since last update.

CUIのみのLinuxでseleniumを使おうとした所ちょっと手順を踏む必要がありました。

インストールするもの

Xvfb

Xvfb 仮想フレームバッファ・サーバ - insomniaより

Xvfb はディスプレイのないサーバ機などで X Window System の画面入出力をシミュレートする X11 のサーバ・ソフトウェアである。 例えば,あるサイトのリンクにそのページ画面のサムネイル画像を掲げているのをよく目にするが,これをサーバで自動的にやろうとすると,JavaServlet などでサイトのページを取得し,ブラウザと同様にレンダリングし,画面イメージを生成するわけだ。 このとき Awt などの「ディスプレイ」の存在を仮定するライブラリを使うのが常である。 そこで,ディスプレイ・レスの UNIX サーバ機でもそれをエミュレートする,仮想フレームバッファなるインタフェースを提供するのが Xvfb である。

これによりSeleniumをヘッドレスに動かすことができます。

$ sudo yum install xorg-x11-server-Xvfb

ImageMagick

スクショを取るのに必要だそうです。
自分の場合別途インストールしてたのでよく覚えてないです()

# これだけで大丈夫なはず...
$ sudo yum install ImageMagick

Firefox

今回Firefoxでテストしたいのでyumで入れます。

$ sudo yum install firefox

日本語化

ブラウザの文字化けを防ぐため日本語化します

$ sudo yum groupinstall "Japanese Support"

各種gemたち

Gemfile
group :test do
  gem 'rspec-rails'
  gem 'capybara'
  gem 'turnip'
  gem 'selenium-webdriver'
  gem 'headless'
  # あと factory_girl_rails とか database_cleaner とか適宜どうぞ
end

headlessはrubyからXvfbの起動終了を行うためのgemです。
めっちゃ簡単なので入れておくといいと思います。

Xvfb準備

bash_profileなどに以下を追加します。

.bash_profile
export DISPLAY=:99

headlessがデフォルトでDISPLAY=:99を使用するのでそれに合わせて:99にします。

上記追加したらsource ~/.bash_profileなどで設定を反映。
動作テストをしてみます。

$ Xvfb :99 -screen 0 1024x768x24 &
$ firefox &

これで変なエラーが出なければok。
終了する際はkillall Xvfbなどで。

自分が嵌ったエラー

$ Xvfb :99 -screen 0 1024x768x24 &

...

The XKEYBOARD keymap compiler (xkbcomp) reports:
> Internal error:   Could not resolve keysym XF86AudioMicMute
Errors from xkbcomp are not fatal to the X server

↑これが出ても特に問題ないみたいなので無視しても大丈夫...?

$ firefox &
Error cannot open display: :99

↑環境変数DISPLAYXvfb起動時に引数で渡したものと一致してるか・設定が反映されてるか確認して下さい。
また、もちろんXvfbが起動してないとfirefox使えません。

RSpec設定

spec_helper.rbなどの設定ファイルにて

spec_helper.rb
# (適当に必要なものrequireして下さい)
require 'selenium-webdriver'
require 'headless'
require 'capybara/rspec'
require 'turnip'
require 'turnip/capybara'

...

RSpec.configure do |config|

...

  # selenium-webdriver
  # 名前は任意。今回は selenium_firefox とします。
  Capybara.register_driver :selenium_firefox do |app|
    Capybara::Selenium::Driver.new(app, browser: :firefox)
  end
  Capybara.javascript_driver = :selenium_firefox
  # 常時使用の場合は Capybara.default_driver = :selenium_firefox

  # headless
  config.before(:all) do
    # デフォルトだとウインドウサイズが心もとないので大きくしときます。
    @headless = Headless.new(dimensions: "1920x1080x24")
    @headless.start
  end

  config.after(:all) do
    @headless.destroy
  end
end

Headless.newの引数はこちらをどうぞ。
listenするDISPLAY変えたりとかもできます。

スクショを撮る

準備完了なのでスクショとります。

screen_shot.feature
# encoding: utf-8
# language: ja

# Capybara.javascript_driver = :selenium_firefoxなら
# @javascriptタグが必要
@javascript 
機能: スクリーンショットをとる
  シナリオ: google先生のスクショを撮る
  もし "http://google.com"にアクセスする
  ならば スクリーンショットを撮る
screen_shot_steps.rb
step ':urlにアクセスする' do |url|
  visit url
end

step 'スクリーンショットを撮る' do
  # 引数には 適当なパス/ファイル名.png
  page.save_screenshot("/vagrant/google.png")
end

で実行すると

150105_google_screen_shot.png

ちゃんとスクリーンショットが撮れました!

K_Yagi
webサービス作ってます 主な使用言語はruby
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
Comments
No comments
Sign up for free and join this conversation.
If you already have a Qiita account
Why do not you register as a user and use Qiita more conveniently?
You need to log in to use this function. Qiita can be used more conveniently after logging in.
You seem to be reading articles frequently this month. Qiita can be used more conveniently after logging in.
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
ユーザーは見つかりませんでした