【自動化テスト入門④】Katalon StudioのインストールからGitHub連携、初めてのログインテスト作成まで

今回は自動化テストツール「Katalon Studio」を使って、環境構築から簡単なログインテストを作成するところまで進めてみました。

自動化テストをこれから学習したい方の参考になれば幸いです。

---

開発環境

• macOS
• Katalon Studio
• Google Chrome
• GitHub
• Next.js（テスト用アプリ）

---

1. Katalon Studioのインストール

まずはKatalon Studioをインストールします。

Katalon公式サイトからインストーラーをダウンロードします。

1. Katalon公式サイトへアクセス
2. OSに合わせたインストーラーをダウンロード
3. インストール後、Katalon Studioを起動

初回起動時にはアカウント作成および簡単なアンケートが表示されます。今回は個人学習用として利用するため、必要な項目を選択して進めました。

例：

※ 無料プランでも学習目的であれば十分利用可能です。

---

2. 新規プロジェクト作成

続いてKatalon Studioで新しいプロジェクトを作成します。今回はWeb自動化テストを行うため、Webプロジェクトを選択しました。

プロジェクト生成の流れ

1. NewProjectクリック
2. プロジェクト名を入力
3. プロジェクト生成

画面の左側にNewProjectボタンがあります。

今回はWebのテストなので、TypeはWebを選択します。

プロジェクト作成後、以下のようなフォルダが自動生成されます。

---

3. GitHubとの連携

作成したテストコードを管理するため、GitHubと連携します。今回は事前にGitHub上でリポジトリを作成しておきました。

Katalon StudioのメニューからShareProjectを選択します。

Git → Share Project on Git

私の場合は、既にGit管理されているフォルダ配下にプロジェクトを作成していたため、今回は自動的にGitHubリポジトリが認識されました。もし、URLを入力する欄が出てきたらGithubのレポジトリURLを貼り付けてください。

正常に連携できると、Push・Pullメニューが利用できるようになります。

4. WebDriverを更新する

プロジェクトを作成したら、まずはWebDriverを更新しておきましょう。今回はChromeでテストを実行するため、以下のメニューからChrome Driverを更新しました。

Tools → Update WebDrivers → Chrome

例：

5. Record Webを利用したログインテスト作成

早速テストを実行してみました。今回はRecordWebを利用して、テスト用に作成したログイン画面の自動テストを作成しました。

テストの流れ

1. Record Web実行
2. テスト対象のURLを入力し、StartRecord実行
3. テストを行う
4. 保存する

メニューからRecordWebを選択します。

テスト対象URLを入力します。

ブラウザが起動したら、通常の操作と同じように以下を実施します。

1. メールアドレス入力
2. パスワード入力
3. Loginボタンをクリック
4. ダッシュボード画面へ遷移
5. Saveクリック
6. test caseのName変更→OK実行

例：

操作終了後、「Save」をクリックすると、Katalon Studioが自動的にテストケースを生成してくれます。さらに、操作した要素はObject Repositoryへ自動登録されます。

例：

作成されたテストコード

Record Web実行後、以下のようなコードが自動生成されました。

---

テスト実行

作成されたテストが正常に実行されるか、確認する方法は以下になります。

1. test caseから該当のテストを開く
2. 実行ボタンをクリック
3. 実行

まとめ

今回はKatalon Studioの基本的な環境構築を行いました。次回はObject RepositoryやSpy Webを利用した要素取得方法についても学習していきたいと思います。