首页 > 解决方案 > 如何使用 Flutter 测试 GridView 小部件的所有元素是否导航到新屏幕?

问题描述

我想测试一下,屏幕 1 上的 GridView 的所有元素在点击时使用 testWidget. 当我希望在小部件树上找到屏幕 2 时,测试对 GridView 的前 2 个元素(1、2)正常工作,但对另一个(3、4、5、6)失败。我也尝试使用tester.scrollUntilVisible(finder, delta)没有成功。

你有想法在颤振中测试这个吗?

主意 :在此处输入图像描述

测试失败输出:

══╡ EXCEPTION CAUGHT BY FLUTTER TEST FRAMEWORK ╞════════════════════════════════════════════════════
The following TestFailure object was thrown running a test:
  Expected: exactly one matching node in the widget tree
  Actual: _WidgetTypeFinder:<zero widgets with type "Screen2" (ignoring offstage widgets)>
   Which: means none were found but one was expected

When the exception was thrown, this was the stack:
#4      main.<anonymous closure> (file:///C:/Users/adrie/OneDrive/Documents/dev/underclocking/draft.dart:20:7)
<asynchronous suspension>
<asynchronous suspension>
(elided one frame from package:stack_trace)

飞镖垫: https ://dartpad.dev/5330b83a87481487b279db2e635892a3

代码:

import 'package:flutter/material.dart';
import 'package:flutter_test/flutter_test.dart';

main() {
  for (var i = 1; i <= 6; i++) {
    testWidgets('Should navigate to screen 2 from MyButton $i', (tester) async {
      await tester.pumpWidget(MyApp());

      expect(find.byType(Screen2), findsNothing);
      final button = find.widgetWithText(Container, '$i');

      await tester.tap(button);
      await tester.pumpAndSettle();

      expect(find.byType(Screen2), findsOneWidget);
      expect(find.byType(Screen1), findsNothing);
    });
  }
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
        title: 'Flutter Demo',
        debugShowCheckedModeBanner: false,
        theme: ThemeData(
          primarySwatch: Colors.blue,
        ),
        routes: {
          '/screen1': (context) => Screen1(),
          '/screen2': (context) => Screen2(),
        },
        home: Screen1());
  }
}

class Screen1 extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
        body: GridView.count(
      crossAxisCount: 2,
      children: <Widget>[
        MyButton('1'),
        MyButton('2'),
        MyButton('3'),
        MyButton('4'),
        MyButton('5'),
        MyButton('6'),
      ],
    ));
  }
}

class MyButton extends StatelessWidget {
  final String text;
  const MyButton(this.text, {Key key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return GestureDetector(
      onTap: () => Navigator.of(context).pushNamed('/screen2'),
      child: Container(
        child: Text(text),
        color: Colors.teal[600],
      ),
    );
  }
}

class Screen2 extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(body: Text('Screen 2 !'));
  }
}

标签: flutterflutter-test

解决方案


推荐阅读