Continuous Integration with Flutter using Gitlab

F4cff86f26a0d63a0f5d20494e955c04?s=47 Pascal Welsch
February 12, 2019

Continuous Integration with Flutter using Gitlab

mobile.cologne Februrary 12th
https://mobile.cologne/2019-02-12-vortragsabend

Pascal (@passsy) presents how to build a Continuous Integration Pipeline for Flutter.

flutter build
flutter test
flutter analyze

He creates a sample project and builds it on gitlab CI, for Android and iOS.

F4cff86f26a0d63a0f5d20494e955c04?s=128

Pascal Welsch

February 12, 2019
Tweet

Transcript

  1. Continuous Integration

  2. grandcentrix.net @grandcentrix We are hiring! +Pascal Welsch @passsy

  3. Assumption: Flutter apps have a single codebase

  4. Reality: Flutter apps have one codebase and n platform wrappers

    (with code)
  5. Flutter app code Flutter Codebases iOS embedder Android embedder Fuchsia

    embedder Windows embedder
  6. Flutter app code Perfect Flutter Codebase iOS embedder Android embedder

    Fuchsia embedder Windows embedder
  7. Flutter app code Real Flutter Codebase iOS embedder Android embedder

    Fuchsia embedder Windows embedder Plugin Plugin Plugin Plugin Plugin Plugin Plugin Plugin Plugin Plugin Plugin Plugin
  8. Flutter Core Assets Platform code Plugins Core Embedder Dart Code

    Your app Flutter Plugins
  9. Embedder App App code (Dart) Flutter Core Assets Plugins Platform

    code Flutter SDK Embedder SDK Responsibility
  10. CI steps - Build app - Run unit tests -

    Run UI tests - Run static analysis - Code coverage - Lint - Danger
  11. Difficulties of CI in mobile development - Android Emulator required

    for Instrumentation Tests - iOS Simulator required for iOS UI Tests - iOS apps can’t be build on linux Jenkins, one of the few solutions offering, runners on OSX
  12. Flutter CI - Tests (even UI tests) run headless on

    every OS - Building/Testing embedder apps requires embedder SDK tools - For iOS/Mac apps you need macOS - For Android you need the Android SDK - For Windows you need new hardware every year
  13. Which CI is good for Flutter? - Travis CI -

    CircleCi - Jenkins - GitLab CI - GitHub Actions - you name it...
  14. Which CI? Any CI, but I’ll focus on GitLab CI

    for today Let’s assume the following is given: $ echo “Let’s build” $ git clone git@github.com:passsy/flutter-app.git
  15. $ flutter build $ flutter test $ flutter analyze

  16. $ flutter build ❌ command not found: flutter

  17. Let’s install flutter git clone git@github.com:flutter/flutter.git export PATH="$PATH:`pwd`/flutter/bin"

  18. Let’s install flutter

  19. What flutter doesn’t require - Dart - Flutter engine -

    Java - Android SDK * - Xcode toolchain * * Optional
  20. Finally flutter is installed

  21. The flutter update problem

  22. Make your CI builds reproducible! Never use latest Let all

    developers and CI use the same flutter version Make flutter part of your project
  23. Flutter wrapper github.com/passsy/flutter_wrapper - single executable flutterw which downloads the

    correct version before executing flutter - Version is part of your repository (submodule)
  24. Live Demo

  25. $ ./flutterw build

  26. $ flutter build -h Available subcommands: aot Build an ahead-of-time

    compiled snapshot of your app's Dart code. apk Build an Android APK file from your app. bundle Build the Flutter assets directory from your app. ios Build an iOS application bundle (Mac OS X host only).
  27. Use a bash script to prevent vendor lock-in

  28. Build our build_android.sh #!/bin/bash set -e flutter build apk

  29. Execute it on GitlabCI image: "passsy/flutterw:0.1.0" before_script: - ./flutterw doctor

    --verbose pr: script: - ./ci/build_flutter.sh
  30. Execute it on Jenkins pipeline { agent { docker "cirrusci/flutter"}

    stages { stage(“pr”) { sh ‘ci/pr.sh’ } } }
  31. Docker! - Use Docker to build your flutter app -

    Except for iOS builds - Allows building it locally (gitlab-runner) - Works on almost every modern CI
  32. Improve our build_flutter.sh #!/bin/bash set -e flutter format lib flutter

    analyze flutter test --coverage flutter build android
  33. Improve build script ./flutterw test --coverage # parse and show

    code coverage (via lcov) genhtml -o coverage/html coverage/lcov.info
  34. Improve build script # format with line width 120 ./.flutter/bin/cache/dart-sdk/bin/dartfmt

    --set-exit-if-changed -w -l 120 lib test
  35. Build iOS on macOS - Use gitlab-runner and make your

    MacBook a runner -
  36. Build android - Create build_android.sh - Works in docker container

  37. Create releases - Use existing tools of the embedder platform

    - -
  38. Create releases (android) - release_android.sh - Use gradle plugin to

    publish to play store github.com/Triple-T/gradle-play-publisher - ./gradlew publishApk
  39. Create releases (ios) - Use what Sebastian suggested in his

    talk - Fastlane - xcbuild is your friend
  40. Codemagic - It works - Runs tests, builds apps -

    Easy way to get running for iOS without a Mac - I don’t trust them
  41. Thanks

  42. Flutter Workshop Hot Reload Hackathon Tuesday, March 12, 2019 Cologne,

    grandcentrix https://flutter.school