EC2でSeleniumとPhantomJSを使ってブラウザのテストをする環境を作る

自分用メモ。それぞれの概要はこちらでは説明しません。

環境

• EC2-AmazonLinux(t2.micro)
• Ruby(2.1.5)
• Selenium-webdriver(2.45.0)
• PhantomJS(2.0)

EC2でSwap領域を確保

PhantomJSはLinuxで動かす時にビルドが必要だったのですが、t2.microのデフォルト状態でやったら、メモリが足りずに途中でエラーになってしまいます。

上記より、Amazon EC2(Linux)のswap領域ベストプラクティスを参考に、Swap領域を確保してからビルドしました。

まず、/etc/rc.localに以下を追加します。 （上記リンクに書いてあるスクリプトは動かなかったので少しだけ変更)

その後、再起動。

$sudo shutdown -r now

freeコマンドを打つと、Swap領域が確保されているのが確認できます。

$ free
             total       used       free     shared    buffers     cached
Mem:       1020188     562280     457908          0      49092     346636
-/+ buffers/cache:     166552     853636
Swap:      2040372       9568    2030804

PhantomJSのビルド

PhantomJS-Buildの通りにやります。 まずは必要なパッケージ群をインストールします。

$sudo yum -y install gcc gcc-c++ make flex bison gperf ruby openssl-devel freetype-devel fontconfig-devel libicu-devel sqlite-devel libpng-devel libjpeg-devel

その後、ソースコードを落としてきてビルドします。

$git clone git://github.com/ariya/phantomjs.git
$cd phantomjs
$git checkout 2.0
$./build.sh

30分ぐらい待つと終わりました。デフォルトで平行ビルドするらしいので、スペックの低いマシンの場合、./build.sh –jobs 1として平行ビルドしないようになるみたいです。

正常に終わっていればphantomjs/bin/phantomjsという感じでバイナリが出来ているのが確認できます。

Selenium-webdriverのインストール

自分の環境だとデフォルトでインストールされたRubyからSelenium-webdriverのインストールを試みたところ、パスの問題?でうまくいかなかったので、rbenvを使って、別途Rubyをインストールしました。

rbenv を使って ruby をインストールする(CentOS編)の通りにやって2.1.5をインストール。このやり方は割とどこにでも書いてあるので省略。

終わったら以下のコマンドでインストール

$gem install selenium-webdriver

テストする

Selenium 使いのための PhantomJS 解説を参考に実施。

まず、PhantomJSを起動させます。

$ phantomjs/bin/phantomjs -w 8001 &
[1] 18769
[ec2-user@ip-172-31-15-31 ~]$ [INFO  - 2015-02-28T14:53:40.058Z] GhostDriver - Main - running on port 8910

-wオプションを使ってポートを指定しているのですが、なぜか8910が開いてしまいましたが、原因を探す時間はありませんでした。。。(80001を使っているわけでもないのに)

気持ち悪いですが、起動はしたので、irbから操作してみます。

$irb

以下irbでのコマンドを順番に打っていきます。詳細はselenium-webdriverのAPIドキュメント参照のこと

まず、selenium/webdriverを使うことを記載

irb(main):001:0> require "selenium/webdriver"
=> true

次に、利用するDriverを指定。(GhostDriverを使おうとするとエラーになってしまったので、この方法で実施)

irb(main):002:0> driver = ::Selenium::WebDriver.for(:remote, url: "http://localhost:8910")

Googleのページを開く

irb(main):003:0>driver.get "http://www.google.co.jp"
=> {}

タイトルを表示

irb(main):004:0> puts driver.title
Google
=> nil

画面キャプチャ取得

irb(main):006:0> driver.save_screenshot('/home/ec2-user/test.png')
=> #<File:/home/ec2-user/test.png (closed)>

実際に取得できたキャプチャがこちら。うーん、便利。