Chromatic deployment for stepper #24279
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: "Chromatic" | |
| run-name: Chromatic deployment for ${{ github.event.workflow_run.head_branch }} | |
| on: | |
| workflow_run: | |
| workflows: ["Build Storybook"] | |
| types: | |
| - completed | |
| permissions: | |
| issues: write | |
| pull-requests: write | |
| jobs: | |
| chromatic-deployment: | |
| if: ${{ github.event.workflow_run.conclusion == 'success' }} | |
| runs-on: ubuntu-latest | |
| steps: | |
| - uses: actions/checkout@v4 | |
| with: | |
| fetch-depth: 0 | |
| repository: ${{ github.event.workflow_run.head_repository.full_name }} | |
| ref: ${{ github.event.workflow_run.head_branch }} | |
| - name: "Download run metadata" | |
| uses: actions/download-artifact@v4 | |
| with: | |
| name: metadata | |
| path: ./METADATA | |
| github-token: ${{ secrets.GITHUB_TOKEN }} | |
| run-id: ${{ github.event.workflow_run.id }} | |
| - name: Get branch for Chromatic | |
| uses: actions/github-script@v7 | |
| id: run_metadata | |
| with: | |
| script: | | |
| const fs = require("fs"); | |
| const branchName = fs.readFileSync("./METADATA/branch-name", "utf8").trim(); | |
| core.setOutput("branchName", branchName); | |
| const base = fs.readFileSync("./METADATA/base", "utf8").trim(); | |
| core.setOutput("base", base); | |
| const runChromatic = fs.readFileSync("./METADATA/run-chromatic", "utf8").trim(); | |
| core.setOutput("runChromatic", runChromatic); | |
| const noTurbosnap = fs.readFileSync("./METADATA/no-turbosnap", "utf8").trim(); | |
| core.setOutput("noTurbosnap", noTurbosnap); | |
| const issueNumber = fs.readFileSync("./METADATA/issue-number", "utf8").trim(); | |
| core.setOutput("issueNumber", issueNumber); | |
| - name: Fetch base branch from upstream | |
| if: github.event.workflow_run.event == 'pull_request' | |
| run: | | |
| git remote add upstream ${{ github.event.repository.clone_url }} | |
| git fetch upstream | |
| git checkout -B ${{ steps.run_metadata.outputs.base }} upstream/${{ steps.run_metadata.outputs.base }} | |
| git checkout ${{ github.event.workflow_run.head_branch }} | |
| git clean -ffdx && git reset --hard HEAD | |
| - name: Use Node.js | |
| uses: actions/setup-node@v4 | |
| with: | |
| node-version: "20" | |
| cache: "yarn" | |
| - name: Install dependencies | |
| run: yarn | |
| - name: "Download build artifact" | |
| uses: actions/download-artifact@v4 | |
| with: | |
| name: storybook-build | |
| path: ./storybook-static | |
| github-token: ${{ secrets.GITHUB_TOKEN }} | |
| run-id: ${{ github.event.workflow_run.id }} | |
| - name: Publish to Chromatic | |
| if: ${{ steps.run_metadata.outputs.branchName == 'main' || steps.run_metadata.outputs.runChromatic == 'true' }} | |
| uses: chromaui/action@v11.10.2 | |
| # Chromatic GitHub Action options | |
| with: | |
| # 👇 Chromatic projectToken, refer to the manage page to obtain it. | |
| projectToken: ${{ secrets.CHROMATIC_PROJECT_TOKEN }} | |
| exitOnceUploaded: true | |
| # Turbosnap if this is not the main branch | |
| onlyChanged: ${{ steps.run_metadata.outputs.branchName != 'main' && steps.run_metadata.outputs.noTurbosnap != 'true' }} | |
| externals: ${{ steps.run_metadata.outputs.branchName != 'main' && steps.run_metadata.outputs.noTurbosnap != 'true' && 'packages/(theme)/**' || '' }} | |
| skip: "changeset-release/*" | |
| autoAcceptChanges: ${{ steps.run_metadata.outputs.branchName == 'main' && steps.run_metadata.outputs.noTurbosnap != 'true' }} | |
| ignoreLastBuildOnBranch: "**" | |
| traceChanged: ${{ (steps.run_metadata.outputs.branchName != 'main' && steps.run_metadata.outputs.noTurbosnap != 'true') && 'expanded' || '' }} | |
| storybookBuildDir: "./storybook-static" | |
| branchName: ${{ steps.run_metadata.outputs.branchName }} | |
| debug: true | |
| env: | |
| LOG_LEVEL: "debug" | |
| - name: Remove Chromatic label | |
| if: ${{ steps.run_metadata.outputs.branchName != 'main' }} | |
| uses: actions/github-script@v7 | |
| with: | |
| script: | | |
| try { | |
| await github.rest.issues.removeLabel({ | |
| issue_number: ${{ steps.run_metadata.outputs.issueNumber }}, | |
| owner: context.repo.owner, | |
| repo: context.repo.repo, | |
| name: ["chromatic"] | |
| }); | |
| } catch (error) { | |
| console.log(error); | |
| } |