0

I want to test the CustomTextField which is based on TextFormField. And this component is a part of a package that is hosted on git and is accessed by adding in pubspec.yaml. I get error finding this CustomTextField in test, see the attach error.

enter image description here

Also I have alot of reusable components which i want to test to but how to find these?

CustomTextField


import 'package:TrapezeCrewPackages/utils/colors.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:google_fonts/google_fonts.dart';

class CustomTextField extends StatelessWidget {
  BuildContext? context;
  bool? obscureText;
  bool? readOnly;
  var inputType;
  String? labelText, hinText;
  Color? labelColor;
  Function(String) onChanged;
  TextEditingController? controller;
  bool? hasFocus;
  VoidCallback? onEditingComplete;
  TextInputAction? textInputAction;
  FocusNode? focusNode;
  bool? isValidate;
  TextCapitalization? textCapitalization;

  CustomTextField({
    
    this.context,
    this.obscureText,
    this.readOnly,
    this.inputType,
    this.labelText,
    this.hinText,
    required this.onChanged,
    this.controller,
    this.hasFocus,
    this.onEditingComplete,
    this.textInputAction,
    this.textCapitalization = TextCapitalization.none,
    this.focusNode,
    this.isValidate,
    this.labelColor,
  });

  @override
  Widget build(BuildContext context) {
    return TextFormField(
      enableInteractiveSelection: readOnly,
      onEditingComplete: onEditingComplete,
      textInputAction: textInputAction,
      focusNode: focusNode,
      enabled: hasFocus,
      controller: controller,
      onChanged: onChanged,
      obscureText: obscureText!,
      keyboardType: inputType,
      textCapitalization: textCapitalization!,
      decoration: InputDecoration(
        hintText: hinText,
        labelText: labelText,
        contentPadding:
            const EdgeInsets.symmetric(vertical: 10.0, horizontal: 10.0),
        labelStyle: GoogleFonts.nunito(
          color: labelColor ?? Theme.of(context).primaryColor,
          fontSize: 14,
        ),
        focusedBorder: OutlineInputBorder(
          borderRadius: const BorderRadius.all(
            Radius.circular(10.0),
          ),
          borderSide: BorderSide(
            color: labelColor ?? Theme.of(context).primaryColor,
          ),
        ),
        border: const OutlineInputBorder(
          borderRadius: BorderRadius.all(
            Radius.circular(10.0),
          ),
        ),
      ),
      validator: (value) {
        if (isValidate!) {
          if (value == null || value.isEmpty) {
            return 'Please enter ' + labelText!;
          }
        }
        return null;
      },
    );
  }
}

Usage of CustomTextField in UI

----
  SizedBox(
      width: 400,
      child: Wrap(
        children: [
          const SizedBox(
            height: 30,
          ),
          CustomTextField(
            isValidate: true,
            obscureText: false,
            labelText: "Code",
            hinText: "Enter Code",
            controller: codeController,
            onChanged: (value) {},
          ),
          const SizedBox(
            height: 30,
          ),
        ],
      ),
    ),
-----

My Test Code

void main() {
  IntegrationTestWidgetsFlutterBinding.ensureInitialized();

  group('end-to-end test', () {
    testWidgets('Test Auth', (tester) async {
      //Setup
      app.main();
      await tester.pumpAndSettle();


      var codeTextFieldFinder = find.byType(CustomTextField);

      //do
      tester.tap(codeTextFieldFinder);
      tester.enterText(codeTextFieldFinder, "test");
      tester.pumpAndSettle();

      expect(find.text("Username"), findsOneWidget);
    });
  });
}
Shahroz Javed
  • 97
  • 1
  • 8

0 Answers0