Flutter インテグレーションテストの実装

目次

• プロジェクトのセットアップと依存関係
• MCP を介したインタラクティブな探索
• テスト作成ガイドライン
• 実行とプロファイリング
• ワークフロー: エンドツーエンドインテグレーションテスト
• 例

プロジェクトのセットアップと依存関係

インテグレーションテストと Flutter Driver 拡張をサポートするようプロジェクトを構成します。

1. 必要な開発依存関係を pubspec.yaml に追加します:

   flutter pub add 'dev:integration_test:{"sdk":"flutter"}'
   flutter pub add 'dev:flutter_test:{"sdk":"flutter"}'
   

2. アプリケーションのエントリーポイント (通常は lib/main.dart または専用の lib/main_test.dart) で Flutter Driver 拡張を有効にします:
   • package:flutter_driver/driver_extension.dart をインポートします。
   • runApp() の前に enableFlutterDriverExtension(); を呼び出します。
3. アプリケーションコード内の重要なウィジェットに Key パラメーター (例: ValueKey('login_button')) を追加して、テスト中に確実にターゲットできるようにします。

MCP を介したインタラクティブな探索

Dart/Flutter MCP サーバーのツールを使用して、静的テストを作成する前にアプリケーションの状態をインタラクティブに探索および操作します。

• 起動: launch_app を target: "lib/main_test.dart" で実行してアプリケーションを起動し、DTD URI を取得します。
• 検査: get_widget_tree を実行して、利用可能な Key、Text ノード、ウィジェット Type を発見します。
• 操作: tap、enter_text、scroll を実行してユーザーフローをシミュレートします。
• 待機: ナビゲーション中またはアニメーションをトリガーするときは、常に waitFor を実行するか、get_health で状態を確認します。
• マウント解除されたウィジェットのトラブルシューティング: ウィジェットがツリーに見つからない場合、SliverList または ListView で遅延ロードされている可能性があります。scroll または scrollIntoView を実行してウィジェットを強制的にマウントしてから操作します。

テスト作成ガイドライン

flutter_test API パラダイムを使用してインテグレーションテストを構成します。

• プロジェクトルートに専用の integration_test/ ディレクトリを作成します。
• すべてのテストファイルに <name>_test.dart 命名規則を使用してください。
• main() の開始時に IntegrationTestWidgetsFlutterBinding.ensureInitialized(); を呼び出してバインディングを初期化します。
• await tester.pumpWidget(MyApp()); を使用してアプリケーション UI をロードします。
• tester.tap() などのインタラクション後に await tester.pumpAndSettle(); を使用してフレームをトリガーし、アニメーションの完了を待機します。
• expect(find.byKey(ValueKey('foo')), findsOneWidget); または findsNothing を使用してウィジェットの表示を確認します。
• await tester.scrollUntilVisible(itemFinder, 500.0, scrollable: listFinder); を使用して、特定の画面外のウィジェットまでスクロールします。

レガシー flutter_driver の条件付きロジック:

• レガシー flutter_driver テストを保守または移行する場合は、WidgetTester API の代わりに driver.waitFor()、driver.waitForAbsent()、driver.tap()、driver.scroll() を使用します。

実行とプロファイリング

flutter drive コマンドを使用してテストを実行します。test_driver/integration_test.dart に配置されたホストドライバースクリプトが integrationDriver() を呼び出す必要があります。

条件付き実行ターゲット:

• Chrome でテストする場合: 別のターミナルで chromedriver --port=4444 を起動してから、実行します: flutter drive --driver=test_driver/integration_test.dart --target=integration_test/app_test.dart -d chrome
• ヘッドレス Web でテストする場合: -d web-server で実行します。
• Android (ローカル) でテストする場合: flutter drive --driver=test_driver/integration_test.dart --target=integration_test/app_test.dart を実行します。
• Firebase Test Lab (Android) でテストする場合:
  1. デバッグ APK をビルドします: flutter build apk --debug
  2. テスト APK をビルドします: ./gradlew app:assembleAndroidTest
  3. 両方の APK を Firebase Test Lab コンソールにアップロードします。

ワークフロー: エンドツーエンドインテグレーションテスト

このチェックリストをコピーして、インテグレーションテストを実装および検証します。

• タスク進捗: セットアップ
  • integration_test と flutter_test を pubspec.yaml に追加します。
  • enableFlutterDriverExtension() をアプリエントリーポイントに挿入します。
  • ターゲットウィジェットに ValueKey を割り当てます。
• タスク進捗: 探索
  • MCP 経由で launch_app を実行します。
  • get_widget_tree を使用してウィジェットツリーをマッピングします。
  • MCP ツール (tap, enter_text) を使用してインタラクションパスを検証します。
• タスク進捗: 作成
  • integration_test/app_test.dart を作成します。
  • WidgetTester API を使用してテストケースを記述します。
  • integrationDriver() を含む test_driver/integration_test.dart を作成します。
• タスク進捗: 実行とフィードバックループ
  • flutter drive --driver=test_driver/integration_test.dart --target=integration_test/app_test.dart を実行します。
  • フィードバックループ: テスト出力を確認 → PumpAndSettleTimedOutException が発生する場合は、無限アニメーションを確認 → ウィジェットが見つからない場合は scrollUntilVisible を追加 → テストが成功するまで再実行します。

例

標準インテグレーションテスト (integration_test/app_test.dart)

import 'package:flutter/material.dart';
import 'package:flutter_test/flutter_test.dart';
import 'package:integration_test/integration_test.dart';
import 'package:my_app/main.dart';

void main() {
  IntegrationTestWidgetsFlutterBinding.ensureInitialized();

  group('End-to-end test', () {
    testWidgets('tap on the floating action button, verify counter', (tester) async {
      // Load app widget.
      await tester.pumpWidget(const MyApp());

      // Verify the counter starts at 0.
      expect(find.text('0'), findsOneWidget);

      // Find the floating action button to tap on.
      final fab = find.byKey(const ValueKey('increment'));

      // Emulate a tap on the floating action button.
      await tester.tap(fab);

      // Trigger a frame and wait for animations.
      await tester.pumpAndSettle();

      // Verify the counter increments by 1.
      expect(find.text('1'), findsOneWidget);
    });
  });
}

ホストドライバースクリプト (test_driver/integration_test.dart)

import 'package:integration_test/integration_test_driver.dart';

Future<void> main() => integrationDriver();

パフォーマンスプロファイリングドライバースクリプト (test_driver/perf_driver.dart)

テストアクションを binding.traceAction() でラップしてパフォーマンスメトリクスをキャプチャする場合は、このドライバースクリプトを使用します。

import 'package:flutter_driver/flutter_driver.dart' as driver;
import 'package:integration_test/integration_test_driver.dart';

Future<void> main() {
  return integrationDriver(
    responseDataCallback: (data) async {
      if (data != null) {
        final timeline = driver.Timeline.fromJson(
          data['scrolling_timeline'] as Map<String, dynamic>,
        );

        final summary = driver.TimelineSummary.summarize(timeline);

        await summary.writeTimelineToFile(
          'scrolling_timeline',
          pretty: true,
          includeSummary: true,
        );
      }
    },
  );
}