testing - 如何在 Flutter 中为多个测试提供 `setUp` 和 `WidgetTester`

Question

1.问题
testWidgets函数显然只是 test 的子案例功能。

我现在要解决的一个用例是为多个 testWidgets 抽取相同的小部件。 , 一个 setUp多个 testWidgets .但是，如果它在每个测试中创建一个新实例，我该怎么做？

我试图初始化一个 WidgetTester在测试之外，在 main() , 但是 WidgetTester只有一个私有(private)构造函数:

class WidgetTester 
  extends WidgetController 
    implements HitTestDispatcher, TickerProvider {
  WidgetTester._(TestWidgetsFlutterBinding binding) : super(binding) {
    if (binding is LiveTestWidgetsFlutterBinding)
      binding.deviceEventDispatcher = this;
}

我不太明白 Flutter 团队是如何完成这项工作的，但初始化了 WidgetTester就像他们在 testWidgets 中所做的一样功能对我不起作用:

final TestWidgetsFlutterBinding binding 
  = TestWidgetsFlutterBinding.ensureInitialized() 
    as TestWidgetsFlutterBinding;
final WidgetTester tester = WidgetTester._(binding);

2. 一个例子

一个简单的例子是尝试分解由 flutter create 中的每个新 Flutter 项目创建的 Flutter 演示的测试。 .在其中，我们可以尝试将应用程序的初始设置测试与点击 Action 测试分开:

testWidgets('Initial setup', (WidgetTester tester) async {
  await tester.pumpWidget(MyApp());

  expect(find.text('0'), findsOneWidget);
  expect(find.text('1'), findsNothing);
});

testWidgets('Increment the counter on tap', (WidgetTester tester) async {
  await tester.pumpWidget(MyApp());

  await tester.tap(find.byIcon(Icons.add));
  await tester.pump();

  expect(find.text('0'), findsNothing);
  expect(find.text('1'), findsOneWidget);
});

我们的想法是尝试移动 await tester.pumpWidget(MyApp());变成 setUp功能。

Answer 1

下面是目前在 Flutter 中解决此问题的方法。
总结一下:

创建 group(..)内部结构main()

从该结构内部为您想要的每组测试创建您自己的私有(private)方法。对于这些私有(private)方法中的每一个:

传入WidgetTester实例

让他们成为async

然后你应该只打一次电话 testWidgets(..)

在此方法中，您可以调用为分发测试逻辑而设置的私有(private)方法

使用 await 调用其中的每一个，所以它们不会同时运行

到目前为止，我还没有找到一种方法让输出指示它运行的每个“子测试”，所以只使用 print(...)现在的声明。
这是一些二维码逻辑的演示:

import 'package:flutter/material.dart';
import 'package:flutter_test/flutter_test.dart';
import 'package:mockito/mockito.dart';
import 'package:qr_code_demo/app/appRoutes.dart';
import 'package:qr_code_demo/view/appHome.dart';
import 'package:qr_code_demo/view/qrScanner.dart';

class MockNavigatorObserver extends Mock implements NavigatorObserver {}

void main() {
  group('MainPage navigation tests', () {
    NavigatorObserver mockObserver;

    _loadAppHomeScreen(WidgetTester tester) async {
      await tester.pumpWidget(
        MaterialApp(
          routes: AppRoutes.getRouteMap(),
          home: AppHomeScreen(),
          navigatorObservers: [mockObserver],
        ),
      );
    }

    setUp(() {
      mockObserver = MockNavigatorObserver();
    });

    Future<Null> _verifyLayoutElements(WidgetTester tester) async {
      print('_verifyLayoutElements');
      expect(find.byIcon(Icons.scanner), findsOneWidget);
      expect(find.byType(FloatingActionButton), findsOneWidget);
      expect(find.byType(RaisedButton), findsOneWidget);
    }

    Future<Null> _navigateToQrScannerScreen(WidgetTester tester) async {
      print('_navigateToQrScannerScreen');

      await tester.tap(find.byIcon(Icons.scanner));
      await tester.pumpAndSettle();

      verify(mockObserver.didPush(any, any));

      expect(find.byType(AppHomeScreen), findsNothing);
      expect(find.byType(QrScannerScreen), findsOneWidget);
    }

    testWidgets('AppHomeScreen WidgetTester', (WidgetTester tester) async {
      await _loadAppHomeScreen(tester);

      await _verifyLayoutElements(tester);
      await _navigateToQrScannerScreen(tester);
    });
  });
}

谢谢:
https://iiro.dev/2018/08/22/writing-widget-tests-for-navigation-events/

滚动到此文件的代码:test/navigation_test.dart

====
再次感谢，因为包含此示例的导航测试逻辑感谢@iiro 的帖子: https://stackoverflow.com/a/51983194/2162226
这里是 appRoutes.dart文件:

import 'package:qr_code_demo/view/appHome.dart';
import 'package:qr_code_demo/view/qrScanner.dart';  

class AppRoutes {

  static const String AppHome = 'AppHome';
  static const String QrScanner = 'QrScanner';

  static String initialRoute() {
    return AppHome;
  }
  
  static getRouteMap() {
    
    return {
      AppRoutes.AppHome: (context) => AppHomeScreen(),
      AppRoutes.QrScanner: (context) => QrScannerScreen()
    };
    
  }
}