7. チュートリアル¶

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

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

• Accel Studio で作成した画面のテストケースを作成
• 作成したテストケースを実行し、テスト結果を確認

7.2. 準備・環境設定¶

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

7.3. テスト定義の作成¶

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

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

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

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

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

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

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

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

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

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

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

Test generator

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. テスト結果の確認¶

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