Storybook: visual regression testing via Chromatic #242
Workflow file for this run
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| name: Code Check | |
| on: | |
| push: | |
| branches: | |
| - main | |
| pull_request: | |
| env: | |
| NEXT_PUBLIC_SANITY_PROJECT_ID: 5bsv02jj | |
| jobs: | |
| checks: | |
| name: "Check codebase (lint and typecheck)" | |
| runs-on: ubuntu-latest | |
| steps: | |
| - uses: actions/checkout@v2 | |
| - uses: actions/setup-node@v2 | |
| with: | |
| node-version: 18.x | |
| - uses: pnpm/[email protected] | |
| with: | |
| version: 7 | |
| - name: "Get pnpm store directory" | |
| id: pnpm-cache | |
| run: echo "::set-output name=pnpm_cache_dir::$(pnpm store path)" | |
| - name: "Setup pnpm cache" | |
| uses: actions/cache@v3 | |
| with: | |
| path: ${{ steps.pnpm-cache.outputs.pnpm_cache_dir }} | |
| key: ${{ runner.os }}-pnpm-store-${{ hashFiles('./pnpm-lock.yaml') }} | |
| restore-keys: | | |
| ${{ runner.os }}-pnpm-store- | |
| - name: "Install dependencies" | |
| run: pnpm install | |
| - name: "Lint" | |
| run: pnpm run lint | |
| - name: "TypeCheck" | |
| run: pnpm run typecheck | |
| tests: | |
| name: "Unit Tests" | |
| runs-on: ubuntu-latest | |
| steps: | |
| - uses: actions/checkout@v2 | |
| with: | |
| fetch-depth: 0 | |
| - uses: actions/setup-node@v2 | |
| with: | |
| node-version: 18.x | |
| - uses: pnpm/[email protected] | |
| with: | |
| version: 7 | |
| - name: "Get pnpm store directory" | |
| id: pnpm-cache | |
| run: echo "::set-output name=pnpm_cache_dir::$(pnpm store path)" | |
| - name: "Setup pnpm cache" | |
| uses: actions/cache@v3 | |
| with: | |
| path: ${{ steps.pnpm-cache.outputs.pnpm_cache_dir }} | |
| key: ${{ runner.os }}-pnpm-store-${{ hashFiles('./pnpm-lock.yaml') }} | |
| restore-keys: | | |
| ${{ runner.os }}-pnpm-store- | |
| - name: "Install dependencies" | |
| run: pnpm install | |
| - name: "Configure .env" | |
| working-directory: packages/nextjs | |
| run: cp .env.sample .env | |
| - name: "Storybook: Install Extra Dependencies" | |
| working-directory: packages/nextjs | |
| run: pnpm exec playwright install | |
| - name: "Storybook: Build" | |
| working-directory: packages/nextjs | |
| run: pnpm run storybook:build | |
| - name: "Storybook: Chromatic" | |
| uses: chromaui/action@v1 | |
| # Chromatic GitHub Action options | |
| with: | |
| workingDir: packages/nextjs | |
| storybookBuildDir: storybook-static | |
| exitOnceUploaded: true | |
| projectToken: ${{ secrets.CHROMATIC_PROJECT_TOKEN }} | |
| - name: "Storybook: Run Tests" | |
| working-directory: packages/nextjs | |
| run: pnpm run test:storybook:start | |