Getting Started with Google Flutter Driver

Flutter, Google's UI toolkit to build native Android, iOS, and web applications from a single codebase uses widgets (written in Dart) to create customizable UIs. 

Testing Flutter Applications with Kobiton

With the addition of Appium's Flutter driver dependency and Kobiton credential settings on a scripted testing file, Flutter apps can be tested on public and private Kobiton devices. 

Flutter App Testing Example

In the example below, with the addition of an Appium testing wrapper, the script in index.js tests the app's counter functionality by increasing the count from zero to two on a Kobiton Android public device. 

To test on an iOS device, follow the same steps, just add the information to process.env.APPIUM_OS === 'ios'

Test setup:

1. On the package.json file, add the Appium Flutter Finder dependency:

   "dependencies": {
   "appium-flutter-finder": "{version}",
   }

   Open the tab, to view a sample package.json file:

   package.json file

   {
     "name": "pwd",
     "version": "1.0.0",
     "description": "Flutter test setup",
     "main": "index.js",
     "dependencies": {
       "appium-flutter-finder": "^0.0.21",
       "babel-core": "^6.26.0",
       "babel-plugin-add-module-exports": "^0.2.1",
       "babel-plugin-transform-decorators-legacy": "^1.3.4",
       "babel-plugin-transform-flow-strip-types": "^6.22.0",
       "babel-plugin-transform-runtime": "^6.23.0",
       "babel-polyfill": "^6.26.0",
       "babel-preset-es2015": "^6.24.1",
       "babel-preset-stage-0": "^6.24.1",
       "babel-register": "^6.26.0",
       "bluebird": "^3.5.1",
       "chai": "^4.1.2",
       "colors": "^1.1.2",
       "jasmine": "^3.2.0",
       "mocha": "^8.1.3",
       "mocha.parallel": "^0.15.5",
       "webdriverio": "^5.11.5"
     },
     "scripts": {
       "start": "node src/index.js",
       "ios": "APPIUM_OS=ios npm start",
       "android": "APPIUM_OS=android npm start",
       "test": "echo \"Error: no test specified\" && exit 1"
     },
     "private": true,
     "license": "MIT",
     "devDependencies": {
       "babel-core": "^6.26.3",
       "babel-loader": "^8.1.0",
       "babel-polyfill": "^6.26.0",
       "babel-preset-es2015": "^6.24.1",
       "babel-preset-stage-0": "^6.24.1"
     },
     "author": ""
   }
   

2. Create a test file (index.js) and edit the following fields:
   • deviceName
   • app
   • hostname

const wdio = require('webdriverio');
const assert = require('assert');
const find = require('appium-flutter-finder');

const username = process.env.KOBITON_USERNAME || '';
const apiKey = process.env.KOBITON_API_KEY || '';
const deviceName = process.env.KOBITON_DEVICE_NAME || '';

const osSpecificOps =
  process.env.APPIUM_OS === 'android'
    ? {
        platformName: 'Android',
        platformVersion: '*',
        deviceName: '{device name}',
        udid: '',
        app: 'https://kobiton-devvn.s3-ap-southeast-1.amazonaws.com/apps-test/demo/app-debug-all.apk',
        fullReset: true,
        noReset: false,
        newCommandTimeout: 360
      }
    : process.env.APPIUM_OS === 'ios'
    ? {
        platformName: 'iOS',
        platformVersion: '*',
        deviceName: '*',
        udid: '',
        noReset: true,
        app: 'https://kobiton-devvn.s3-ap-southeast-1.amazonaws.com/apps-test/demo/Runner.zip',
        newCommandTimeout: 360,
        waitForQuiescence: false,
        autoAcceptAlerts: true
      }
    : {};

    const opts = {
      protocol: 'https',
      hostname: `{Kobiton username}:{Kobiton API key}@api.kobiton.com`,
      port: 443,
      capabilities: {
        ...osSpecificOps,
        sessionName:        'Flutter Automation testing session',
        deviceGroup:        'KOBITON',
        automationName:     'Flutter'
      }
    };
   
(async () => {
  const counterTextFinder = find.byValueKey('counter');
  const buttonFinder = find.byValueKey('increment');

  const driver = await wdio.remote(opts);

  await driver.switchContext('NATIVE_APP');
  await driver.saveScreenshot('./native-screenshot.png');
  await driver.switchContext('FLUTTER');
  await driver.saveScreenshot('./flutter-screenshot.png');

  await driver.elementClick(buttonFinder);
  await driver.touchAction({
    action: 'tap',
    element: { elementId: buttonFinder }
  });
  await driver.saveScreenshot('./flutter-tab.png');

  assert.strictEqual(await driver.getElementText(counterTextFinder), '2');

  driver.deleteSession();
})();

To run the Android Flutter test session, in terminal, run:

APPIUM_OS=android npm start

To run the iOS Flutter test session, in terminal, run:

APPIUM_OS=ios npm start