Testing Flutter apps翻譯-集成測試介紹

翻譯首頁

單元測試和Widget測試對測試單獨的類、方法或者Widget頗有用。然而，他們一般不能測試單獨部分如何做爲一個總體一塊兒工做或者查看應用程序在一個真實設備上運行時的性能。集成測試就是用來解決該問題的。

集成測試成對使用：首先，將已檢測的應用程序部署到真實設備或模擬器，而後從單獨的測試套件「驅動」應用程序，檢查以確保一切正常。

要建立此測試對，咱們可使用flutter_driver包。 它提供了建立檢測程序並從測試套件中驅動這些程序的工具。

在本文中，咱們將學習如何測試計數器應用程序。 它將演示如何設置集成測試，如何驗證應用程序顯示的特定文本，如何點擊特定的Widgets以及如何運行集成測試。

步驟：

1. 建立一個要測試的應用
2. 添加flutter_driver依賴項
3. 建立測試文件
4. 檢查應用程序
5. 編寫集成測試代碼
6. 運行集成測試

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<MyHomePage> {
  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: <Widget>[
            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。

1. 第一個文件包含應用程序的「已檢測」版本。這個檢測容許咱們「驅動」應用程序而且記錄測試組件對它的性能分析。這個文件能夠起任何合理的名字。在這個例子裏，建立的文件名字叫test_driver/app.dart。

2. 第二個文件包含測試組件，它用來驅動應用程序並驗證應用程序是否按照預期的正常運行。這個測試組件也能記錄性能分析。這個測試文件的名字必須和包含被檢測應用程序的名字對應，並在文件名字後面添加_test做爲結尾。因此建立的第二個文件的名字叫test_driver/app_test.dart。

如今的目錄結構是這樣的：

counter_app/
  lib/
    main.dart
  test_driver/
    app.dart
    app_test.dart
複製代碼

4. 檢查應用程序

如今，咱們能夠檢測這個應用程序了，這包括如下2步：

1. 啓用 flutter driver 擴展
2. 運行應用程序

咱們將會把下面的代碼寫到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步：

1. 建立 SeralizableFinders 去查找特定的Widget。
2. 在咱們的測試運行在setUpAll函數以前先鏈接到咱們的應用程序。
3. 對重要場景進行測試
4. 在咱們的測試完成之後，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
複製代碼

該命令作了如下事情:

1. 構建 --target 指定的應用程序而且將它安裝到模擬器或者真實設備。
2. 載入應用程序。
3. 運行test_driver/文件夾下面的app_test.dart文件。