A screenshot image with overlaid status bar placed in a device frame.
For introduction to Screenshots see https://medium.com/@nocnoc/automated-screenshots-for-flutter-f78be70cd5fd.
Screenshots is a standalone command line utility and package for capturing screenshot images for Flutter.
Screenshots will start the required android emulators and iOS simulators (or find attached devices), run your screen capture tests on each emulator/simulator (or device), process the images, and drop them off to Fastlane for delivery to both stores.
It is inspired by three tools from Fastlane:
Since all three of these Fastlane tools do not work with Flutter, Screenshots combines key features of these Fastlane tools into one tool.
Since Flutter integration testing is designed to work transparently across iOS and Android, capturing images using Screenshots is easy.
Additional automation features:
$ brew update && brew install imagemagick $ pub global activate screenshots
pub is not found, add to PATH using:
export PATH="$PATH:<path to flutter installation directory>/bin/cache/dart-sdk/bin"
Or, if using a config file other than the default 'screenshots.yaml':
$ screenshots -c <path to config file>
$ screenshots -h usage: screenshots [-h] [-c <config file>] [-m <normal|recording|comparison|archive>] sample usage: screenshots -c, --config=<screenshots.yaml> Path to config file. (defaults to "screenshots.yaml") -m, --mode=<normal|recording|comparison|archive> If mode is recording, screenshots will be saved for later comparison. If mode is archive, screenshots will be archived and cannot be uploaded via fastlane. [normal (default), recording, comparison, archive] -h, --help Display this help information.
A special function is provided in the Screenshots package that is called by the test each time you want to capture a screenshot. Screenshots will then process the images appropriately during a Screenshots run.
To capture screenshots in your tests:
screenshots: ^<current version>
final configInfo = Config().configInfo;
await screenshot(driver, configInfo, 'myscreenshot1');
Note: make sure your screenshot names are unique across all your tests.
Note: to turn off the debug banner on your screens, in your integration test's main(), call:
WidgetsApp.debugAllowBannerOverride = false; // remove debug banner for screenshots
In some cases it is useful to know what device, device type, screen size and locale you are currently testing with. To obtain this information in your test use:
final screenshotsEnv = config.screenshotsEnv;
See https://github.com/flutter/flutter/issues/31609 for related
flutter driver issue.
Screenshots uses a configuration file to configure a run.
The default config filename is
# A list of screen capture tests tests: - test_driver/main1.dart - test_driver/main2.dart # Note: flutter driver expects a pair of files for testing # For example: # main1.dart is the test app (that calls your app) # main1_test.dart is the matching test that flutter driver # expects to find. # Interim location of screenshots from tests staging: /tmp/screenshots # A list of locales supported by the app locales: - de-DE - en-US # A map of devices to emulate devices: ios: iPhone XS Max: frame: false iPad Pro (12.9-inch) (3rd generation): android: Nexus 6P: # Frame screenshots frame: true
Individual devices can be configured in
screenshots.yaml by specifying per device parameters.
|frame||true/false||optional||Controls whether screenshots generated on the device should be placed in a frame. Overrides the global frame setting (see example |
Note: images generated for those devices where framing is disabled are probably not suitable for upload, but can be used for local review.
Screenshots can be used to monitor any unexpected changes to the UI by comparing the new screenshots to previously recorded screenshots. Any differences will be highlighted in a 'diff' image for review.
To use this feature:
screenshots -m recording
Screenshots will compare the new screenshots with the recorded screenshots and generate a 'diff' image for each screenshot that does not compare. The diff image highlights the differences in red.
screenshots -m comparison
To generate screenshots for local use, such as generating reports of changes to UI over time, etc... use 'archive' mode.
To enable this mode:
$ screenshots -m archive
Since Screenshots is intended to be used with Fastlane, after Screenshots completes, the images can be found in your project at:
Tip: One way to use Screenshots with Fastlane is to call Screenshots before calling Fastlane (or optionally call from Fastlane). Fastlane (for either iOS or Android) will then find the images in the appropriate place.
(For a live demo of using Fastlane to upload screenshot images to both store consoles, see demo of Fledge at https://github.com/mmcc007/fledge#demo)
iOS images generated by Screenshots can also be further processed using FrameIt's text and background feature.
To change the devices to run your tests on, just change the list of devices in screenshots.yaml.
Make sure each device you select has a supported screen and a
corresponding attached device or installed emulator/simulator. To bypass
the supported screen requirement use
frame: false for each related device in your
For each selected device:
Screenshots will check your configuration before running for any errors and provide a guide on how to resolve.
To upgrade, simply re-issue the install command
$ pub global activate screenshots
Note: the Screenshots version should be the same for both the command line and in your
To check the version of Screenshots currently installed:
pub global list
To view the images generated by Screenshots during run on travis see:
Your feedback is welcome and is used to guide where development effort is focused. So feel free to create as many issues and pull requests as you want. You should expect a timely and considered response.
The default counter app with internationalization support.
This is an app that demonstrates
First confirm devices are attached or emulators/simulators are installed for the following devices:
# A list of devices to run tests on devices: ios: iPhone XS Max: iPad Pro (12.9-inch) (2nd generation): frame: false android: Nexus 6P:
Then run with:
The generated screenshots can be found in:
screenshots running with this example app on travis see:
To download the images generated by
screenshots during run on travis see:
You can install the package from the command line:
$ pub global activate screenshots
The package has the following executables:
Add this to your package's pubspec.yaml file:
dependencies: screenshots: ^1.2.0
You can install packages from the command line:
$ pub get
$ flutter pub get
Alternatively, your editor might support
pub get or
flutter pub get.
Check the docs for your editor to learn more.
Now in your Dart code, you can use:
Describes how popular the package is relative to other packages. [more]
Code health derived from static analysis. [more]
Reflects how tidy and up-to-date the package is. [more]
Weighted score of the above. [more]
We analyzed this package on Jul 17, 2019, and provided a score, details, and suggestions below. Analysis was completed with status completed using:
Detected platforms: Flutter, other
lib/src/archive.dart. (-0.50 points)
lib/src/archive.dart reported 1 hint:
line 8 col 9: The value of the field '_stagingTestDir' isn't used.
dartfmt to format
dartfmt to format
|Dart SDK||>=2.2.2 <3.0.0|