Merge pull request #60 from eBay/iterate_on_image_loading

Iterate on asset priming

Author: coreysprague

packages/golden_toolkit/CHANGELOG.md

@@ -1,5 +1,9 @@
 # Changelog
 
+## 0.5.1
+
+Improved the reliability of the default behavior for ```tester.waitForAssets()``` to handle additional cases.
+
 ## 0.5.0
 
 ### More intelligent behavior for loading assets

packages/golden_toolkit/lib/src/testing_tools.dart

@@ -281,8 +281,8 @@ Future<void> legacyPrimeAssets(WidgetTester tester) async {
 /// See also:
 /// * [GoldenToolkitConfiguration.primeAssets] to configure a global asset prime function.
 Future<void> defaultPrimeAssets(WidgetTester tester) async {
-  final imageElements = find.byType(Image).evaluate();
-  final containerElements = find.byType(Container).evaluate();
+  final imageElements = find.byType(Image, skipOffstage: false).evaluate();
+  final containerElements = find.byType(DecoratedBox, skipOffstage: false).evaluate();
   await tester.runAsync(() async {
     for (final imageElement in imageElements) {
       final widget = imageElement.widget;
@@ -291,7 +291,7 @@ Future<void> defaultPrimeAssets(WidgetTester tester) async {
       }
     }
     for (final container in containerElements) {
-      final Container widget = container.widget;
+      final DecoratedBox widget = container.widget;
       final decoration = widget.decoration;
       if (decoration is BoxDecoration) {
         if (decoration.image != null) {

packages/golden_toolkit/pubspec.yaml

@@ -1,6 +1,6 @@
 name: golden_toolkit
 description: Common patterns for screenshot-based widget testing using Goldens.
-version: 0.5.0
+version: 0.5.1
 homepage: https://github.com/eBay/flutter_glove_box/
 repository: https://github.com/eBay/flutter_glove_box/tree/master/packages/golden_toolkit
 issue_tracker: https://github.com/eBay/flutter_glove_box/issues

packages/golden_toolkit/test/image_loading/default/default_asset_loading_test.dart

@@ -1,3 +1,4 @@
+import 'package:flutter/material.dart';
 import 'package:flutter_test/flutter_test.dart';
 import 'package:golden_toolkit/golden_toolkit.dart';
 import 'package:golden_toolkit/src/configuration.dart';
@@ -55,6 +56,27 @@ void main() {
           config: defaultConfiguration,
         );
       });
+
+      testWidgets('should load assets that have not come into view yet', (tester) async {
+        await GoldenToolkit.runWithConfiguration(
+          () async {
+            await tester.pumpWidgetBuilder(
+              const ListOfItemsWithOneImage(
+                itemSize: Size(100, 100),
+                cacheExtent: 1000,
+                indexThatContainsImage: 10,
+              ),
+              surfaceSize: const Size(300, 100),
+            );
+            await tester.waitForAssets();
+            await tester.drag(find.byType(Scrollable), const Offset(0, -1000));
+            await tester.pump();
+            await expectLater(
+                find.byType(ListOfItemsWithOneImage).first, matchesGoldenFile('goldens/list_of_images_will_show.png'));
+          },
+          config: defaultConfiguration,
+        );
+      });
     },
   );
 }

packages/golden_toolkit/test/image_loading/default/goldens/list_of_images_will_show.png

@@ -18,10 +18,8 @@ class BoxDecorationWithImage extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
-    return Container(
-      width: 800,
-      height: 600,
-      decoration: const BoxDecoration(
+    return const DecoratedBox(
+      decoration: BoxDecoration(
         image: DecorationImage(
           image: AssetImage('images/earth_image.jpg', package: 'sample_dependency'),
         ),
@@ -35,3 +33,38 @@ GoldenToolkitConfiguration get legacyConfiguration =>
 
 GoldenToolkitConfiguration get defaultConfiguration =>
     GoldenToolkit.configuration.copyWith(primeAssets: defaultPrimeAssets);
+
+@immutable
+class ListOfItemsWithOneImage extends StatelessWidget {
+  const ListOfItemsWithOneImage({
+    @required this.itemSize,
+    @required this.indexThatContainsImage,
+    @required this.cacheExtent,
+  });
+
+  final Size itemSize;
+  final int indexThatContainsImage;
+  final double cacheExtent;
+
+  @override
+  Widget build(BuildContext context) {
+    return Container(
+      color: Colors.grey,
+      child: ListView.builder(
+        itemBuilder: (context, index) => Center(
+          child: Row(
+            children: [
+              Container(
+                width: itemSize.width,
+                height: itemSize.height,
+                color: Colors.lightBlue,
+                child: (index == indexThatContainsImage) ? const ImageWidget() : null,
+              ),
+            ],
+          ),
+        ),
+        cacheExtent: cacheExtent,
+      ),
+    );
+  }
+}