如何在Flutter空安全环境下为表单验证及maxLength编写单元测试

1. 修复Validator参数类型报错 #

你在TextFormField中遇到的validator赋值报错，原因是TextFormField要求的validator函数入参为可空类型String?，你的FullNameValidator.validate方法入参定义为非空String，类型不匹配。修改后的验证器代码如下：

class FullNameValidator{
  static String? validate(String? value){
    // 同时处理null、空字符串、纯空格的异常输入
    if (value == null || value.trim().isEmpty) {
      return 'Please enter full name';
    }
    return null;
  }
}

2. 修复单元测试用例错误 #

你现有测试用例中期望返回的错误字符串和验证器实际返回的字符串不一致，会导致测试不通过，同时补充覆盖更多输入场景的测试用例：

void main(){
  group('FullNameValidator 单元测试', () {
    test('空字符串输入返回错误提示', (){
      var result = FullNameValidator.validate("");
      expect(result, 'Please enter full name');
    });

    test('null输入返回错误提示', (){
      var result = FullNameValidator.validate(null);
      expect(result, 'Please enter full name');
    });

    test('纯空格输入返回错误提示', (){
      var result = FullNameValidator.validate("   ");
      expect(result, 'Please enter full name');
    });

    test('合法姓名输入验证通过', (){
      var result = FullNameValidator.validate("Li Ming");
      expect(result, isNull);
    });
  });
}

3. maxLength属性测试方案 #

maxLength属于组件层的属性，需要通过Widget测试验证是否生效，测试代码如下：

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

void main() {
  testWidgets('TextFormField maxLength 限制生效测试', (tester) async {
    // 挂载测试组件
    await tester.pumpWidget(MaterialApp(
      home: Scaffold(
        body: TextFormField(
          decoration: InputDecoration(
            labelText: "FullName",
            labelStyle: TextStyle(color: Colors.black),
            border: OutlineInputBorder(
              borderRadius: BorderRadius.circular(10),
            ),
          ),
          maxLength: 30,
          keyboardType: TextInputType.text,
          validator: FullNameValidator.validate,
        ),
      ),
    ));

    // 输入超出长度限制的文本
    const overLengthText = 'abcdefghijklmnopqrstuvwxyzabcd'; // 共31个字符
    await tester.enterText(find.byType(TextFormField), overLengthText);

    // 验证实际仅保留前30个字符，maxLength生效
    final field = tester.widget<TextFormField>(find.byType(TextFormField));
    expect(field.controller?.text.length, 30);
  });
}

内容的提问来源于stack exchange，提问作者user17112368