2013/04/02更新

[Selenium2] Seleniumでスマホの自動テスト!!Chromeを起動する、スマホテスト用にユーザーエージェントや画面サイズを変更する

このエントリーをはてなブックマークに追加      

こんにちは、@yoheiMuneです。
ブラウザでのテストを自動化できるSeleniumというツール。 今回はそのツールで、Chromeを起動したり、ユーザーエージェントを上書きしたりする方法をブログに書きたいと思います。

画像


Seleniumとは

Seleniumとは、ブラウザの描画テストや動作テストを自動化できる便利なツールです。
Javaなどでテストコードを記述することで、ブラウザ起動、ページ遷移、ボタンクリック、などを自動で行うことが出来ます。
Seleniumにについてブログを記載しておりますので、詳細はそちらが参考になれば幸いです。

- [Selenium2] Webテストを自動化に挑戦!!基本編
- [Selenium2] 自動テストで、ダイアログもテストしてしまう
- [Selenium2] 自動テスト、画面キャプチャも自動で取得してしまおう
- [Selenium2] アプリケーション。画面の自動テストに挑戦!!



Seleniumでスマホ画面をテストしたい

最近のお仕事事情、スマホ関連のページを制作することが多く、スマホのページもSeleniumでテストできないかなぁと思っていました。
SeleniumではIEやFirefoxは簡単にテストできるのですが、ChromeなどのWebkit系のブラウザでの動作確認をSeleniumでしたい。

ChromeをSeleniumから起動するには、いくらばかりかの手順が必要だったので、その手順をブログに書く次第でございます。



SeleniumからChromeを起動する

Chromeを起動するには、具体的には以下の手順が必要です。
  • Chromeドライバーと呼ばれるプログラムをダウンロードして、任意の場所に置く
  • 上記Chromeドライバーを読み込む設定をSeleniumに書く


Chromeドライバーをダウンロード&配置

Chromeを起動するために、Chromeドライバーというものが必要となるようです(詳細は、こちらを参照)。
まずは、以下サイトから自分の環境にあったChromeドライバーをダウンロードしてきます。

http://code.google.com/p/chromedriver/downloads/list


そしてダウンロードしてきたファイルを、自分の都合の良い場所に配置します。
今回は、自身のホームディレクトリのlibフォルダ配下(/home/munesada/lib/chromedriver)に配置したとして以下の記事を進めます。



SeleniumでChromeドライバーを読み込む、起動する

SeleniumでWebDriverインスタンスを作成する前に、上記で配置したchromedriverの場所を指定します。
指定方法はいろいろとありますが、例えば以下のような感じで指定できます。
System.setProperty("webdriver.chrome.driver","/home/munesada/lib/chromedriver);
そしてその後、Chromeを起動するといい感じに起動できます。
WebDriver driver = new ChromeDriver();
ちなみにUserAgent以外にも、以下サイトで紹介されているオプション(100個以上ある)を指定可能のようです。
http://peter.sh/experiments/chromium-command-line-switches/



スマホテスト用にUserAgentや画面サイズを変更する

スマホの画面をテストするために、Chromeのユーザーエージェントの上書きと画面サイズの指定します。
ユーザーエージェントを上書く理由はユーザーエージェントによって処理を分岐させていることに対応するため、 画面サイズを変更するのは見た目をよりリアルにするためです。

ChromeWebDriver起動時にオプションを渡したり、作成後のWebDriverインスタンスを変更することで、上記の変更を行うことが出来ます。

// ユーザーエージェントを上書きして、起動する
ChromeOptions options = new ChromeOptions();
options.addArguments("--user-agent=Mozilla/5.0 (iPhone; CPU iPhone OS 6_0 like Mac OS X) AppleWebKit/536.26 (KHTML, like Gecko) Version/6.0 Mobile/10A403 Safari/8536.25");
WebDriver driver = new ChromeDriver(options);

// 画面サイズを指定する
driver.manage().window().setSize(new Dimension(320, 700));

こんな感じでスマホ用のテストを行います。



最後に

スマホ案件得意な方だったら、ChromeとMobileSafari/ブラウザの挙動だいぶ違うけど、、と疑問が出るかと思います。 全くその通りで、上記は簡単な挙動確認を行うくらいの目的で使えば良いかなぁと思ってます。
毎回テストするために、自分の手を煩わしたくないといった気持ちからこのブログを書きました。 なので最終的にはスマホ本体でテストする必要があるかと思います(UXのテストにもいいですしねー。)

以上、最後までご覧頂きましてありがとうございました。





こんな記事もいかがですか?

RSS画像

もしご興味をお持ち頂けましたら、ぜひRSSへの登録をお願い致します。