Merge pull request #1672 from Kilo-Org/changeset-release/main #1
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: Storybook Playwright Snapshot | |
| on: | |
| workflow_dispatch: | |
| push: | |
| branches: [main] | |
| pull_request: | |
| types: [opened, reopened, ready_for_review, synchronize] | |
| branches: [main] | |
| # Cancel in-progress jobs when new workflow is triggered | |
| concurrency: | |
| group: ${{ github.workflow }}-${{ github.event.pull_request.number || github.ref }} | |
| cancel-in-progress: true | |
| env: | |
| DOCKER_BUILDKIT: 1 | |
| COMPOSE_DOCKER_CLI_BUILD: 1 | |
| NODE_VERSION: 20.19.2 | |
| PNPM_VERSION: 10.8.1 | |
| SECRETS_SET: ${{ secrets.OPENROUTER_API_KEY != '' }} | |
| TURBO_TOKEN: ${{ secrets.TURBO_TOKEN }} | |
| TURBO_TEAM: ${{ secrets.TURBO_TEAM }} | |
| jobs: | |
| storybook-playwright-snapshot: | |
| runs-on: ubuntu-latest | |
| timeout-minutes: 45 | |
| steps: | |
| - name: Checkout repository | |
| uses: actions/checkout@v4 | |
| with: | |
| # Chromatic needs full git history for baseline comparison | |
| fetch-depth: 0 | |
| - name: Install pnpm | |
| uses: pnpm/action-setup@v4 | |
| with: | |
| version: ${{ env.PNPM_VERSION }} | |
| - name: Set up Node.js | |
| uses: actions/setup-node@v4 | |
| with: | |
| node-version: ${{ env.NODE_VERSION }} | |
| cache: "pnpm" | |
| - name: Turbo cache setup | |
| uses: actions/cache@v4 | |
| with: | |
| path: .turbo | |
| key: ${{ runner.os }}-turbo-${{ github.sha }} | |
| restore-keys: | | |
| ${{ runner.os }}-turbo- | |
| - name: Install dependencies | |
| run: pnpm install --frozen-lockfile | |
| - name: Type check Playwright E2E | |
| run: | | |
| cd apps/playwright-e2e | |
| pnpm check-types | |
| - name: Set up Docker Buildx | |
| uses: docker/setup-buildx-action@v3 | |
| - name: Cache Docker layers | |
| uses: actions/cache@v4 | |
| with: | |
| path: /tmp/.buildx-cache | |
| key: ${{ runner.os }}-buildx-${{ hashFiles('apps/playwright-e2e/Dockerfile.playwright-ci') }} | |
| restore-keys: ${{ runner.os }}-buildx- | |
| - name: Run Playwright E2E tests | |
| if: ${{ env.SECRETS_SET }} | |
| run: | | |
| cd apps/playwright-e2e | |
| node run-docker-playwright.js | |
| env: | |
| OPENROUTER_API_KEY: ${{ secrets.OPENROUTER_API_KEY }} | |
| WORKSPACE_ROOT: ${{ github.workspace }} | |
| - name: Generate Stories from Playwright Screenshots | |
| run: pnpm --filter @roo-code/storybook generate-screenshot-stories | |
| - name: Build Storybook | |
| run: pnpm --filter @roo-code/storybook build-storybook | |
| - name: Run Chromatic | |
| id: chromatic | |
| uses: chromaui/action@latest | |
| with: | |
| projectToken: chpt_f6ec377cea9b457 | |
| storybookBaseDir: apps/storybook/ | |
| storybookBuildDir: apps/storybook/storybook-static | |
| onlyChanged: true | |
| exitOnceUploaded: ${{ github.event_name == 'pull_request' }} | |
| # Skip dependabot PRs and renovate PRs using glob patterns | |
| skip: "@(dependabot/**|renovate/**)" | |
| # Auto-accept changes on main branch to keep it clean | |
| autoAcceptChanges: ${{ github.ref == 'refs/heads/main' && 'main' || '' }} | |
| # Add a summary of the Chromatic build results to the workflow summary | |
| - name: Chromatic Build Summary | |
| if: always() && steps.chromatic.outputs.url != '' | |
| run: | | |
| echo "## Chromatic Build Results" >> $GITHUB_STEP_SUMMARY | |
| echo "" >> $GITHUB_STEP_SUMMARY | |
| echo "### Build Information" >> $GITHUB_STEP_SUMMARY | |
| echo "- **Build URL:** [View on Chromatic](${{ steps.chromatic.outputs.url }})" >> $GITHUB_STEP_SUMMARY | |
| echo "- **Changes:** ${{ steps.chromatic.outputs.changeCount || 'N/A' }}" >> $GITHUB_STEP_SUMMARY | |
| echo "- **Components:** ${{ steps.chromatic.outputs.componentCount || 'N/A' }}" >> $GITHUB_STEP_SUMMARY | |
| echo "- **Snapshots:** ${{ steps.chromatic.outputs.specCount || 'N/A' }}" >> $GITHUB_STEP_SUMMARY | |
| if [[ "${{ steps.chromatic.outputs.changeCount }}" != "0" ]]; then | |
| echo "" >> $GITHUB_STEP_SUMMARY | |
| echo "⚠️ **Visual changes detected!** Please review in Chromatic." >> $GITHUB_STEP_SUMMARY | |
| else | |
| echo "" >> $GITHUB_STEP_SUMMARY | |
| echo "✅ **No visual changes detected.**" >> $GITHUB_STEP_SUMMARY | |
| fi |