SeleniumIDE

SeleniumIDE

• Seleniumスクリプトツール。GUIベースでブラウザ操作の記録・再生ができる。
• WebDriver(Selenium2)を利用する場合はselenium serverとの連携が必要。

必要環境（Selenium2を利用する場合）

• 最新版のFireFox
• java 6以上

2014/03現在、Selenium2を利用したSeleniumIDEではこれができない（Selenium1ではできる）

• スクリーンショットの取得
• UAを偽装したスマホ・ガラケー画面のテスト
 
• Selenium1はFireFoxでしか動作できないので、スマホ・ガラケー画面の自動テストはFireFoxでしかできないことになる

インストール

2014/03現在の最新バージョン

• SeleniumIDE 2.5.0
• SeleniumServer 2.40.0
• IEDriverServer 2.40.0
• chromedriver 2.7

SeleniumIDE

• 公式サイト からSelenium IDE 2.5.0 のxpiファイルをダウンロード
• Firefoxのアドオンマネージャ(Firefoxの[アドオン]メニューで表示可能)にドラッグ&ドロップしてインストール
 
• (FireFoxのアドオン検索ではIDEのプラグインしか出てこない)

Selenium Server

• 公式サイトから「Selenium Server (formerly the Selenium RC Server)」をダウンロードして任意の場所に解凍して保存しておく。

設定

IDEの起動と設定

• インストール後、FireFoxを起動して「ツール」→「SeleniumIDE」か「ctrl + alt + s」で起動。
• （任意設定）初期設定では起動と同時に記録を開始するので、IDEの「オプション」→「設定」→「一般」タブ→「Start recording immediately on open」チェックボックスを空にする。
• WebDriver(Selenium2)を利用する場合、「オプション」→「WebDriver」タブの「Enable WebDriver Playback」がチェックされていることを確認する。外れていれば従来のSelenium1で動作する。

WebDriverの起動

• WebDriverを利用する場合は、selenium serverを起動（常駐）しなければならない。
• 実行環境にJavaが必須なので、PCにインストールされていない場合はインストールする。
• 上の手順で保存したselenium-server-standalone-2.40.0.jar（バージョンは適宜読み替える）を、コマンドプロンプトから下記コマンドで起動する。
 
• java -jar selenium-server-standalone-2.40.0.jar
• Warningなどなく起動すればOK。

クロスブラウザ設定

クロスブラウザでテストを行うには、WebDriverの利用が必須となる。

各ブラウザのプラグインが必要で、selenium server起動時にブラウザ毎オプション記述を行うことで利用できる。

IDE側の設定と起動オプション

 
• 「オプション」→「WebDriver」タブの入力フォームで起動するブラウザを指定する。指定文字列の対比表は以下。

ブラウザ	設定名	オプションコマンド
FireFox	firefox	必要なし
IE	ie	-Dwebdriver.ie.driver=${IEDriverServer.exeのパス}
Chrome	chrome	-Dwebdriver.chrome.driver=${chromedriver.exeのパス}

 
• 起動オプションは複数指定することも可能。
 
• java -jar selenium-server-standalone-2.40.0.jar -Dwebdriver.ie.driver=.\IEDriverServer.exe -Dwebdriver.chrome.driver=.\chromedriver.exe

IE

 
• 公式サイトから「The Internet Explorer Driver Server」の"32bit版"をダウンロードし、selenium serverと同じディレクトリに解凍して保存する。（64bit版は不具合がある模様）
 
• selenium serverを起動する前にIEを開き、インターネットオプションのセキュリティタブで以下の設定を行う。
• 「保護モードを有効にする」チェックボックスをインターネットから制限つきサイトまで全てのゾーンでチェック状態にする



• 「信頼済みサイト」ゾーンにテスト対象のサイトを登録しておく

Chrome

• 公式サイトの「Third Party Browser Drivers」からChromeの「2.7」リンク→「2.7」と遷移し、「chromedriver_win32.zip」をselenium serverと同じディレクトリに解凍・保存する。

ガラケー・スマホ

Selenimu1の場合

• firemobilesimulatorを使ってUA（ユーザーエージェント）を偽装することで、ガラケーやスマホ用の画面を表示させる。
• インストールし、FireFoxの「ツール」→「FireMobileSimulator」から偽装したいUAを選択することで偽装できる。
• 最新端末のUAが必要な場合、「最新端末リストから端末を追加」でUAを追加し、テスト実行前に偽装しておく。

WebDriverを利用する場合

• IDEの機能では難しい模様。コード上でFireFoxのプロファイルなどをオーバーライドすることでUAを設定する。 以下のようなコードでUAをセットできる（Javaの場合）
• FireFox
  • FirefoxProfile profile = new FirefoxProfile();
  • profile.setPreference("general.useragent.override", "some UA string");
  • WebDriver driver = new FirefoxDriver(profile);
• Chrome
• 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);

基本操作

画面

①記録の開始・停止
ボタンを押すと記録が開始される。もう一度押すと記録が停止する。

• ②テストケースの再生ボタン
  テストケース単体の実行、スイート全体の実行、一時停止などができる。
• ③再生速度
  再生される速度を調節できる。要素のundifindなどが起こる際、再生速度を落とすと解決する場合がある。
• ④テストスイート
  枠全体をテストスイート、Untitledとなっているそれぞれをテストケースと呼ぶ。
  テストケースは「画面を表示してからログインする」などの単体ケース。スイートはそれらをまとめたもの。
• ⑤テストの実行結果
  テストを実行した結果が表示される。成功した場合は緑、失敗した場合は赤いバーが表示される。
• ⑥テストケースのコマンドテーブル
  記録したブラウザ操作のコマンド。記録した後、右クリックでコマンドの追加などの編集メニューが開く。
• ⑦コマンドの詳細編集
  コマンドの対象や値などを個別に編集できる。

記録・再生

• 記録
• IDEの開始ボタンを押す
• FireFoxでブラウザ操作を行う
• IDEの開始ボタンをもう一度押す
• 再生
• IDE画面上部の「Base URL」（テスト対象のベースURL）を必要に応じて変更する
• 「現在のテストケースを実行」（上の画像の②にある）を押下
• ブラウザが立ち上がり、記録したケースを再現していく

• WebDriverを利用した場合はブラウザが新規に立ち上がるが、利用しない場合（Selenium1）は現在のタブで再生される。
• IEの場合、ウィンドウをアクティブな状態にしておかないとjavascriptなどがうまく動いてくれない。再生途中でウィンドウを切り替えるなどした場合も同様。

コマンド

• 記録したブラウザ操作を編集できる。アサーションもコマンドで行う。

• コマンドの挿入
• コマンドテーブルを右クリック
• 「コマンドの挿入」で空行を入れる
• 設定したいコマンド、対象、値を入れる
  コマンドに必要な対象、値などはコマンド設定時にIDE画面下部に表示されるリファレンスを参照のこと。
• アサーションのモデル3種
• assert　失敗した場合、テストは中止される
• verify　 失敗した場合、失敗はログに記録されてテストは継続実施される
• waitFor 条件が満たされることを待つ（Ajaxのテストに有効）。
• 条件が既に満たされている場合は直ちに検証成功となる。
• しかし、現在のタイムアウト設定の時間内に条件が満たされなかった場合には検証失敗となり、テストを中止する。
• assertの一覧等は、Selenium2​/コマンドを参照。

要素の選択

• IDE画面上の「Select」ボタンを押下すると選択モードに入る。そのままFireFox上のページの選択したい部分をクリックすると、その要素が選択される。
• また、選択した要素はプルダウンで異なる記述にもできる（Xpathなど）。

変数の設定

• storeコマンドで変数を設定できる。

• 例の場合はfooに1を代入する。
• 変数は${変数名}で利用できる（例：${foo}）

コマンド	対象	値
captureEntirePageScreenshot	保存先のフルパス

スクリーンショットの取得

• captureEntirePageScreenshotコマンドでスクリーンショットが取得できる。

コマンド	対象	値
store	foo	1

テストケース/スイートの保存

• 作成したテストケースは「ファイル」の「テストケースを保存」から保存できる。
• 名前や拡張子は任意のものでよいが、ファイルに記述される内容はフォーマットで設定した形式になる（デフォルトはHTML）。
• 名前や拡張子は任意のものでよいが、ファイルに記述される内容はフォーマットで設定した形式になる（デフォルトはHTML）。

• 下記のフォーマットに変更できる
• Java
• Ruby
• Python2
• C#
• ただし、IDEが読み込める形式はあくまでもHTMLなので、一度他のフォーマットに変換したものを可逆的に読み込むことはできない。
• FireFoxにIDEをインストールしている場合、以下のプラグインを入れることでphpUnit形式にエクスポートできる。
• https://addons.mozilla.org/ja/firefox/addon/selenium-ide-php-formatters/
• 作成したケースをまとめて保存したい場合は、「ファイル」→「スイートを保存」で現在のケースをまとめて保存できる。

拡張スクリプト（ユーザーオリジナルコマンド）

• Seleniumはユーザーが拡張してオリジナルのコマンドを作成することができる。
• Javascriptで記述するため、作成した拡張スクリプトがWebDriver経由ではうまく動かない場合もある。

作成方法

• 参考：アイフラッグラボ|Selenium IDEの拡張スクリプト

インポート

• 作成したjsファイルを、IDEのオプション→「一般」タブ→「Selenium Core 拡張スクリプトのパス」で読み込むことで利用できる。
• 参考：

Jenkins連携

 

設定方法

便利なアドオン

• Stored Variables Viewer (Selenium IDE)
• ケース中で設定した変数を一覧で確認できる

• ScreenShot on Failn
• テストの実行が失敗した時のブラウザの画面キャプチャを自動で取得する

• SelBlocks (for Selenium IDE)
• while、for、foreachコマンドを利用可能にする（Selenium1のみで動作）

• File Logging
• 結果のログを指定ファイルに出力できる。出力レベルも設定可能

• Test Results (Selenium IDE)
• 実行した結果をHTML形式で出力できる。ケース毎、スイート全体の出しわけもできる
• 

 

• Selenium IDE Flow Control
• whileなどのコマンドをIDEに追加可能にする。Selenium2で動作

その他

オブジェクトの選択方法

• ページ内のオブジェクトを選択する方法はいくつもある（ID名、Xpath、リンク名、etc...）。公式ドキュメント - 位置付け戦略

テストケースの自動生成

• Selenium Generator
 
• Web画面からバリエーションテストを生成できる。IDE用。

• Excelを使って単体、結合テストケースを自動生成するSelenium,PHPUnitサポートツール:STAR Auto Testing Framework
• エクセルの項目を埋めると、マクロでIDE用のケースを出力できる。

参考リンク

• Selenium IDEの導入のいろいろ
• Selenium 日本語ドキュメント