はじめに
あけましておめでとうございます！🎍
弊社ispecでは現在、Flutterを使用したプロダクトへのE2Eテストの導入を進めています。
その調査として今回は、Flutter標準パッケージのintegration_testを使って、どのようにテストを実装するのか見ていきます。
サンプルの環境
簡単なログインとホーム画面を用意しました。
IDとパスワードを入力してログインボタンを押すと、ホーム画面に遷移するかどうかをテストしていきます。
| ログイン画面 | ホーム画面 |
|---|---|
 |
 |
準備
1. 必要パッケージの追加
pubspec.yaml
dev_dependencies:
flutter_test:
sdk: flutter
+ integration_test:
+ sdk: flutter
2. テストファイルの作成
lib/やios/と同階層に、integration_test/ディレクトリを作成し、その中にlogin_test.dartを作成しました。
3. テストコードの記述
integration_test/login_test.dart
import 'package:flutter/material.dart';
import 'package:flutter_e2e_test_sample/main.dart' as app;
import 'package:flutter_test/flutter_test.dart';
import 'package:integration_test/integration_test.dart';
void main() {
IntegrationTestWidgetsFlutterBinding.ensureInitialized();
testWidgets('login', (tester) async {
app.main();
await tester.pumpAndSettle(); // 画面の描画が完了するまで待機
await tester.enterText(
find.byKey(const Key('idTextFormField')),
'first-user',
);
await tester.enterText(
find.byKey(const Key('passwordTextFormField')),
'sample-password',
);
await tester.tap(
find.byKey(const Key('loginButton')),
);
await tester.pumpAndSettle();
expect(
find.text('ホーム画面です'),
findsOneWidget,
);
});
}
実行してみる
こちらでも実行できるのですが、
flutter test integration_test
以下で実行すると、Shift + Rでホットリスタートが使えるので、テストの実装中はこちらを使用するのがよさそうです。
事前にシュミレーターを起動した状態で実行してください。
flutter run -t integration_test/login_test.dart
しばらくすると、アプリが自動的に起動し、テストが実行され、ターミナルにAll tests passed!と表示されて、テストが完了しました！
導入に向けて
上記はサンプルなので、あっさり終わってしまいましたが、実際に導入するには、バックエンドやCI等のテスト実行環境の構築や、テストシナリオの作成など、やるべき事が沢山あります。導入を進める中で、下記の登壇動画と資料がとても参考になっています！(ありがとうございます🙏)
特に気になった点を、自分用のメモとして書き残します (ほぼ全部ですね…😅)
- Test Matrixを使用した注力ポイントの分析
- Test Case Prioritizationを用いた評価指標の作成
- Robot Patternの採用
- PageDriver Class
- PageFindable Class
- FlowDriver Class
- OSのUIを操作できるようにするPatrolの導入
- 不安定なシナリオへの対応策
- Firebase Test Labの使用
- シナリオの実行頻度
さいごに
2024年もよろしくお願いします！
今日使用したサンプルコードはこちらにあります。
Discussion