【React】Github Actions supabaseUrl is requiredの解決方法について

はじめに

GithubのCIでjestのテストでsupabaseUrl is required.が表示されることについて、こちらの解決方法について記事にします。

次のような表示がActionsに表示されsupabaseの環境変数が読み込めていないようでした。

  supabaseUrl is required.

 export const supabase = createClient<Database>(
        |                                     ^
      6 |   process.env.VITE_SUPABASE_URL!,
      7 |   process.env.VITE_SUPABASE_ANON_KEY!
      8 | );

【修正前のコード】

github-test.yml

name: Jest use test
on: push

jobs:
  test:
    runs-on: ubuntu-latest

    steps:
      - name: Checkout repository
        uses: actions/checkout@v4

      - name: Install dependencies
        run: npm ci

      - name: Run tests with Makefile
        run: make test

解決方法

envで環境変数が読み込まれるようにする

github-test.yml

name: Jest use test
on: push

jobs:
  test:
    runs-on: ubuntu-latest

    env:
      VITE_SUPABASE_URL: ${{ secrets.VITE_SUPABASE_URL }}
      VITE_SUPABASE_ANON_KEY: ${{ secrets.VITE_SUPABASE_ANON_KEY }}

    steps:
      - name: Checkout repository
        uses: actions/checkout@v4

      - name: Install dependencies
        run: npm ci

      - name: Run tests with Makefile
        run: make test

参考

おわりに

過去にも同じ箇所でつまずいた記憶があり、今回記事にしました。