📊

Flutter Test のカバレッジを GitHub Actions, Pull Request で可視化する

2024/09/09に公開

はじめに

Flutter の  Test を実行で、flutter test --coverageとすることで、coverage/lcov.infoが出力され、これを html などへ変化することでにカバレッジの確認ができます。
ただこれを毎回手動で行うことは手間などで、GitHub Actions だけで見やすい状態にしようと思います。

GitHub Actions 設定・カバレッジの可視化

GitHub Actions 設定

.github/workflows/flutter_test.yml

---
name: Flutter test

on:
  pull_request:
  push:
    branches:
      - main

concurrency:
  group: ${{ github.workflow }}-${{ github.ref }}
  cancel-in-progress: true

jobs:
  test:
    runs-on: ubuntu-latest
    timeout-minutes: 30
    permissions:
      contents: read
      issues: write
      pull-requests: write
    steps:
      - name: Checkout
        uses: actions/checkout@v4

      - name: Get Flutter version from .fvmrc
        id: get_flutter_version
        run: |
          flutter_version="$(< .fvmrc jq -r .flutter)"
          echo "version=$flutter_version" >> "$GITHUB_OUTPUT"

      - name: Setup flutter
        uses: subosito/flutter-action@v2
        with:
          channel: "stable"
          flutter-version: ${{ steps.get_flutter_version.outputs.version }}
          cache: true

      - name: flutter pub get
        run: |
          flutter pub get

      - name: flutter test
        run: |
          flutter test --coverage

      - name: Setup LCOV
        uses: hrishikesh-kadam/setup-lcov@v1

      - name: Report code coverage to console
        run: |
          lcov --list coverage/lcov.info --list-full-path --rc lcov_branch_coverage=1

      - name: Generate code coverage html
        run: |
          genhtml coverage/lcov.info --output-directory coverage/html

      - name: Upload coverage to artifact
        uses: actions/upload-artifact@v4
        with:
          name: coverage
          path: coverage

      - name: Report coverage to GitHub
        uses: k1LoW/octocov-action@v1

flutter test --coveragecoverage/lcov.infoを出力

- name: flutter test
  run: |
    flutter test --coverage

lcov, genhtml をセットアップ

- name: Setup LCOV
  uses: hrishikesh-kadam/setup-lcov@v1

カバレッジをコンソールに出力

- name: Report code coverage to console
  run: |
    lcov --list coverage/lcov.info --list-full-path --rc lcov_branch_coverage=1

GitHub Actions のログでカバレッジが確認できる。

console

coverage/lcov.info を HTML に変換し、 artifact にアップロード

- name: Generate code coverage html
  run: |
    genhtml coverage/lcov.info --output-directory coverage/html

- name: Upload coverage to artifact
  uses: actions/upload-artifact@v4
  with:
    name: coverage
    path: coverage

HTML にファイルに変換し、artifact にアップロードしている。
それをダウンロードして index.html をブラウザで開くことでカバレッジが確認できる。

console

Pull Request へカバレッジを表示

- name: Report coverage to GitHub
  uses: k1LoW/octocov-action@v1

.octocov.yml

---
# generated by octocov init
coverage:
  if: true
testExecutionTime:
  if: true
diff:
  datastores:
    - artifact://${GITHUB_REPOSITORY}
comment:
  if: is_pull_request
summary:
  if: true
report:
  if: is_default_branch
  datastores:
    - artifact://${GITHUB_REPOSITORY}

octocov は LCOV に対応しているので、こちらを使用し Pull Request のコメントでカバレッジを表示する。
octocov の設定ファイル.octocov.ymlも用意する。

console

まとめ

上記の設定をすることで、GitHub Actions だけでカバレッジが見やすい状態にできました。
Pull Request へコメントされるので気づきやすく、詳細は GitHub Actions のログや artifact から詳細を確認することができます。

Discussion