chore: implement chromatic #2535
This file contains hidden or 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: CI | |
| on: | |
| push: | |
| branches: | |
| - main | |
| pull_request: | |
| workflow_dispatch: | |
| jobs: | |
| lint: | |
| name: Lint | |
| runs-on: ubuntu-24.04 | |
| steps: | |
| - uses: actions/checkout@v6 | |
| - name: Setup pnpm, Node.js, and dependencies | |
| uses: ./.github/actions/setup | |
| - run: pnpm typecheck | |
| - run: pnpm format:check | |
| - run: pnpm lint | |
| - run: pnpm build | |
| test-unit: | |
| name: Unit Test (${{ matrix.name }}, Electron ${{ matrix.electron-version }}) | |
| runs-on: ${{ matrix.os }} | |
| strategy: | |
| fail-fast: false | |
| matrix: | |
| # Minimum supported version: VS Code 1.106 (Oct 2025) -> Electron 37 -> Node 22 | |
| # See https://github.com/ewanharris/vscode-versions for version mapping. | |
| # Older Electron stays Linux-only; "latest" smoke-tests Windows + macOS too. | |
| include: | |
| - { os: ubuntu-24.04, name: Linux, electron-version: "37" } | |
| - { os: ubuntu-24.04, name: Linux, electron-version: "latest" } | |
| - { os: windows-2025, name: Windows, electron-version: "latest" } | |
| - { os: macos-15, name: macOS, electron-version: "latest" } | |
| steps: | |
| - uses: actions/checkout@v6 | |
| - name: Setup pnpm, Node.js, and dependencies | |
| uses: ./.github/actions/setup | |
| - name: Run tests with Electron ${{ matrix.electron-version }} | |
| run: ./scripts/test-electron.sh ${{ matrix.electron-version }} | |
| shell: bash | |
| env: | |
| CI: true | |
| test-integration: | |
| name: Integration Test (${{ matrix.name }}, VS Code ${{ matrix.vscode-version }}) | |
| runs-on: ${{ matrix.os }} | |
| strategy: | |
| fail-fast: false | |
| matrix: | |
| include: | |
| - { os: ubuntu-24.04, name: Linux, vscode-version: "1.106.0" } | |
| - { os: ubuntu-24.04, name: Linux, vscode-version: "stable" } | |
| - { os: windows-2025, name: Windows, vscode-version: "stable" } | |
| - { os: macos-15, name: macOS, vscode-version: "stable" } | |
| steps: | |
| - uses: actions/checkout@v6 | |
| - name: Setup pnpm, Node.js, and dependencies | |
| uses: ./.github/actions/setup | |
| - run: pnpm build | |
| - name: Run integration tests on VS Code ${{ matrix.vscode-version }} | |
| # xvfb only exists on Linux; on Windows/macOS the runner has a real display. | |
| run: ${{ runner.os == 'Linux' && 'xvfb-run -a' || '' }} pnpm test:integration --label "VS Code ${{ matrix.vscode-version }}" | |
| shell: bash | |
| # Reference guide: | |
| # https://www.chromatic.com/docs/turbosnap-best-practices/#run-with-caution-when-using-the-pull_request-event | |
| chromatic: | |
| name: Chromatic | |
| runs-on: ubuntu-24.04 | |
| steps: | |
| - name: Checkout | |
| uses: actions/checkout@v6 | |
| with: | |
| # 👇 Ensures Chromatic can read your full git history | |
| fetch-depth: 0 | |
| # 👇 Tells the checkout which commit hash to reference | |
| ref: ${{ github.event.pull_request.head.ref }} | |
| persist-credentials: false | |
| - name: Setup pnpm, Node.js, and dependencies | |
| uses: ./.github/actions/setup | |
| # This step is not meant for mainline because any detected changes to | |
| # storybook snapshots will require manual approval/review in order for | |
| # the check to pass. This is desired in PRs, but not in mainline. | |
| - name: Publish to Chromatic (non-mainline) | |
| if: github.ref != 'refs/heads/main' && github.repository_owner == 'coder' | |
| uses: chromaui/action@latest | |
| env: | |
| NODE_OPTIONS: "--max_old_space_size=4096" | |
| STORYBOOK: true | |
| with: | |
| projectToken: ${{ secrets.CHROMATIC_PROJECT_TOKEN }} | |
| # Do a fast, testing build for change previews | |
| buildScriptName: "storybook:ci" | |
| exitOnceUploaded: true | |
| # This will prevent CI from failing when Chromatic detects visual changes | |
| exitZeroOnChanges: true | |
| # Prevent excessive build runs on minor version changes | |
| skip: "@(renovate/**|dependabot/**)" | |
| # Run TurboSnap to trace file dependencies to related stories | |
| # and tell chromatic to only take snapshots of relevant stories | |
| onlyChanged: true | |
| # Avoid uploading single files, because that's very slow | |
| zip: true | |
| # This is a separate step for mainline only that auto accepts and changes | |
| # instead of holding CI up. Since we squash/merge, this is defensive to | |
| # avoid the same changeset from requiring review once squashed into | |
| # main. Chromatic is supposed to be able to detect that we use squash | |
| # commits, but it's good to be defensive in case, otherwise CI remains | |
| # infinitely "in progress" in mainline unless we re-review each build. | |
| - name: Publish to Chromatic (mainline) | |
| if: github.ref == 'refs/heads/main' && github.repository_owner == 'coder' | |
| uses: chromaui/action@latest | |
| env: | |
| NODE_OPTIONS: "--max_old_space_size=4096" | |
| STORYBOOK: true | |
| with: | |
| projectToken: ${{ secrets.CHROMATIC_PROJECT_TOKEN }} | |
| autoAcceptChanges: true | |
| # This will prevent CI from failing when Chromatic detects visual changes | |
| exitZeroOnChanges: true | |
| # Do a full build with documentation for mainline builds | |
| buildScriptName: "storybook:build" | |
| # Run TurboSnap to trace file dependencies to related stories | |
| # and tell chromatic to only take snapshots of relevant stories | |
| onlyChanged: true | |
| # Avoid uploading single files, because that's very slow | |
| zip: true | |
| package: | |
| name: Package | |
| runs-on: ubuntu-24.04 | |
| steps: | |
| - uses: actions/checkout@v6 | |
| - name: Setup pnpm, Node.js, and dependencies | |
| uses: ./.github/actions/setup | |
| - name: Get version from package.json | |
| id: version | |
| run: | | |
| VERSION=$(node -e "console.log(require('./package.json').version)") | |
| echo "version=$VERSION" >> $GITHUB_OUTPUT | |
| echo "Version: $VERSION" | |
| - name: Setup package path | |
| id: setup | |
| run: | | |
| EXTENSION_NAME=$(node -e "console.log(require('./package.json').name)") | |
| # Add commit SHA for CI builds | |
| SHORT_SHA=$(git rev-parse --short HEAD) | |
| PACKAGE_NAME="${EXTENSION_NAME}-${{ steps.version.outputs.version }}-${SHORT_SHA}.vsix" | |
| echo "packageName=$PACKAGE_NAME" >> $GITHUB_OUTPUT | |
| - name: Build extension | |
| run: pnpm build:production | |
| - name: Package extension | |
| run: pnpm vsce package --no-dependencies --out "${{ steps.setup.outputs.packageName }}" | |
| - name: Upload artifact (PR) | |
| if: github.event_name == 'pull_request' | |
| uses: actions/upload-artifact@v7 | |
| with: | |
| path: ${{ steps.setup.outputs.packageName }} | |
| if-no-files-found: error | |
| retention-days: 7 | |
| archive: false | |
| - name: Upload artifact (main) | |
| if: github.event_name == 'push' && github.ref == 'refs/heads/main' | |
| uses: actions/upload-artifact@v7 | |
| with: | |
| path: ${{ steps.setup.outputs.packageName }} | |
| if-no-files-found: error | |
| archive: false |