在Flutter集成测试中提交TextField

Question

我有一个简单的文本字段，当用户提交文本字段中的值时会执行某些操作：

TextField(
        textInputAction: TextInputAction.search,
        onSubmitted: onSearchEmail,
      )

很简单...我正在尝试编写一个集成测试，检查当用户提交文本字段时是否执行了操作-然而我无法弄清如何模拟用户按下键盘上的“搜索”按钮（安卓），或者在iOS中相当于它的是什么...

我天真地尝试了driver.enterText("a@b.c\r\n");，但没有任何效果。

我的集成测试：

test('entering email performs a search', () async {
  driver.tap(find.byValueKey('search-email-search-box'));
  driver.enterText("a@b.c\r\n"); // <- doesn't work
  await driver.waitFor(find.text("some text));
});

我不太希望在屏幕上放置一个需要用户点击的按钮，键盘上的按钮可以正常工作。 编辑：为了澄清 - 文本已经输入到字段中，所以这一部分是有效的，只是提交无法进行。

- OliverDeLange

---

你能演示一下你是如何查找 searchEmailSearchBoxFinder 的吗？ - Darshan

编辑后的内容 - 这是一个简单的“Key”。 - OliverDeLange

你遇到了什么错误？是超时了吗？ - Darshan

不，它只是没有执行搜索。手动输入文本并按下键盘上的搜索按钮时，它会触发TextField上的onSubmitted方法。 - OliverDeLange

我有完全相同的问题。这是我为此问题创建的Github问题链接：https://github.com/flutter/flutter/issues/29450 - CiriousJoker

我能够使用这个链接 https://dev59.com/s1QJ5IYBdhLWcg3wHSHK 提交文本字段。 - Evaldo Bratti

Answer 1

Flutter Driver目前仍缺少触发onFieldSubmitted的功能。 我遵循这里提到的解决方法来触发TextInputAction。这个解决方法适用于integration_test——Flutter中当前推荐的编写集成测试的方法。

让我们以以下方式编写目标测试脚本：

即位于/integration_test/foo_test.dart中。

import 'package:flutter/material.dart';
import 'package:flutter_test/flutter_test.dart';
import 'package:integration_test/integration_test.dart';
import 'package:sample55101120/main.dart' as app;

void main() {
  IntegrationTestWidgetsFlutterBinding.ensureInitialized();

  testWidgets("TextFormField Test", (WidgetTester tester) async {
    // Build the app and trigger a frame.
    await tester.pumpWidget(app.MyApp());

    /// Find TextFormField widget by Key and enter text
    await tester.enterText(find.byKey(Key('search-email-search-box')), 'a@b.c');
    await tester.testTextInput.receiveAction(TextInputAction.done);
    await tester.pump();

    expect(find.text('a@b.c'), findsOneWidget);
  });
}

让test_driver/integration_test.dart为

import 'package:integration_test/integration_test_driver.dart';

Future<void> main() => integrationDriver();

关于我使用的示例应用：

import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

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

  final String title;

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

class _MyHomePageState extends State<MyHomePage> {
  void onSearchEmail(String value){
    debugPrint('onSearchEmail $value');
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            TextFormField(
              key: Key('search-email-search-box'),
              textInputAction: TextInputAction.search,
              onFieldSubmitted: (String value) => onSearchEmail(value),
            ),
          ],
        ),
      ),
    );
  }
}

要运行这个示例：

flutter drive --target=integration_test/foo_test.dart --driver=test_driver/integration_test.dart

- Omatt

---

Omatt，谢谢，非常好用..!! - Rajesh Patil