Test Flutter apps

App Automate supports testing Flutter apps on Android and iOS devices. We have added support for Appium’s Flutter driver to test Flutter apps using the Appium testing framework on BrowserStack.

The process to test Flutter apps in BrowserStack involves preprocessing your app, uploading it to BrowserStack, adding the automationName capability to your test script along with the app ID, and then running your test script.

In this guide, you’ll learn how to:

1. Preprocess Flutter app for testing
2. Upload your app
3. Set capabilities in test script

Preprocess Flutter app for testing

To preprocess your app for BrowserStack, complete the following steps:

1. Open your Flutter app project.
2. Add the following dev_dependencies in the pubspec.yaml file of your Flutter project:
   pubspec.yaml

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

   The flutter_test and flutter_driver libraries provide functions and APIs respectively to write tests for Flutter apps.

3. Run the following command in the command-line/terminal of your Flutter project to install the dev_dependencies added in the previous step:
   Command-line

    flutter pub get
   

4. Add the following code statement in the main.dart file of your Flutter project to import the flutter_driver_extension library:
   
   main.dart

    import 'package:flutter_driver/driver_extension.dart';
   

5. Add the enableFlutterDriverExtension() method before the runApp method in main.dart file as shown in the following code snippet:
   main.dart

    void main() {
        enableFlutterDriverExtension();
        runApp(const MyApp());
        }
   

   The enableFlutterDriverExtension() method enables the flutter_driver_extension library imported in the previous step. Check out the enableFlutterDriverExtension function section to learn more.

After you complete the preprocessing, run the build command from the following table to build your Flutter app in the debug or profile mode.

Upload your app to BrowserStack

After you complete the mentioned steps, upload the app in App Automate.

Set capabilities in test script

Apart from setting the app capability in the test script, you must add the automationName capability in your test script and set it to flutter as shown in the following sample code snippets:

DesiredCapabilities capabilities = new DesiredCapabilities();
HashMap<String, Object> browserstackOptions = new HashMap<String, Object>();
capabilities.setCapability("bstack:options", browserstackOptions);

// add the app URL received after uploading app to BrowserStack
capabilities.setCapability("app", "<app_url>");

// add the automationName capability
capabilities.setCapability("automationName", "flutter");

var capabilities = {
	// add the app URL received after uploading app to BrowserStack
	"app" : "<app_url>",
	// add the automationName capability
	"automationName" : "flutter",
}

desired_cap = {
	# add the app URL received after uploading app to BrowserStack
	"app" : "<app_url>",
	# add the automationName capability
	"automationName" : "flutter",
}

capabilities = {
    # add the app URL received after uploading app to BrowserStack
    "app" => "<app_url>",
    # add the automationName capability
    "automationName" => "flutter"
}

$caps = array(
	// add the app URL received after uploading app to BrowserStack
	"app" => "<app_url>",
	// add the automationName capability
	"automationName" => "flutter",
)

DesiredCapabilities desiredCapabilities = new DesiredCapabilities();
// add the app URL received after uploading app to BrowserStack
capabilities.setCapability("app", "<app_url>");
// add the automationName capability
desiredCapabilities.setCapability("automationName", "flutter");

var capabilities = {
	// add the app URL received after uploading app to BrowserStack
	'app' : '<app_url>',
	// add the automationName capability
	'automationName': 'flutter'
}

desired_cap = {
	# add the app URL received after uploading app to BrowserStack
	"app" => "<app_url>",
	# add the automationName capability
	"automationName" => "flutter"
}

desired_caps = {
    # add the app URL received after uploading app to BrowserStack
    "app" => "<app_url>",
    # add the automationName capability
    "automationName": "flutter"
}

$caps = array(
	// add the app URL received after uploading app to BrowserStack
	"app" => "<app_url>",
	// add the automationName capability
	"automationName" => "flutter"
)

After you complete the steps, run your test script and visit the App Automate dashboard to view your test execution.

Next steps

After you successfully run your test on App Automate, you can check out the following sections:

• Test mobile apps that access resources hosted in development or testing environments
• Appium capabilities to configure tests in BrowserStack

Need some help?

If you need any help, get in touch with us.