Home Automate your Flutter PR review using Danger and Github actions
Post
Cancel

Automate your Flutter PR review using Danger and Github actions

1
2
3
4
PLEASE ADD FIX THE WARNINGS IN YOUR CODE
PLEASE ADD UNIT TESTS
PLEASE UPDATE THE CHANGELOG
...

How many times did you see this kind of comments on a PR? I’m sure a lot! Did you thought before that there should be an easier way to do that? what if we can automate this kind of reviews?

Danger

Danger run during CI process and give teams the chance to automate common code review chores. Whenever someone create a PR, a checks will run and then Danger will comment what’s wrong in the PR.

Danger available in different languages, js, ruby, swift, and peril. In this tutorial we will use Danger JS, It doesn’t matter which language your project written in, danger has nothing to do with that, so even if you use Dart still your danger file can be in JS.

Create the danger file

In you project root directory create a new file dangerfile.ts this file is the file where we will add the PR checks.

At the top of the file, add the following imports:

1
2
3
import { message, warn, fail, danger } from "danger"
const child_process = require('child_process')

Now, we will add the pr checks. I’ll add and explain them one by one but you will find the full file with all the checks here.

Check if the CHANGELOG file changed

To check if the CHANGELOG.md file changed, we check if any of our added or modified files has a CHANGELOG.md text in the path.

1
2
3
4
5
6
7
8
function checkIsChangelogUpdated() {
  var changelogChangeRegex = /.*CHANGELOG.md/
  const changedFiles = [...danger.git.created_files, ...danger.git.modified_files]
  const isChangelogUpdated = changedFiles.some((filePath) => changelogChangeRegex.test(filePath))
  if (!isChangelogUpdated) {
    warn('Please update the `CHANGELOG.md` file.')
  }
}

Check is documentation updated

To check if the documentation updated we can check if any of our added or modified files has a docs text in the path.

1
2
3
4
5
6
7
8
9
10
11
12
function checkIsDocumentationUpdated() {
  const changedFiles = [...danger.git.created_files, ...danger.git.modified_files]
  const isDocumentationUpdated = changedFiles.some((filePath) =>
    filePath.match(/docs\/.*/)
  )

  const isLibFilesUpdated = changedFiles.some((filePath) => libFileChangeRegex.test(filePath))

  if (!isDocumentationUpdated && isLibFilesUpdated) {
    warn('Please update the documentation in the `docs/` folder.')
  }
}

Check is the body of the PR is empty

To check if the body of our PR is empty we can check the body property.

1
2
3
4
5
function checkIsBodyEmpty() {
  if (danger.github.pr.body == "") {
    warn("Please add a description to your PR.")
  }
}

Check the PR Size

To check the PR size, we can check the deleted and added files, if they cross a threshold then the check will fail.

1
2
3
4
5
6
7
function checkPRSize() {
  const maxLinesOfCode = 1000
  const linesOfCode = danger.github.pr.additions + danger.github.pr.deletions
  if (linesOfCode > maxLinesOfCode) {
    fail(`This pull request adds too many lines of code. It adds ${linesOfCode} lines, but the maximum allowed is ${maxLinesOfCode} lines.`)
  }
}

Run flutter analyzer

To run flutter analyzer we will execute the simple flutter analyzer command.

1
2
3
4
5
6
7
function runFlutterAnalyzer() {
  try {
    child_process.execSync('flutter analyze')
  } catch (error) {
    fail(`Flutter analyzer failed. Please fix the issues reported by the analyzer. ${error}`)
  }
}

After that, at the end of the file, we should call all the functions.

1
2
3
4
5
checkIsChangelogUpdated()
checkIsDocumentationUpdated()
checkIsBodyEmpty()
checkPRSize()
runFlutterAnalyzer()

Find the file with all the checks here.

Github actions

Add the workflow file in your codebase

There are a multiple way to achive what I’ll do now, and you can split the step I have to multiple steps, or you can create a container with flutter and use it. So feel free to improve or change the workflow as you wish.

First let’s add the workflow file to our code, you must add the file in .github/workflows directory.

Create a file with the name of danger.yaml then add the following code in it:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
name: "PR Checks"
on: [pull_request]

jobs:
  build:
    name: PR Checks
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v1
      - name: Run Danger
        run: |
          cd $HOME
          wget -O flutter.tar.xz https://storage.googleapis.com/flutter_infra_release/releases/stable/linux/flutter_linux_3.7.3-stable.tar.xz
          tar xf flutter.tar.xz
          export PATH="${PATH}:$HOME/flutter/bin"
          cd $GITHUB_WORKSPACE
          flutter pub get
          npm install --global yarn
          yarn add danger --dev
          yarn danger ci
        env:
          GITHUB_TOKEN: $

In this workflow, we are doing multiple steps, We are:
1- Downloading flutter SDK.
2- Unzip the flutter SDK.
3- Adding the flutter to the system PATH.
4- Runing flutter pub get.
5- Installing yarn.
6- Installing danger.
7- Runing danger.
8- Adding the DANGER_GITHUB_API_TOKEN.

Let’s try it!

Now try to create a new Pull request with empty body and wait for some time…

After some time you should see a new commet on your PR if you have any issue with your PR!

-❤️~.

If you have any questions you can send me a message on Twitter or facebook. Also you can check my Github page, my iOS Apps, or Android Apps 1 / Android Apps 2.

This post is licensed under CC BY 4.0 by the author.