Screenshot tests in Flutter

I love screenshot tests. On top of making sure new code does not break your UI, it helps show that your pull request does what it says it does.

It looks like there are two major alternatives. One is a third-party package called screenshots. It even comes with a Medium post. The second is Flutter's built-in screenshot system. It is described by a GDE (Google Developer Expert), also in a Medium post.

Oddly, Flutter's built-on system doesn't render text or icons properly, so the generated screenshots look odd. Still, I'm hoping they'll eventually fix it, and I went for the built-in system.

Here are the code snippets that matter, taken verbatim from the Medium post:

void main() {
  testWidgets('Golden test', (WidgetTester tester) async {
    await tester.pumpWidget(MyApp());
    await expectLater(find.byType(MyApp),
                      matchesGoldenFile('main.png'));
  });
}

To regenerate the goldens, run:

flutter test --update-goldens

Read more here: https://api.flutter.dev/flutter/flutter_test/matchesGoldenFile.html.