NUXT.js環境でPRがあった時にGitHub ActionsでJestのテストを実行してカバレッジをコメントに残したい

NUXT.jsで作っているフロントエンド環境で、GitHubのPull Requestが出された時に自動でJestのテストを実行して、カバレッジをPRのコメントに残す方法です。（全然カバーできてないじゃないか！！）

前提

NUXT.js環境の構築や、Jestの環境は既に構築されており、テストコードはちょっと書かれている前提とします。

step1:package.jsonにテストスクリプトを書く

step2で実際にGitHub Actionsで使うArtiomTr/jest-coverage-report-actionは、カバレッジレポートをjson出力しないとダメなので、scriptの中のtest:coverageが必須です。
今回はNUXT環境で書いているので、他のスクリプトがNUXT用になっていますが、test:coverageは、Vue環境などでも同じなので、コピペで使いまわせると思います。

package.json

"scripts": {
    "dev": "nuxt",
    "generate": "nuxt generate",
    "test": "jest --silent=false --coverage && mv -f coverage dist/coverage",
    "test:coverage": "npm run test -- --coverage --silent --testLocationInResults --ci --json --outputFile=\"report.json\""
  }

step2:GitHub Actionsでカバレッジ出力部分を記述

先ほど書いたnpm scriptをtest-commandで指定している感じになっています。
また、GitHubでルートディレクトリ以外にNode環境を構築している場合は、working-directoryでpackage.jsonがあるパスを指定していないと動作しません。

frontend_pr.yml

name: Node.js CI

# PRがあって、なおかつ特定のディレクトリ配下に修正があった場合のみ動作する
on:
  pull_request:
    branches:
      - main
    paths:
      - 'frontend/xxx/**'

jobs:
  build:
    runs-on: ubuntu-latest
    strategy:
      matrix:
        node-version: [16.13.2]
	
    # 環境のビルド
    steps:
    - uses: actions/checkout@v2
    
    - name: move dir
      run: cd frontend/xxx 
      
    - name: Use Node.js ${{ matrix.node-version }}
      uses: actions/setup-node@v2
      with:
        node-version: ${{ matrix.node-version }}
        cache: 'npm'
        cache-dependency-path: '**/package-lock.json'

    # NPM install実施
    - name: npm install
      run: npm install
      working-directory: ./frontend/xxx

    # Jestを使ったテストの実施とカバレッジレポートをPRに出力
    - name: Show coverage in comments
      uses: ArtiomTr/jest-coverage-report-action@v2.0-rc.6
      with:
        github-token: ${{ secrets.GITHUB_TOKEN }}
        test-command: npm run test:coverage
        working-directory: ./frontend/xxx