4

When running UI tests with flutter driver the assets are not displayed on iPhone simulator. They are displayed when app is run in debug mode from VS Code.

I tried to reproduce it on the example project generated by flutter create -i swift -a kotlin --androidx --org com.example example but without success. I followed exactly the same process of introducing flutter_driver tests in both apps according to this article. Unfortunately, in my app the images are not shown, and in example app they appear just fine. I compared project.pbxproj and pubspec.yaml files and they look fine to me.

For instance my pubspec.yaml:

dev_dependencies:
  flutter_driver:
    sdk: flutter
  test: any
  flutter_test:
    sdk: flutter
  screenshots:

flutter:
  uses-material-design: true

  assets:
    - assets/lang/pl.json
    - assets/images/

Is there anything that can help me with this issue? What can I do to debug the problem?

Logs

Beware, this is a very long log output.

flutter drive --target=test_driver/app.dart --verbose

https://gist.github.com/orestesgaolin/861c4f191773ca152b400d97ced2daeb

Flutter doctor

flutter doctor -v

[✓] Flutter (Channel stable, v1.7.8+hotfix.4, on Mac OS X 10.14.6 18G87, locale pl-PL)
    • Flutter version 1.7.8+hotfix.4 at /Users/dominik/Library/flutter
    • Framework revision 20e59316b8 (6 weeks ago), 2019-07-18 20:04:33 -0700
    • Engine revision fee001c93f
    • Dart version 2.4.0


[✓] Android toolchain - develop for Android devices (Android SDK version 28.0.3)
    • Android SDK at /Users/dominik/Library/Android/sdk
    • Android NDK location not configured (optional; useful for native profiling support)
    • Platform android-28, build-tools 28.0.3
    • ANDROID_SDK_ROOT = /Users/dominik/Library/Android/sdk
    • Java binary at: /Users/dominik/Library/Application Support/JetBrains/Toolbox/apps/AndroidStudio/ch-0/191.5791312/Android
      Studio.app/Contents/jre/jdk/Contents/Home/bin/java
    • Java version OpenJDK Runtime Environment (build 1.8.0_202-release-1483-b49-5587405)
    • All Android licenses accepted.

[✓] Xcode - develop for iOS and macOS (Xcode 10.3)
    • Xcode at /Applications/Xcode.app/Contents/Developer
    • Xcode 10.3, Build version 10G8
    • CocoaPods version 1.7.5

[✓] iOS tools - develop for iOS devices
    • ios-deploy 1.9.4

[✓] Android Studio (version 3.5)
    • Android Studio at /Users/dominik/Library/Application Support/JetBrains/Toolbox/apps/AndroidStudio/ch-0/191.5791312/Android Studio.app/Contents
    • Flutter plugin version 37.1.1
    • Dart plugin version 183.6270
    • Java version OpenJDK Runtime Environment (build 1.8.0_202-release-1483-b49-5587405)

[✓] VS Code (version 1.37.1)
    • VS Code at /Applications/Visual Studio Code.app/Contents
    • Flutter extension version 3.3.0

[✓] Connected device (1 available)
    • iPhone Xs Max • C1A5534A-AE3A-4FB3-95F6-993E351FF2D3 • ios • com.apple.CoreSimulator.SimRuntime.iOS-12-4 (simulator)

• No issues found!
1
  • Thanks for this question, I'm having the same issue with a *.json!
    – patreu22
    Commented Sep 18, 2019 at 15:27

2 Answers 2

9

So the solution was to create separate main_test.dart file that wraps whole app in DefaultAssetBundle like so:

runApp(DefaultAssetBundle(
      bundle: TestAssetBundle(),
      child: App(),
    ));

and TestAssetBundle is like so:

class TestAssetBundle extends CachingAssetBundle {
  @override
  Future<String> loadString(String key, {bool cache = true}) async {
    final ByteData data = await load(key);
    if (data == null) throw FlutterError('Unable to load asset');
    return utf8.decode(data.buffer.asUint8List());
  }

  @override
  Future<ByteData> load(String key) async => rootBundle.load(key);
}

And in app.dart you have to reference correct file:

import 'package:flutter_driver/driver_extension.dart';
import 'package:playoo_league_player/main_test.dart' as app;

void main() {
  // This line enables the extension.
  enableFlutterDriverExtension();

  // Call the `main()` function of the app, or call `runApp` with
  // any widget you are interested in testing.
  app.main();
}

Full explanation can be found here: https://medium.com/@sardox.vl/flutter-test-and-randomly-missing-assets-in-goldens-ea959cdd336a

2
  • Is there any reason you created to create a main_test.dart file? I just used your approach and put it into my regular main.dart file and everything seems to work out quite well?
    – patreu22
    Commented Sep 25, 2019 at 13:26
  • I have dedicated main_test.dart file for UI tests (e.g. it turns on the demo mode which doesn't require network connection and has some mock data). It's almost the same as main.dart but has some special flags enabled. Commented Sep 25, 2019 at 13:35
0
Those Images are not loading because of cache issues .For that we can 
use  
PRE CACHE IMAGES to preload the images

class App extends StatefulWidget {
@override
State<App> createState() => _AppState();
}

class _AppState extends State<App>{ 

late image image1
late image image2


@override
void initState() {
super.initState();
image1 = Image.asset('assets/images/');
image2 = Image.asset('assets/images/');
}
@override
void didChangeDependencies() {

pre cacheImage(image1.image, context);
pre cacheImage(image2.image, context);
super.didChangeDependencies();
}  

@override Widget build(BuildContext context) { return Container }

if it is multiple assets or images you can save this method as class and initialise it from main.dart .

Not the answer you're looking for? Browse other questions tagged or ask your own question.