Skip to content

Storybook: visual regression testing via Chromatic #242

Storybook: visual regression testing via Chromatic

Storybook: visual regression testing via Chromatic #242

Workflow file for this run

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