翻訳ホームページ
ユニットテストとWidgetテストは、個別のクラス、メソッド、またはWidgetをテストするのに役立ちます.しかし、通常、個別の部分がどのように全体として動作するかをテストしたり、アプリケーションが実際のデバイスで実行されているときのパフォーマンスを表示したりすることはできません.統合テストは、この問題を解決するために使用されます.
統合テストのペア使用:まず、検出されたアプリケーションを実際のデバイスまたはシミュレータに配備し、個別のテストキットのドライバアプリケーションからすべてが正常であることを確認します.
このテストペアを作成するにはflutter_を使用します.driverパッケージ.検出プログラムを作成し、テストキットからこれらのプログラムを駆動するツールを提供します.
本稿では、カウンタアプリケーションをテストする方法について学習します.統合テストを設定する方法、アプリケーションに表示される特定のテキストを検証する方法、特定のWidgetsをクリックする方法、統合テストを実行する方法を示します.
手順:

テストするアプリケーションを作成する

flutter_driver依存

を追加

テストファイル

を作成する

アプリケーション

の確認

統合テストコード

を記述する

統合テスト

を実行

1.テストするアプリケーションの作成

まず、テスト用のアプリケーションを作成します.この例では、flutter createコマンドによって作成されたカウンタアプリケーションをテストします.このアプリケーションでは、ユーザーがボタンをクリックしてカウントを増やすことができます.さらに、ValueKeyをTextおよびFloatingActionButton Widgetsに提供します.これにより、テストキットでこれらの特定のWidgetsを識別し、インタラクティブにすることができます.

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Counter App',
      home: MyHomePage(title: 'Counter App Home Page'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key, this.title}) : super(key: key);

  final String title;

  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State {
  int _counter = 0;

  void _incrementCounter() {
    setState(() {
      _counter++;
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            Text(
              'You have pushed the button this many times:',
            ),
            Text(
              '$_counter',
              // Provide a Key to this specific Text Widget. This allows us
              // to identify this specific Widget from inside our test suite and
              // read the text.
              key: Key('counter'),
              style: Theme.of(context).textTheme.display1,
            ),
          ],
        ),
      ),
      floatingActionButton: FloatingActionButton(
        // Provide a Key to this the button. This allows us to find this
        // specific button and tap it inside the test suite.
        key: Key('increment'),
        onPressed: _incrementCounter,
        tooltip: 'Increment',
        child: Icon(Icons.add),
      ),
    );
  }
}

2.flutter_を追加driver依存項目

次に、統合テストを書くにはflutter_driverパッケージが必要です.pubspec.yamlファイルのdev_dependenciesの下にflutter_driver依存を追加します.
実際のテスト関数と断言を使用するために、test依存も追加します.

dev_dependencies:
  flutter_driver:
    sdk: flutter
  test: any

3.テストファイルの作成

ユニットテスト、Widgetテストとは異なり、統合テストコンポーネントはテストされたアプリケーションと同じプロセスで実行されません.したがって、同じディレクトリに2つのファイルを作成する必要があります.慣例に従って、このディレクトリの名前はtest_driverです.

最初のファイルには、アプリケーションの「検出済み」バージョンが含まれています.この検出により、アプリケーションを「駆動」し、テストコンポーネントのパフォーマンス分析を記録できます.この書類はいかなる合理的な名前をつけることができる.この例では、作成されたファイル名はtest_driver/app.dartです.

の2番目のファイルには、アプリケーションを駆動し、アプリケーションが予想通りに正常に動作しているかどうかを確認するテストコンポーネントが含まれています.このテストコンポーネントは、パフォーマンス分析も記録できます.このテストファイルの名前は、検出されたアプリケーションを含む名前に対応し、ファイル名の後に_testを末尾として追加する必要があります.作成された2番目のファイルの名前はtest_driver/app_test.dartです.

現在のディレクトリ構造は次のとおりです.

counter_app/
  lib/
    main.dart
  test_driver/
    app.dart
    app_test.dart

4.アプリケーションの確認

これで、このアプリケーションを検出できます.これには、次の2つのステップが含まれます.

flutter driver拡張

を有効にする

アプリケーション

を実行
次のコードをtest_driver/app.dartファイルに書きます.

import 'package:flutter_driver/driver_extension.dart';
import 'package:counter_app/main.dart' as app;

void main() {
  // This line enables the extension
  enableFlutterDriverExtension();

  // Call the `main()` function of your app or call `runApp` with any widget you
  // are interested in testing.
  app.main();
}

5.統合テストコードの作成

検出可能なアプリケーションがあります.テストコードを書くことができます.これには、次の4つのステップが含まれます.

は、特定のWidgetを検索するためにSeralizableFindersを作成する.

は、setUpAll関数を実行する前に、私たちのテストをアプリケーションに接続します.

重要シーンのテスト

私たちのテストが完了した後、teardownAll関数でアプリケーションとの接続を切断します.

// Imports the Flutter Driver API
import 'package:flutter_driver/flutter_driver.dart';
import 'package:test/test.dart';

void main() {
  group('Counter App', () {
    // First, define the Finders. We can use these to locate Widgets from the
    // test suite. Note: the Strings provided to the `byValueKey` method must
    // be the same as the Strings we used for the Keys in step 1.
    final counterTextFinder = find.byValueKey('counter');
    final buttonFinder = find.byValueKey('increment');

    FlutterDriver driver;

    // Connect to the Flutter driver before running any tests
    setUpAll(() async {
      driver = await FlutterDriver.connect();
    });

    // Close the connection to the driver after the tests have completed
    tearDownAll(() async {
      if (driver != null) {
        driver.close();
      }
    });

    test('starts at 0', () async {
      // Use the `driver.getText` method to verify the counter starts at 0.
      expect(await driver.getText(counterTextFinder), "0");
    });

    test('increments the counter', () async {
      // First, tap on the button
      await driver.tap(buttonFinder);

      // Then, verify the counter text has been incremented by 1
      expect(await driver.getText(counterTextFinder), "1");
    });
  });
}

6.統合テストの実行

検出可能なアプリケーションとテストコンポーネントがあり、テストを実行できます.まず、AndroidシミュレータまたはiOSシミュレータが起動しているか、コンピュータを実際のiOS/Androidデバイスに接続しているかを確認します.
次に、プロジェクトのルートディレクトリで次のコマンドを実行します.

flutter drive --target=test_driver/app.dart

このコマンドは、次のことをしました.

は、--targetによって指定されたアプリケーションを構築し、シミュレータまたはリアルデバイスにインストールする.

アプリケーションをロードします.

test_driver/フォルダの下にあるapp_test.dartファイルを実行します.