Skip to content

Merge pull request #14 from Jurfest/feature/utils #8

Merge pull request #14 from Jurfest/feature/utils

Merge pull request #14 from Jurfest/feature/utils #8

name: Deploy Storybook to Chromatic
on:
push:
branches:
- main
jobs:
storybook-deploy:
runs-on: ubuntu-latest
steps:
- name: Checkout
uses: actions/checkout@v4
with:
# Fetch all history (full Git history graph) so Chromatic can determine baseline commits
fetch-depth: 0
- name: Setup Node.js
uses: actions/setup-node@v4
with:
node-version: 20
# Install dependencies based on the package-lock.json file for reliability and speed
- name: Install dependencies
run: npm ci
# Optional: Uncomment the build-storybook step to apply custom build steps or to verify the build beforehand
# - name: Build Storybook
# run: npm run build-storybook
# Build and Deploy Storybook using Chromatic's streamlined process
- name: Build and Deploy Storybook
id: chromatic
# The flag auto accepts visual changes
run: |
npx chromatic --project-token=${{ secrets.CHROMATIC_PROJECT_TOKEN }} --auto-accept-changes | tee chromatic-output.txt
env:
CHROMATIC_PROJECT_TOKEN: ${{ secrets.CHROMATIC_PROJECT_TOKEN }}
# Extract the Chromatic URL and update the README file
# - name: Update README with Chromatic URL
# run: |
# # Extract Chromatic URL from the output
# url=$(grep -oP 'https://.*\.chromatic\.com/' chromatic-output.txt | head -n 1)
# # Update the README.md file with the new URL
# sed -i 's|\(https://\).*\(.chromatic.com/\)|\1'"$url"'\2|' README.md
# # Commit and push the updated README file
# - name: Commit and Push README
# run: |
# git config --global user.name "github-actions[bot]"
# git config --global user.email "github-actions[bot]@users.noreply.github.com"
# git add README.md
# git commit -m "ci: automatic storybook url update in readme"
# git push
# env:
# GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}