在 Flutter 小部件测试中，如何验证字段验证错误消息？

Posted 2023-02-23

【中文标题】在 Flutter 小部件测试中，如何验证字段验证错误消息？

【英文标题】：In a Flutter widget test, how can I verify a field validation error message?

【发布时间】：2020-02-13 14:10:21

【问题描述】：

我正在为 Flutter 表单编写一个小部件测试，并想验证在表单提交后，验证是否失败，并且其中一个字段的 errorText 显示并符合预期。

该字段的代码如下所示：

Form(key: _formKey, ...
  TextFormField(validator: validateEmail, ...)

对于测试断言，我尝试过类似

expect(find.text('Please fill in your email.'), findsOneWidget);

没有成功。希望有人能指出我正确的方向。

【参考方案1】：

我重新创建了您的案例，并且能够验证内联错误消息。这个想法是在我们可以测试断言之前添加 1 秒的延迟。这是我所做的：

main.dart 代码显示textformfield 并在点击Send 按钮时验证电子邮件：

TextFormField(
            decoration: new InputDecoration(hintText: 'Email ID'),
            keyboardType: TextInputType.emailAddress,
            maxLength: 32,
            validator: validateEmail,
            onSaved: (String val) 
              email = val;
            ),

validateEmail方法sn-p：

if (value.length == 0) 
      return "Email is Required";
     else if(!regExp.hasMatch(value))
      return "Invalid Email";
    else 
      return null;
    

小部件测试以验证电子邮件字段的内联错误消息：

void main() 
  testWidgets('validate email inline error message',
          (WidgetTester tester) async 

        await tester.pumpWidget(MyApp());

        final buttonFinder = find.text('Send');
        final emailErrorFinder = find.text('Email is Required');

        await tester.tap(buttonFinder);
        print('button tapped');
        await tester.pump(const Duration(milliseconds: 100)); // add delay
            expect(emailErrorFinder, findsOneWidget);
        print('validated email inline error');
      );

测试结果：

希望这能回答你的问题。

【讨论】：

感谢您的观看，不幸的是，这对我来说并没有起到作用。但是，我发现如果在我按下按钮之前，我做了一个tester.pumpAndSettle()，它就开始通过了。有点头疼！

我遇到了这个问题，无法弄清楚。我想知道它是如何为你们所有人工作的，而不是在我的设置上。希望不要手动测试，如果有人有很棒的想法。我用于提升按钮的点击是否不会以某种方式触发验证方法？

@MattR 这告诉测试小部件隐含所有更改并运行所有动画，例如验证错误。