7
10

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

BrowserStack + facebook/php-webdriver で、ブラウザごとのテストを自動化する

Last updated at Posted at 2015-06-30

はじめに

みなさん、Webサービス開発していて、少なからずブラウザとの戦いがあると思いますが、ブラウザごとのリグレッションテストなど、どのように対応されていますでしょうか?
仕方なくチェックリストを作成して、人海戦術で対応しているプロジェクトも少なからずあるのではないでしょうか?
残念ながら弊社もそのように対応してきました。
しかし、プロジェクトが大きくなっていくにつれて、テストにかかるコストも目立つようになってきましたので、重要課題として、この問題の解決に着手しました。
着手して、すぐに、BrowserStack + facebook/php-webdriver の組み合わせが非常に強力で便利なことに気付きましたので、ここでご紹介したいと思います。

BrowserStackとは

BrowserStackそのものについては、本家サイトInnovaさんのブログ記事に詳しく出ていますので、ここでは割愛します。

やりたくないこと、やりたいこと

非効率なので、以下のようなことはやりたくありません。

  • 毎回同じ内容を毎回人間がテストする
  • テスト環境を構築するために、ローカルに色々セットアップしなければいけない
  • 工数がかかる割に、見返りが少ない(かといってやらないわけにはいかない)

どんなツールやサービスでもいいのですが、やりたいことは以下のとおりです。

  • ブラウザごとのリグレッションテストを自動化する
  • テスト環境をなるべく構築しない
  • 誰がやっても同じテスト結果になる(属人化、職人芸化させない)

セットアップ

phpunitのインストール

$ composer require phpunit/phpunit

facebook/php-webdriverのインストール

$ composer require facebook/webdriver

TestCaseの作成

あとは、本家のドキュメントや、facebook/php-webdriverを参考にして、TestCaseを作成します。

手っ取り早く動作確認したい方のために、サンプルコードを作りましたので、お試しください。

実行結果サンプル

Windows7 + IE9 にて、

  • google.co.jp にアクセス
  • スクリーンショット取得
  • タイルメニューを表示(メニューのアイコンをクリック)
  • スクリーンショット取得
  • gmailのアイコンをクリック
  • スクリーンショット取得

すると、下記のように、BrowserStackのサイト上で結果を確認することができます。

browserstack_automate.png

おわりに

具体的な活用事例は、まだまだ少ないように感じますので、まずは有償プランを契約して、実戦で活用してみて、便利な使い方など発見したら、どんどん投稿しようと思います。

7
10
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
7
10

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?