7. チュートリアル¶

7.1. チュートリアルの概要¶

本章では、Accel Studio テスト機能を使用して、ローコードツールで作成したアプリケーションをテストする方法を説明します。このチュートリアルで、以下を実現できます。

Accel Studio で作成した画面のテストケースを作成
作成したテストケースを実行し、テスト結果を確認
Accel Studio テスト機能 Copilot を利用して、テスト定義を一括生成

7.2. 準備・環境設定¶

「セットアップ」を参照して、Accel Studio テスト機能テスト実行エージェントを起動してください。

7.3. テスト定義の作成¶

サイトマップからテスト定義一覧に遷移し、テスト定義を作成します。

テストケース単位でテストコードを作成します。今回は登録処理のテストケースを作成します。

7.4. 前処理・後処理のフロー定義作成¶

テスト実行時には、ブラウザでの操作と同様にアプリケーションが実際に操作されます。そのため、データ登録を伴うアプリケーションの場合、テスト実行前・実行後にデータをテストの想定値に合わせて登録・削除する必要があります。

このチュートリアルでは、データをクリアし、常にデータが空であることを保証する前処理・後処理を作成します。

アプリケーション詳細画面から、リソース追加、フロー定義の新規作成画面に遷移します。次に、SQL定義を追加し、利用するデータをクリアするSQL定義を作成してください。

このSQL定義を利用するシンプルなフロー定義を作成します。

7.5. 前処理・後処理の指定¶

作成したフロー定義を前処理と後処理に指定します。

7.6. 操作記録によるテストコードの作成¶

今回は、単純にデータを登録し、登録したデータが表示できるか確認するコードを作成します。VSCodeを利用して操作記録を行います。ツールの利用方法については、Playwright 公式ドキュメントを参照してください。

Test generator

コラム

実際に利用できるコードについては、Playwright の対応バージョンのドキュメントを参照してください。

API reference

記録、または記述したコードを利用してテストコードを作成します。下記がコードの例です。一覧画面に遷移し、新規登録を行い、詳細画面で登録したデータが表示されるか確認するテストコードです。

import { test, expect } from '@playwright/test';

test('test', async ({ page }) => {
  await page.goto('accel-studio-app/sample1/list');
  await page.getByRole('button', { name: '+ 新規作成' }).click();
  await page.locator('#im-element-48').fill('入力1');
  await page.locator('#im-element-63').fill('入力2');
  await page.getByRole('button', { name: '登録' }).click();
  await page.getByRole('button', { name: 'OK' }).click();
  await page.goto('accel-studio-app/sample1/refer?column1=%E5%85%A5%E5%8A%9B1')
  await expect(page.locator('#im-element-52')).toContainText('入力1');
  await expect(page.locator('#im-element-67')).toContainText('入力2');
});

7.7. テスト実行¶

テスト実行ボタンを押下するとテストを実行できます。

コラム

テスト実行ボタンが押下されると、実行エージェントとの間で通信が発生します。なお、テストの実行は命令された順に直列で実行されるため、実行までに時間がかかる可能性があります。

7.8. テスト結果の確認¶

実行したテストは、テスト結果で確認できます。

test 関数ごとに結果ステータスと test タイトルがリストで表現されます。
test タイトルをクリックすると、テスト結果の詳細が表示されます。

コラム

アサーションエラー等が発生している場合、実行時タイムライン上部にエラーのサマリを表示するとともに、実行時タイムライン内でどのテストステップで発生しているのかを確認できます。

../../_images/test_result2_assertion.png

コラム

test 関数については、Playwright の対応バージョンのドキュメントを参照してください。

API reference

コラム

2025 Spring(Kamille) で実行したテスト結果や、テスト実行時に何らかのエラーが発生した場合は test 関数やテストステップは表示されず、以下のデザインで表示されます。

7.9. テスト定義一括生成¶

Accel Studio テスト機能 Copilot を利用して、テスト定義を一括生成します。

コラム

Accel Studio テスト機能 Copilot は 2025 Autumn(Lilac) から利用可能です。
Accel Studio テスト機能 Copilot を利用するためには IM-Copilot および Accel Studio テスト機能 テスト実行エージェント が必要です。
IM-Copilot については「 IM-Copilot 利用ガイド 」を参照してください。

サイトマップからテスト定義一括生成画面に遷移します。

新規作成ボタンを押下し、テスト定義一括生成画面に遷移します。テスト定義一括生成画面では、下記の項目を指定し、テスト定義を一括生成します。

今回はURLを指定してテスト定義を一括生成します。 IM-BloomMaker のルーティング定義を指定することも可能です。

登録先アプリケーション
- テスト定義を登録する Accel Studio アプリケーションを指定します。
一括生成情報
- テスト名
  
  対象種別
  
  URL: テスト対象のURLを直接指定
  
  ルーティング定義: IM-BloomMaker のルーティング定義を指定
- テスト対象URL
- 登録先カテゴリ
- テスト実行ユーザ