Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Flutter widget test tap - would not hit test on the specified widget

My widget test is failing after the following warning is outputted:

flutter: Warning: A call to tap() with finder "exactly one widget with text "Tab 2" (ignoring offstage widgets): Text("Tab 2", softWrap: no wrapping except at line break characters, overflow: fade, dependencies: [MediaQuery, DefaultTextStyle])" derived an Offset (Offset(600.0, 23.0)) that would not hit test on the specified widget. flutter: Maybe the widget is actually off-screen, or another widget is obscuring it, or the widget cannot receive pointer events.

The tap is never executed so the next part of the test fails. I put some delays in the test and it appears that the test is attempting to tap the correct widget - it is not offscreen, not obscured, and was able to receive pointer events in the past - not sure why it's currently failing.

Here is a minimal reproducible example:

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: DefaultTabController(
        length: 2,
        child: Scaffold(
          appBar: TabBar(
            labelColor: Color(0xff8391e4),
            tabs: [
              Tab(text: 'Tab 1'),
              Tab(text: 'Tab 2'),
            ],
          ),
          body: TabBarView(
            children: <Widget>[
              Text('Tab 1 Text'),
              Text('Tab 2 Text'),
            ],
          ),
        ),
      ),
    );
  }
}

void main() {
  TestWidgetsFlutterBinding.ensureInitialized();

  testWidgets('My Test', (WidgetTester tester) async {
    await tester.pumpWidget(MyApp());
    await tester.pumpAndSettle();

    // Warning thrown on this tap - tap never executed
    await tester.tap(find.text('Tab 2'));
    await tester.pumpAndSettle();

    // Test fails here
    expect(find.text('Tab 2 Text'), findsOneWidget);
  });
}
like image 945
Lee Mordell Avatar asked Jul 13 '21 16:07

Lee Mordell


People also ask

What is a widget test?

A Widget Test is usually written for one of two things: Checking if interaction with visual elements gives a correct result Let’s go with the second type since the first type can be added in as well. To do this, we usually follow a few steps in the test: Find the visual elements on the screen via some kind of property (such as a key)

Why does setState () not work in a widget test?

setState () does not work as usual in a widget test. While setState () marks the widget to be rebuilt, it does not actually rebuild the tree in a widget test.

What is the testwidgets () function?

The testWidgets () function is the function in which we write our widget tests — and we saw the function broken down in detail. Let’s continue. How Is A Widget Test Written? A Widget Test is usually written for one of two things: Checking if interaction with visual elements gives a correct result

How do I test a new widget in WordPress?

To pump a new widget to test, we use the pumpWidget () method. (Don’t forget the await or else the test will complain beyond belief) This inflates a widget for us to test with. We will go into more detail about the WidgetTester in just a bit, but there’s something else we need to know better first.


1 Answers

Try to set ensureVisible() before tap():

// Warning thrown on this tap - tap never executed
await tester.ensureVisible(find.text('Tab 2'));
await tester.tap(find.text('Tab 2'));
await tester.pumpAndSettle();
like image 63
William Cunha Cardoso Avatar answered Oct 04 '22 00:10

William Cunha Cardoso