高東ソフトウェアサービス

最終更新日: 2010/04/20

メモ: IeUnit を使った Web アプリケーションのテスト (Internet Explorer 限定)

概要

Project Hosting on Google CodeIeUnit を使えば、Internet Explorer 限定ではありますが、Web アプリケーションテストの自動化が行えます。
他のオープンソース系の Web アプリテスト用フレームワークだと、別途 xUnit系(JUnit、NUnit など)のフレームワークを用意する必要があったり、 HTTP のリクエストに基づいてテストコードを書かなければならなかったりと(もちろんベースになるコードは自動生成できますが)、 ある程度テスト対象の Web アプリの内部を知っていなければテストコードを書くのが難しい、と感じるのですが、 IeUnit では、実際にユーザーが入力する手順に近い形でテストを作成することができるため、「このボタンをクリックするテストを書く場合、 こんなクエリ文字列が必要」というような Web アプリの内部情報を知らなくてもテストコードを書くことができます。
また、付属するコード生成ツールが秀逸で、ツール上でテスト対象画面を呼び出し、テキストやボタンなどを操作することで、 操作に対応するテストコードを生成してくれるため、ベースとなるコードをサクサク作成できます。
作成されるテストコードは JavaScript で書かれており、実行するにあたっても IeUnit だけで完結しており、 別のフレームワークを用意する必要がないため、テスト環境を作成するのも楽でした。
ただし、IeUnit を動作させるには、以下のものが必要になりますので、事前に準備が必要です。

  • Internet Explorer バージョン 6 以上

  • Windows Script バージョン 5.6 以上

  • Microsoft .NET Framework 2.0 ランタイム

IeUnit のインストール

IeUnit のページ から IeUnit のパッケージをダウンロードします。 IeUnit のページの右の方、「Featured downloads」の箇所のリンクをクリックしてダウンロードしてください。
以下では、IeUnit バージョン 2.3.240a を使っています。また、Internet Explorer(以下 IE)は、バージョン 6 を使い、 Windows XP 上で作業しました。

IeUnit のダウンロードのリンク

管理者権限で、ダウンロードしたパッケージのインストーラを起動します。 インストール先は「C:\Bin\IeUnit\」とし、使用できるユーザーには「Everyone」を選びました。
入力が済んだら、「Next」をクリックします。

IeUnit のインストール(その1)

「Next」をクリックするとインストールが開始されますので、そのまましばらく待ちます。

IeUnit のインストール(その2) IeUnit のインストール(その3)

インストールが完了したら、「Close」をクリックして、画面を閉じて下さい。

IeUnit のインストール(その4)
サンプルを試す

テストのサンプルが付属しているので、これを試してみます。
スタートメニューから [IeUnit] - [Run IeUnit Demo] を実行します。

IeUnit のサンプル実行のメニュー

サンプルを起動すると IE の画面が自動的にパカパカと開いたり閉じたりを繰り返し、画面上でテキストボックスに入力されたり、 チェックボックスにチェックが付けられたりと、いろいろなテストが自動で進行していきます。

IeUnit のサンプル実行画面(その1)

また、テストの実行結果がコマンドプロンプト画面に表示されていきます。

IeUnit のサンプル実行画面(その2)

サンプルの動作を見る限り、かなり色々なことができるようです。
私の環境では、失敗するテストも一部あるようですが、IeUnit はページの操作に DHTML を利用しているそうなので、 作業に使った IE のバージョンが関係しているのかもしれません(私の作業環境は IE 6 で、さすがに古いとは思うのですが、いろいろ理由があってそのままなのです。。。)。 新しいバージョンの IE であれば、うまくいくのかもしれません。

コード生成ツールを使ってみる(作業のスクリプト化)

コード生成ツールを使って、作業のスクリプト化をしてみます。
テスト用のログインページを作成してみましたので (といってもログインに成功したら「ログイン成功」、失敗したら「ログイン失敗」と表示されるだけですが、、、)、 そこにログインする作業をスクリプト化してみます。
なお、ログインに必要なユーザー、パスワードは、ともに「hoge」です。

スタートメニューから [IeUnit] - [QuickFocus.exe] を実行します。

QuickFocus の実行のメニュー

[URL] に「http://www.koutou-software.net/junk/mynote-ieunit-webapp-test/test.cgi」と入力し、URL 欄の右にある下三角のマークをクリックして、 ページの内容をロードします。

QuickFocus の実行(その1)

URL で指定したページがロードされたら、URL 欄の右側の一番右端にある丸のマークが灰色なのを確認してから、ページ上のユーザー、パスワード欄にそれぞれ 「hoge」と入力し、右下にある「SBK Submit」をクリックします。

指定されている URL を開くスクリプトコードと、ユーザー、パスワード欄のそれぞれに文字列を設定するためのスクリプトコードが左下のコードペインに挿入されます。

なお、丸のマークが灰色のときは、ページ上のコントロールを操作すると、ページ本来の処理が行えます。
丸のマークが赤いときは、ページ上のコントロールを操作してもページ本来の処理は行われず、 対応するスクリプトコードがコードペインに挿入されます。

QuickFocus の実行(その2)

丸のマークをクリックし、赤くしてから、ページ上のログインボタンをクリックします。

対応するスクリプトコードがコードペインに挿入されます。
※上で挿入した、ユーザー、パスワード欄に文字列を設定するスクリプトコードは、丸のマークを赤くしてから、ユーザー欄、パスワード欄をそれぞれクリックすることでも挿入できます。

QuickFocus の実行(その3)

「Run Snippet」をクリックすると、コードペインの内容が実行され、IE が起動し、ログイン処理が行われます。

QuickFocus の実行(その4)

作成したスクリプトを保存するときは、メニューの [File] - [Save Script] を選び、 「Smart Bookmark (*.sbk)」として保存してください。

QuickFocus の実行(保存)

あるいは、QuickFocus の右下のドラッグ&ドロップマークからデスクトップにドラッグ&ドロップすることでも、保存することができます。

QuickFocus の実行(ドラッグ&ドロップでの保存)

保存した Smart Bookmark は、IeUnit に関連付けされていますので、ダブルクリックすることでスクリプトを実行することができます。
また、その中身はテキストファイルで、さきほど生成したスクリプトの内容がそのまま保存されており、 テキストエディタなどで編集することもできます。

Smart Bookmark の内容

なお、ページ上のコントロールをクリックした際に生成されるスクリプトコードは、 右下の「Assertion」「Action」「Alternative」のチェック有無で制御できます。
「Assertion」にチェックを入れておくと、オブジェクトが存在するかをチェックする処理が挿入され、 「Action」にチェックを入れておくと、テキストを設定する、ボタンをクリックするなどのオブジェクトに対するアクションが挿入されます。 「Alternative」にチェックを入れておけば、その他付加的なチェック処理が(コメントとして)挿入されます。
また、スクリプトコードはコードペイン上で直接編集することもできます(日本語も入力できます)。

QuickFocus の実行(その他)
コード生成ツールを使ってみる(テストのスクリプト化)

テストのスクリプト化をしてみます。
QuickFocus を起動し、先ほどの URL を表示し、「Test Case」をクリックします。

テストのためのスクリプトコードがコードペインに挿入されます。

QuickFocus でのテスト作成(その1)

丸のマークが灰色なのを確認してから、ページ上のユーザー、パスワード欄にそれぞれ「hoge」と入力します。
コードペインで testCaseOne メソッドの中にカーソルを置き、丸のマークをクリックして赤くしてから、 ユーザー欄、パスワード欄、ログインボタンの順にクリックします。

対応するスクリプトコードが testCaseOne メソッドに挿入されます。

QuickFocus でのテスト作成(その2)

次に、丸のマークをクリックして灰色にしてから、ログインボタンをクリックします。

ページが、ログイン成功画面に遷移します。

QuickFocus でのテスト作成(その3)

再び、丸のマークをクリックして赤くし、コードペインのカーソルを testCaseOne メソッドの処理の一番最後の行(_.assertTrue(true);)の先頭に置いてから、 ログイン成功の文字をクリックします。

表示されている文字列が「ログイン成功」を保持しているかを確認する処理が挿入されます。

QuickFocus でのテスト作成(その4)

一番最後の行(_.assertTrue(true);)は不要なので、削除します。ここまでで testCaseOne メソッドは以下のようになります。

    this.testCaseOne = function(){
_.assertNotNull(_.findObjById("username"));
_.setField("username", "hoge");
_.assertNotNull(_.findObjById("password"));
_.setField("password", "hoge");
_.assertNotNull(_.findButton("ログイン"));
_.clickButton("ログイン");
_.assertTagHasText("BODY",0,"ログイン成功");
    };

「Run Snippet」をクリックすると、コードペインの内容が実行され、結果が表示されます。

QuickFocus でのテスト作成(結果表示)

作成したスクリプトを保存するときは、メニューの [File] - [Save Script] を選び、 「IeUnit Test Case (*.jst)」として保存してください。

QuickFocus でのテスト作成(保存)

あるいは、QuickFocus の右下のドラッグ&ドロップマークからデスクトップにドラッグ&ドロップすることでも、保存することができます。

QuickFocus でのテスト作成(ドラッグ&ドロップでの保存)

保存した Test Case は、IeUnit に関連付けされていますので、ダブルクリックすることでスクリプトを実行することができます。

Test Case の実行結果

また、その中身はテキストファイルで、さきほど生成したスクリプトの内容がそのまま保存されており、 テキストエディタなどで編集することもできます。

Test Case の内容
テストケースの連続実行(自動化)

作成したテストケースは個々にスクリプトを起動することでも実行できますが、 IeUnit にはコマンドプロンプトからテストケースを起動するバッチファイル(StartTest.bat) が付属しており、これを使って連続実行することができます。

気をつけなければならないのは、StartTest.bat にテストケースの名前のみ指定した場合と、テストケースを格納したファイル名を指定した場合とで動作が違うことです。

名前のみ指定した場合、ファイル中に書かれているテストケースの名前が合致するものを探し出して実行します。この際、ファイル名は考慮されません。

StartTest.bat Hoge1

ファイル名を指定した場合、テストケースの名前に関係なく、指定したファイル中に書かれているテストケースを実行します。

StartTest.bat Hoge1.jst

ファイル名とテストケースの名前を別々にしておくと、ファイルが増えてくるとわからなくなることもあるので、 同じにしておくか、何らかの法則性をもって命名しておく必要があると思います。
なお、現時点の IeUnit のバージョン(2.3.240a)では 1 つのファイルに保存できるテストケースは 1 つだけのようです。
※テストメソッドは複数記述できます。

テストケースを起動するためのプロンプトを開きます。
スタートメニューから [IeUnit] - [Create Tests] を実行します。

テストケースの連続実行(コマンドプロンプトのメニュー)

IeUnit が必要とするパスや環境変数が設定されたコマンドプロンプトが開きます。
通常、IeUnit をインストールしたディレクトリ下の workspace ディレクトリがカレントディレクトリとして設定されます。

テストケースの連続実行(コマンドプロンプト)

ここでは「コード生成ツールを使ってみる(テストのスクリプト化)」で作成したテストケースを、テストケース名を「Hoge1」、 ファイル名を「Hoge1.jst」として変更して workspace 下に配置しました。
また、「Hoge1.jst」をコピーして少し変更し、ユーザー、パスワードを間違えて、ログインに失敗した場合に、テストを成功とするテストケースを作成し、 テストケース名を「Hoge2」、ファイル名を「Hoge2.jst」として、これも workspace 下に配置しています。

IeUnit に付属するバッチファイルでテストケース「Hoge1」を実行するには、以下のようにします。

StartTest.bat Hoge1

実行結果は以下のようになります。

テストケースの連続実行(Hoge1 の実行)

この IeUnit に付属する「StartTest.bat」を使って「Hoge1」、「Hoge2」を順に実行するバッチファイルを作成し、「テストの実行.bat」として保存します。

テストケースの連続実行(バッチファイル)

実行結果は以下のようになります。

テストケースの連続実行(バッチファイルの実行)

実行結果を格納したファイルです。

テストケースの連続実行(バッチファイルの実行結果)
その他

IeUnit バージョン 2.3.240a では、IeUnit をインストールしたディレクトリ下の workspace に以下の 2 つのファイルが最初から配置されています。

  • SampleBookmark.sbk
  • SampleTest.jst

これらのファイルを 1 つでも削除すると、QuickFocus を起動した際や、「Create Tests」コマンドプロンプトを開いた際などに インストーラが再起動され、削除されたファイルを再配置しようとしますので、ご注意ください。
※ファイルの内容を変更するのは問題ありませんでした。

サンプルソースなど

テストケースのスクリプト等(テストケースの連続実行で使用したファイル一式)

workspace.zip (1.51 KB)