10

In Flutter integration testing, how can we handle ImagePicker? as well as other platform related plugins?

Frank Yan
  • 371
  • 2
  • 8

2 Answers2

16

Finally, I got a solution for this question. this is the code in app.dart:

prepare an image file in assets, for example: images/sample.png.

import 'dart:io';
import 'dart:typed_data';
import 'package:path_provider/path_provider.dart';

import 'package:image_picker_test/main.dart' as app;
import 'package:flutter_driver/driver_extension.dart';
import 'package:flutter/services.dart';
void main() {
  // This line enables the extension.
  enableFlutterDriverExtension();

  const MethodChannel channel =
  MethodChannel('plugins.flutter.io/image_picker');

  channel.setMockMethodCallHandler((MethodCall methodCall) async {
    ByteData data = await rootBundle.load('images/sample.png');
    Uint8List bytes = data.buffer.asUint8List();
    Directory tempDir = await getTemporaryDirectory();
    File file = await File('${tempDir.path}/tmp.tmp', ).writeAsBytes(bytes);
    print(file.path);
    return file.path;
  });


  app.main();
}
Frank Yan
  • 371
  • 2
  • 8
  • 1
    I keep getting an error about `dart:ui` not being found and it's coming from `path_provider`. Were you able to find a way around that? – jdixon04 Jul 07 '20 at 21:31
  • @jdixon04 this code snippet that Frank provided must be in `app.dart` and must not be in some test file, otherwise, such errors that you described occur – crollywood Jul 20 '20 at 09:52
  • 2
    can you please provide a full snippet of code, how to call this function while testing the application? – Mostafa Marji Oct 23 '20 at 20:20
  • 1
    @Frank Can you please attach the driver_test code which you used to test ImagePicker? – Asif Nawaz Dec 30 '20 at 07:06
4

Frank Yan's solution works fine. Basically he is using MethodChannel as an interceptor of request to ImagePicker

MethodChannel('plugins.flutter.io/image_picker')

In this part he defines which plugin has to be mocked

channel.setMockMethodCallHandler((MethodCall methodCall) async {
    ByteData data = await rootBundle.load('images/sample.png');
    Uint8List bytes = data.buffer.asUint8List();
    Directory tempDir = await getTemporaryDirectory();
    File file = await File('${tempDir.path}/tmp.tmp', ).writeAsBytes(bytes);
    print(file.path);
    return file.path;
  });

This function defines what has to be returned from request to image picker plugin. So your program will do these actions each time when user uses image picker. Right here it will just return the image from 'images/sample.png'. In my case I had to put image into assets/image.png in my project root. Anyway you can mock any plugin like that. I had to also mock cropper plugin which is called after image picker ends it's job.

**Note: **mocking is not the best way to go with e2e or as they are called in flutter integration tests. I used it just because there is no workaround (I couldn't find it) at the moment and I am blocked with step of picture upload in my scenario. So be careful with using such approach.

You don't need to call this function anywhere in test. Your app will run with mocked plugin that we define in MethodChannel constuctor MethodChannel('');

Victor Tolkushyn
  • 41
  • 2