flutter 如何用集成测试来测试没有溢出?

uz75evzq  于 2023-08-07  发布在  Flutter
关注(0)|答案(2)|浏览(152)

我使用flutter_driver在Flutter中进行集成测试。在某些屏幕上,按钮上的文本会出现溢出错误。我想创建一个测试,可以显示溢出发生。因此,当我在一堆虚拟/真实的设备上运行所有集成测试时,我可以看到UI定位不正确。

2guxujil

2guxujil1#

没有必要进行集成测试。Widget测试就可以了。
由于Widget测试是在启用Assert的情况下运行的,所以调用tester.pumpWidget时会溢出的Widget会引发异常,从而导致测试失败。
例如,以下测试将失败:

testWidgets('overflow', (tester) async {
  await tester.pumpWidget(Row(
    textDirection: TextDirection.ltr,
    children: <Widget>[
      // too big to fit in the default size of the row
      Container(width: 99999),
    ],
  ));
});

字符串
请注意,小部件测试的屏幕大小可以自定义。参见How to test Flutter widgets on different screen sizes?
或者,我们可以将测试过的小部件 Package 成Container,如下所示:

await tester.pumpWidget(Container(
  alignment: Alignment.center,
  width: <my screen widget>,
  height: <my screen height>,
  child: <the widget which I want to test overflow on>,
);

rqqzpn5f

rqqzpn5f2#

我在我的软件包hrk_flutter_test_batteries上发布了3个helper函数。
它们如下:

  1. disableOverflowError()
  2. tester.getOverflowRenderFlexList()
  3. tester.expectNoOverflow()
    您可以按如下方式使用它们:
    1.首先导入包
flutter pub add dev:hrk_flutter_test_batteries

字符串
1.来源-get_overflow_render_flex_list_test.dart

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

void main() {
  group('getOverflowRenderFlexList()', () {
    const overflowFlexKey = Key('overflow_flex');
    final overflowFlexFinder = find.byKey(overflowFlexKey);

    // Doesn't work. See test/error/disable_overflow_error_test.dart
    // setUp(() {
    //   disableOverflowError();
    // });

    // Doesn't work. See test/error/disable_overflow_error_test.dart
    // setUpAll(() {
    //   disableOverflowError();
    // });

    // setUpAll(() {
    //   configureHrkLogging();
    //   packageLogger.level = Level.ALL;
    // });

    testWidgets('1', (tester) async {
      disableOverflowError();
      tester.view.physicalSize = Size(100, tester.view.physicalSize.height);
      addTearDown(() => tester.view.resetPhysicalSize());
      await tester.pumpWidget(const Row(
        textDirection: TextDirection.ltr,
        children: <Widget>[
          SizedBox(width: 110),
        ],
      ));
      final overflowRenderFlexList = tester.getOverflowRenderFlexList();
      expect(overflowRenderFlexList.length, 1);
    });

    testWidgets('0', (tester) async {
      disableOverflowError();
      tester.view.physicalSize = Size(100, tester.view.physicalSize.height);
      addTearDown(() => tester.view.resetPhysicalSize());
      await tester.pumpWidget(const Row(
        key: overflowFlexKey,
        textDirection: TextDirection.ltr,
        children: <Widget>[
          SizedBox(width: 10),
        ],
      ));
      final overflowRenderFlexList = tester.getOverflowRenderFlexList();
      expect(overflowRenderFlexList.length, 0);
      tester.expectNoOverflow();
    });

    testWidgets('2', (tester) async {
      disableOverflowError();
      tester.view.physicalSize = Size(100, tester.view.physicalSize.height);
      addTearDown(() => tester.view.resetPhysicalSize());
      await tester.pumpWidget(const Column(
        children: [
          Row(
            textDirection: TextDirection.ltr,
            children: <Widget>[
              SizedBox(width: 110),
            ],
          ),
          Row(
            textDirection: TextDirection.ltr,
            children: <Widget>[
              SizedBox(width: 110),
            ],
          ),
        ],
      ));
      final overflowRenderFlexList = tester.getOverflowRenderFlexList();
      expect(overflowRenderFlexList.length, 2);
    });

    testWidgets('of, 2', (tester) async {
      disableOverflowError();
      tester.view.physicalSize = Size(100, tester.view.physicalSize.height);
      addTearDown(() => tester.view.resetPhysicalSize());
      await tester.pumpWidget(const Column(
        children: [
          Row(
            textDirection: TextDirection.ltr,
            children: <Widget>[
              SizedBox(width: 110),
            ],
          ),
          Column(
            key: overflowFlexKey,
            children: [
              Row(
                textDirection: TextDirection.ltr,
                children: <Widget>[
                  SizedBox(width: 110),
                ],
              ),
              Row(
                textDirection: TextDirection.ltr,
                children: <Widget>[
                  SizedBox(width: 110),
                ],
              ),
            ],
          ),
        ],
      ));
      final overflowRenderFlexList = tester.getOverflowRenderFlexList(
        of: overflowFlexFinder,
      );
      expect(overflowRenderFlexList.length, 2);
    });

    testWidgets('of, matchRoot, 1', (tester) async {
      disableOverflowError();
      tester.view.physicalSize = Size(100, tester.view.physicalSize.height);
      addTearDown(() => tester.view.resetPhysicalSize());
      await tester.pumpWidget(const Column(
        children: [
          Row(
            textDirection: TextDirection.ltr,
            children: <Widget>[
              SizedBox(width: 110),
            ],
          ),
          Row(
            key: overflowFlexKey,
            textDirection: TextDirection.ltr,
            children: <Widget>[
              SizedBox(width: 110),
            ],
          ),
        ],
      ));
      final overflowRenderFlexList = tester.getOverflowRenderFlexList(
        of: overflowFlexFinder,
        matchRoot: true,
      );
      expect(overflowRenderFlexList.length, 1);
    });
  });
}

相关问题