前回の記事では、【自動化テスト入門④】Katalon StudioのインストールからGitHub連携、初めてのログインテスト作成まで 紹介しました。
今回は、Spy Webを使ってWebページの要素を取得し、Variables(変数)を利用したログインテストを作成してみます。
Record Webよりも管理しやすく、実務でもよく利用される方法なので、ぜひ試してみてください。
- Spy Webとは
- Spy WebでObjectを取得する
- ログインテストを作成する
- Variables(変数)の作成
- Variablesを使ってログインテストを実行する
Spy Webとは?
Spy Webは、ブラウザ上の要素(Object)を取得し、取得したObjectはObject Repositoryに保存されるため、複数のテストケースから再利用することもできます。
Record Webのように操作を記録するのではなく、必要な要素だけを取得できるため、Objectを整理しながらテストケースを作成できます。
Spy Webのメリット
- 必要なObjectだけ取得できる
- Object Repositoryを整理しやすい
- 不要な操作が記録されない
- メンテナンスしやすいテストを作成できる
Spy WebでObjectを取得する
今回はログイン画面を例に進めます。
⚠️今回はローカル環境でテストを行うため、事前にプロジェクトを起動してからテストを実行してください。
- Katalon Studioを開き、Action → Spy Webをクリックします。

- ブラウザが起動したらログイン画面へアクセスし、「Start」をクリックします。

取得するObjectは以下の3つです。
- ユーザーID入力欄
- パスワード入力欄
- ログインボタン
Object取得方法
- 取得したい要素を選択し、右クリックして「Capture Object」を選択します。
- ショートカットキー(Alt + `)を利用して取得することもできます。

- 取得したらSaveを押下し、Object Repositoryへ保存します。

- 以下のようにObject Repositoryへ格納されます。
- 保存場所:Object Repository内(フォルダ名などは変更できます)

テストケースを作成する
Objectの取得が完了したら、新しいTest Caseを作成します。
作成方法:
- Test Casesを右クリック
- New → Test Case
- 任意の名前を入力して作成

今回はScriptモードを利用してログインテストを作成しました。
実装した処理は以下の流れです。
- ブラウザを起動し、ログイン画面へアクセスする
- ユーザーIDを入力する
- パスワードを入力する
- ログインボタンをクリックする
- ブラウザを閉じる

Scriptモード作成方法
Scriptモードでは、Katalonが提供するWebUIキーワードを利用してテストを記述します。
例えば、テキストを入力する場合はWebUI.setText()、ボタンをクリックする場合はWebUI.click()を使用します。
また、操作対象となる要素はfindTestObject()で指定します。ここには、先ほどSpy Webで取得し、Object Repositoryに保存されているObjectのパスを指定します。

パスは直接入力することもできますが、ScriptモードではObject Repositoryからドラッグ&ドロップして挿入することも可能です。
例えば、ログインボタンをクリックする場合は、以下のように記述します。
WebUI.click(findTestObject('Object Repository/SpyWeb/ログインボタン'))このように、Spy Webで取得したObjectとWebUIキーワードを組み合わせることで、GUI操作をスクリプトとして簡単に記述できます.
Variables(変数)を利用する
IDやパスワードを直接スクリプトに記述すると、変更が発生した際に毎回コードを修正する必要があります。そこで今回は、Variables(変数)を利用してログイン情報を管理します。
作成方法:
- TestCaseを開く
- 下のバーのVariablesをクリック
- Addをクリック
- Name ,Type ,Default Valueなど必要な情報を入力

Variablesを利用することで、ログイン情報など変更される可能性がある値を一元管理できます。そのため、値を変更する場合でもVariablesを書き換えるだけで済み、テストケースを修正する必要がありません。

Object Repositoryに保存しておくことで、同じObjectを複数のテストケースから利用できます。
ログイン情報だけでなく、検索キーワードや入力データなど、変更される可能性がある値はVariablesとして管理しておくと、テストケースを再利用しやすくなります。
Variablesを使ってログインテストを作成する
入力値には直接文字列を書く代わりに、作成したVariablesを指定します。Scriptモードでは、作成したVariablesを次のように利用できます。
emailとpasswordには、Variablesで設定した値が自動的に渡されます。
WebUI.setText(findTestObject('...'), email)
WebUI.setEncryptedText(findTestObject('...'), password)
値を変更したい場合はVariablesの値を変更するだけなので、テストケース自体を修正する必要がありません。
テストを実行する
保存後に実行ボタンを押します。
ブラウザが起動し、
- ユーザーID入力
- パスワード入力
- ログインボタン押下
まで自動で実行されれば成功です。

Variablesの値を変更して再実行すると、別のアカウントでも同じテストケースを利用できることが確認できます。

正常に実行されると、Test Explorerには「Passed」と表示されます。
Spy WebとVariablesを使うメリット
今回紹介した方法には、次のようなメリットがあります。
- Objectと入力値を分けて管理できる
- テストケースの修正が少なくなる
- 同じテストを別のアカウントでも利用しやすい
- 保守性の高いテストケースを作成できる
Record Webで作成したテストをそのまま利用するだけでなく、Spy WebとVariablesを組み合わせることで、より実務に近いテストを作成できます。
まとめ
今回は、Spy Webを利用したObjectの取得方法と、Variablesを使ったログインテストの作成方法を紹介しました。
Record Webでは操作を素早く記録できますが、Spy WebとVariablesを組み合わせることで、より保守性の高いテストケースを作成できます。
次回は、Test SuiteとData Bindingを利用して、複数のデータで同じテストを繰り返し実行する方法を紹介します。

