feat: add playground for web components #1059
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: Visual tests | |
| on: | |
| # pr runs ONLY when the pr is in review, and on new pushes to that pr | |
| pull_request: | |
| branches: [main, next] | |
| types: [opened, ready_for_review, synchronize, reopened] | |
| paths: | |
| - .github/workflows/test-visual.yml | |
| - 'packages/**/*.tsx?' | |
| - 'packages/**/*.css' | |
| - 'packages/**/*.stories.tsx?' | |
| - 'apps/storybook/**' | |
| - 'design-tokens/**/*.jsonc?' | |
| # main gets a push run so chromatic can auto-accept baselines there | |
| push: | |
| branches: [main] | |
| paths: | |
| - 'packages/**/*.tsx?' | |
| - 'packages/**/*.css' | |
| - 'packages/**/*.stories.tsx?' | |
| - 'apps/storybook/**' | |
| - 'design-tokens/**/*.jsonc?' | |
| concurrency: | |
| group: visual-${{ github.event.pull_request.number || github.run_id }} | |
| cancel-in-progress: true | |
| permissions: | |
| contents: write | |
| pull-requests: write | |
| actions: write | |
| checks: write | |
| jobs: | |
| pr-visual-tests: | |
| if: ${{ github.event_name == 'pull_request' && github.event.pull_request.draft == false }} | |
| runs-on: ubuntu-latest | |
| permissions: | |
| contents: write | |
| pull-requests: write | |
| actions: write | |
| checks: write | |
| steps: | |
| - uses: actions/checkout@08eba0b27e820071cde6df949e0beb9ba4906955 # v4.3.0 | |
| with: | |
| fetch-depth: 0 | |
| # build the PR HEAD exactly | |
| ref: ${{ github.event.pull_request.head.sha }} | |
| - uses: ./.github/actions/gh-setup | |
| - name: Build | |
| run: pnpm build | |
| - name: Build storybook | |
| run: pnpm build:storybook | |
| - name: Chromatic (visual + interaction) | |
| uses: chromaui/action@latest | |
| with: | |
| workingDir: apps/storybook | |
| projectToken: ${{ secrets.CHROMATIC_PROJECT_TOKEN }} | |
| exitZeroOnChanges: true | |
| onlyChanged: true | |
| skip: '@(renovate/**|dependabot/**)' | |
| main-visual-tests: | |
| if: ${{ github.event_name == 'push' && startsWith(github.ref, 'refs/heads/main') }} | |
| runs-on: ubuntu-latest | |
| permissions: | |
| contents: write | |
| pull-requests: write | |
| actions: write | |
| checks: write | |
| steps: | |
| - uses: actions/checkout@08eba0b27e820071cde6df949e0beb9ba4906955 # v4.3.0 | |
| with: | |
| fetch-depth: 0 | |
| - uses: ./.github/actions/gh-setup | |
| - name: Build | |
| run: pnpm build | |
| - name: Build storybook | |
| run: pnpm build:storybook | |
| - name: Chromatic (auto-accept on main) | |
| uses: chromaui/action@latest | |
| with: | |
| workingDir: apps/storybook | |
| projectToken: ${{ secrets.CHROMATIC_PROJECT_TOKEN }} | |
| autoAcceptChanges: true | |
| onlyChanged: true |