flutterflutter-testwidget-test-flutter

Is it possible to screenshot a widgetTest?


I am new to Flutter and I feel like if I could see what the widgetTest is "rendering", as a debug method, things could be a bit easier. I don't fully understand at the moment the mechanics of the widgetTest, but I am wondering if it is possible to capture an actual output render in the middle of the widgetTest.

I am talking about widgetTest not integration test.


Solution

  • I think the package golden_toolkit might be what you are looking for. Instead of using widgetTest you will be using testGoldens. And you can even compare screenshots if you want to ensure non regression in your UI using the provided method screenMatchesGolden.

    Add in your pubspec.yaml:

    #This is a development environment dependency only
    dev-dependencies:
      golden_toolkit: ^0.9.0
    

    Code Sample:

    testGoldens('MyWidget test', (tester) async {
      await tester.pumpWidget(MyWidget());
      await screenMatchesGolden(tester, 'my_widget-example');
    });
    

    Then run the following command to generate or regenerate your reference images:

    flutter test --update-goldens
    

    You can check the documentation about testGoldens here.