Skip to content

feat(theme): add CSS and json for v4 #457

feat(theme): add CSS and json for v4

feat(theme): add CSS and json for v4 #457

name: test-storybook
on:
pull_request:
types: [labeled, unlabeled, opened, synchronize, reopened]
branches:
- main
- v4.0.0
concurrency:
group: ${{ github.ref }}
cancel-in-progress: true
jobs:
prepare-base-branch:
name: Prepare base branch image snapshots
timeout-minutes: 20
runs-on: ubuntu-latest
steps:
- name: Checkout base branch
uses: actions/checkout@v4
with:
ref: ${{ github.event.pull_request.base.ref }}
fetch-depth: 0
- name: Check commit hash
id: commit-hash
run: echo "hash=$(git rev-parse HEAD)" >> $GITHUB_OUTPUT
- name: Restore image snapshot from cache
uses: actions/cache@v4
id: cache-image-snapshots
with:
path: __image_snapshots__
key: image-snapshots-${{ steps.commit-hash.outputs.hash }}
- uses: actions/setup-node@v4
if: steps.cache-image-snapshots.outputs.cache-hit != 'true'
with:
node-version-file: '.node-version'
cache: yarn
- name: Install dependencies
if: steps.cache-image-snapshots.outputs.cache-hit != 'true'
run: yarn install --immutable --inline-builds
- name: Cache Playwright runners
if: steps.cache-image-snapshots.outputs.cache-hit != 'true'
uses: actions/cache@v4
with:
path: |
/home/runner/.cache/ms-playwright/
key: ${{ runner.os }}-playwright-runner
- name: Install Playwright
if: steps.cache-image-snapshots.outputs.cache-hit != 'true'
run: yarn playwright install --with-deps
- name: Build Storybook
if: steps.cache-image-snapshots.outputs.cache-hit != 'true'
run: |
yarn build
yarn storybook:build --quiet
- name: Serve Storybook and run tests
if: steps.cache-image-snapshots.outputs.cache-hit != 'true'
run: |
npx concurrently -k -s first -n "SB,TEST" -c "magenta,blue" \
"npx http-server storybook-static --port 6006 --silent" \
"npx wait-on tcp:127.0.0.1:6006 && yarn test-storybook --updateSnapshot"
- name: Upload base branch snapshots
uses: actions/upload-artifact@v4
with:
name: base__image-snapshots__
path: __image_snapshots__/
test-storybook:
name: Build Storybook
timeout-minutes: 20
runs-on: ubuntu-latest
needs: prepare-base-branch
steps:
- name: Checkout branch
uses: actions/checkout@v4
- uses: actions/setup-node@v4
with:
node-version-file: '.node-version'
cache: yarn
- name: Install dependencies
run: yarn install --immutable --inline-builds
- name: Cache Playwright runners
uses: actions/cache@v4
with:
path: |
/home/runner/.cache/ms-playwright/
key: ${{ runner.os }}-playwright-runner
- name: Install Playwright
run: yarn playwright install --with-deps
- name: Build Storybook
run: |
yarn build
yarn storybook:build --quiet
- name: Check label
uses: actions/github-script@v7
id: label-checking
env:
SNAPSHOT_UPDATE_LABEL: image snapshots update
with:
result-encoding: string
script: |
const { issue, repo } = context
const { data: pull } = await github.rest.issues.get({
issue_number: issue.number,
owner: repo.owner,
repo: repo.repo
})
const labels = pull.labels.map(({ name }) => name)
if(labels.includes(process.env.SNAPSHOT_UPDATE_LABEL)){
console.log(`Found "${process.env.SNAPSHOT_UPDATE_LABEL}" label, image snapshots will be updated."`)
return 'true'
}
console.log(`Not fount "${process.env.SNAPSHOT_UPDATE_LABEL}" label. Compare with image snapshots of main branch.`)
return 'false'
- name: Load base branch image snapshots
uses: actions/download-artifact@v4
if: steps.label-checking.outputs.result != 'true'
with:
name: base__image-snapshots__
path: __image_snapshots__/
- name: Serve Storybook and run tests
if: steps.label-checking.outputs.result != 'true'
run: yarn test:image-snapshot
- name: Serve Storybook and take new image snapshots
if: steps.label-checking.outputs.result == 'true'
run: yarn test:image-snapshot --updateSnapshot
- name: Archive image snapshot diffs
uses: actions/upload-artifact@v4
if: failure() && steps.label-checking.outputs.result != 'true'
with:
path: __diff_output__/
- name: Archive new image snapshots
if: steps.label-checking.outputs.result == 'true'
uses: actions/upload-artifact@v4
with:
name: new__image_snapshots__
path: __image_snapshots__/