Skip to content

Instantly share code, notes, and snippets.

@rhuanbarreto
Created July 29, 2022 17:32
Show Gist options
  • Save rhuanbarreto/5dcf213b11275cd90862d5aecc4b6d7a to your computer and use it in GitHub Desktop.
Save rhuanbarreto/5dcf213b11275cd90862d5aecc4b6d7a to your computer and use it in GitHub Desktop.
Github Workflow For Chromatic
name: Visual Testing
on:
push:
branches:
- master
pull_request:
types:
- opened
- reopened
- synchronize
- ready_for_review
jobs:
visual-testing:
if: github.event_name == 'push' || !github.event.pull_request.draft
runs-on: ubuntu-latest
name: Visual Testing
steps:
- name: Check out
uses: actions/checkout@v3
with:
fetch-depth: 0
- uses: actions/setup-node@v3
with:
node-version: "14.x"
cache: yarn
registry-url: "https://registry.npmjs.org"
- name: Install dependencies
# Ignore scripts because they can steal the token
run: yarn install --ignore-scripts --frozen-lockfile
env:
NODE_AUTH_TOKEN: ${{ secrets.NPM_READONLY_TOKEN }}
# 👇 Checks if the branch is master and accepts all changes in Chromatic
- name: Publish to Chromatic and auto accept changes
if: github.ref == 'refs/heads/master'
uses: chromaui/action@v1
with:
token: ${{ secrets.GITHUB_TOKEN }}
projectToken: ${{ secrets.CHROMATIC_PROJECT_TOKEN }}
autoAcceptChanges: true
- name: Publish to Chromatic
if: github.ref != 'refs/heads/master'
id: chromatic-pr
uses: chromaui/action@v1
with:
token: ${{ secrets.GITHUB_TOKEN }}
projectToken: ${{ secrets.CHROMATIC_PROJECT_TOKEN }}
onlyChanged: true
exitOnceUploaded: true
- name: Find Comment
if: github.ref != 'refs/heads/master' && steps.chromatic-pr.outputs.buildUrl
uses: peter-evans/find-comment@v2
id: fc
with:
issue-number: ${{ github.event.pull_request.number }}
comment-author: "chromatic[bot]"
body-includes: Chromatic Results
- name: Create or update comment
if: github.ref != 'refs/heads/master' && steps.chromatic-pr.outputs.buildUrl
uses: peter-evans/create-or-update-comment@v2
with:
comment-id: ${{ steps.fc.outputs.comment-id }}
issue-number: ${{ github.event.pull_request.number }}
body: |
# Chromatic Results
- Storybook build results: ${{ steps.chromatic-pr.outputs.buildUrl }}
- Review URL: ${{ steps.chromatic-pr.outputs.storybookUrl }}
edit-mode: replace
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment