fix: Unable to find text in some TextFields

[danielroek]

Description

Not really sure if I'm doing something wrong here, but I'm running into an issue where in one field I am able to use expectVisible and pressOn followed by writeText. But in a screen a bit later the expectVisible fails.

Steps To Reproduce My test yaml:

description: Sign up using email and password.
---
- log: 'Running sign up flow'
- pressOn: 'Sign up'
- expectVisible: 'Email'
- pressOn: 'Email'
- writeText: 'test57@trackbee.io'
- pressOn: 'Password'
- writeText: 'test_password'
- pressOn: 'Repeat Password'
- writeText: 'test_password'
- pressOn: 'New account'
- pressOn: 'Accept Terms and Conditions'
- expectVisible: 'Next'
- expectVisible: 'Back'
- expectVisible: 'How do you want us to call you?'

Expected Behavior

Unable the field containing How do you want us to call you?

          FormBuilderTextField(
            key: const Key('name'),
            name: 'name',
            initialValue: state.name,
            onChanged: context.read<OnboardingCubit>().onChangeName,
            keyboardType: TextInputType.name,
            autofillHints: const <String>[AutofillHints.name],
            validator: FormBuilderValidators.required(
                errorText: AppLocalizations.of(context)!.requiredField),
            decoration: const InputDecoration(
              prefixIcon: Icon(Icons.account_circle_outlined),
              labelText: 'How do you want us to call you?',
              hintText: 'John',
            ),
          ),

It is able to find the following three fields:

    FormBuilderTextField(
      key: key,
      name: 'email',
      keyboardType: TextInputType.emailAddress,
      autofillHints: const <String>[AutofillHints.email],
      decoration: const InputDecoration(
        labelText: 'Email',
        hintText: 'name@company.com',
      ),
      validator: FormBuilderValidators.compose(<String? Function(String?)>[
        FormBuilderValidators.required(
            errorText: AppLocalizations.of(context)!.requiredField),
        FormBuilderValidators.email(
            errorText: AppLocalizations.of(context)!.invalidEmailError),
      ]),
    );

Screenshots

If applicable, add screenshots to help explain your problem.

Additional Context

I've tried putting waits between the steps, as these are inside an AnimatedSwitcher. But that did not help. I am able to find the next and back button on the page, but not the text in the fields.

Hoping anyone has any advice. Happy to help if some extra information is needed

[wolfenrain]

Thanks for opening this issue! Are you able to find the text fields if you have an initial default value assigned to them?

Fluttium should technically be able to find them using the provided label, as shown here. So I am curious if something is in the way of the semantics tree lookup (like the AnimatedSwitcher maybe?)

[PiotrFLEURY]

Hi everyone

I faced the same issue trying to make a first test using Fluttium on a Ubuntu Desktop Flutter app. Some texts were not found at the begining. After few hours digging in the code of Fluttium, Flutter and a lot of documentation reading, I made few widget tests and integration tests to reproduce the issue.

The problem does not seems to be linked to Fluttium or Flutter.

If can be reproduced with:

• Fluttium test
• widget test
• integration test

In fact, this is related to the semantics.

I found a correlation between tests not finding text in widget tree and invisible semantics labels when running the app with showSemanticsDebugger: true in the material app.

The real problem to me is ability to find the good way to add semantics to each widget.

• IconButton uses tooltip
• TextField seems to use helperText which is confusing with label and labelText properties
• Text uses semanticsLabel
• Wrap a widget with Semantics widget does not work everytime

The only way to be sure is to try to run your app with the semantics debugger on

MaterialApp(
      showSemanticsDebugger: true,
//...
home: const MyHomePage(),
);

Once the expected view appears in semantics mode with the label to find in your test, then Fluttium will find it.

Hope it can help @danielroek @wolfenrain

[wolfenrain]

@PiotrFLEURY thanks for this information! When you mention "invisible semantics labels" do you mean that the SemanticNode is .isInvisible or has the SemantisFlag.isHidden?

Because Fluttium does have some logic to skip those to prevent false positive off nodes that are off-screen.

[PiotrFLEURY]

Sometimes semantics labels can be hidden by another widget or missplaced.

For instance, I'm investigating about a potential Flutter bug where semantics labels are not located at the same place thant their widget.

Small example:

I've created this dummy project trying few things about Flutter Desktop.

https://github.com/PiotrFLEURY/bard_textedit

I made a simple file picker like this:

I tried to make small tests using Fluttium and some text were not found by Fluttium. (That's why I'm here).

When I run the same interface using showSemanticsDebugger: true I got this result:

• The Enter file name semantics label should also have a my_file.txt label but does not.
• A Extension dropdown semantics label should also be visible between Enter a file name and Select file button
• A File list semantics label should be visible to identidy the ListView

Now see what's happening if I just make ListView invisible:

• 3 missing semantics were hidden by the ListView 🤷️
• Those 3 elements seems to be centered in the screen (or in the containning widget) 🤷️
• The File list is identified as a TextField 🤷️

In this example, Fluttium does not find the 3 weird semantics elements which is ok I guess ?