Flutter Widget Test wait for animation

Question

I have a widget test similar to:

testWidgets('Widget test', (WidgetTester tester) async {
  provideMockedNetworkImages(() async {
    final widget = MyWidget();

    await WidgetTestFunctions.pumpWidgetTest(
      tester,
      widget,
    );

    // ....

    await tester.tap(find.byType(MyWidget));
    await tester.pump(new Duration(milliseconds: 3000));

    // ....

    expect(widget.value, myValue);
  });
});

And the following implementation of the on-tap method of the widget:

_onButtonPressed() async {      
  await animationController.forward();
  setState(() {
    // ...
    // Calls method that changes the widget value.
  });           
}

The problem that I have is that after calling the animationController.forward() method in the test the setState portion is not executed. How should I wait for this method to finish correctly? During the app runtime, this portion of the code is called correctly.

It seems like await tester.pump(new Duration(milliseconds: 3000)); is not working correctly, the animation has a duration of 1500 milliseconds and as you can see the pump duration is double.

Have you tried the pump without the duration? `await tester.tap(find.byType(MyWidget)); await tester.pump(new Duration(milliseconds: 3000));` — SilkeNL, May 21 '21 at 07:28
I have had a similar problem where I couldn't find a widget after an `AnimationController.forward` call. I 'fixed' this by assigning a `ValueKey` to the widget I want to test, and then using that key to verify the info. This is not a solution, though, but more of a hack. — hman_codes, Aug 24 '21 at 17:41
Hello @notarealgreal you still haven't found any solution for this? — Valentin Vignal, Nov 11 '21 at 14:32

score 2 · Answer 1 · answered Nov 22 '21 at 14:48

2

Instead of await tester.pump(new Duration(milliseconds: 3000)); try await tester.pumpAndSettle();

this type of pump wait for the animations end and then pump the frames.

answered Nov 22 '21 at 14:48

João Victor

31
1
3

score 1 · Answer 2 · answered Nov 11 '21 at 15:50

I had the same issue, and here is what was happening.

When you do

await animationController.forward();

You are not awaiting for a simple Future<void> to complete but a TickerFuture (extends Future<void>).

For some reason, in my tests, some of the TickerFutures from the animationController.forward() weere cancelled.

In the doc of the TickerProvider, it says:

If the Ticker is disposed without being stopped, or if it is stopped with canceled set to true, then this Future will never complete.

This class works like a normal Future, but has an additional property, orCancel, which returns a derivative Future that completes with an error if the Ticker that returned the TickerFuture was stopped with canceled set to true, or if it was disposed without being stopped.

To run a callback when either this future resolves or when the ticker is canceled, use whenCompleteOrCancel.

Now, the issue with whenCompleteOrCancel is that it returns void (and not Future<void> so we cannot wait for it.

So here is what I have done (inspired by the implementation of whenCompleteOrCancel):

Future<void> thunk(dynamic value) {
  return;
}
final TickerFuture ticker = animationController.forward();
await ticker.onCancel.then(thunk, onError: thunk); // <- This resolves even if the ticker is canceled and the tests are not stuck anymore.

Flutter Widget Test wait for animation

2 Answers2