compile leftover (#301670) #4351
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: Checking Component Screenshots | |
| on: | |
| push: | |
| branches: [main] | |
| pull_request: | |
| branches: | |
| - main | |
| - 'release/*' | |
| permissions: | |
| contents: read | |
| statuses: write | |
| concurrency: | |
| group: screenshots-${{ github.event.pull_request.number || github.sha }} | |
| cancel-in-progress: true | |
| jobs: | |
| screenshots: | |
| name: Checking Component Screenshots | |
| runs-on: ubuntu-latest | |
| steps: | |
| - name: Checkout | |
| uses: actions/checkout@v6 | |
| with: | |
| lfs: true | |
| - name: Setup Node.js | |
| uses: actions/setup-node@v6 | |
| with: | |
| node-version-file: .nvmrc | |
| - name: Install dependencies | |
| run: npm ci --ignore-scripts | |
| env: | |
| ELECTRON_SKIP_BINARY_DOWNLOAD: 1 | |
| PLAYWRIGHT_SKIP_BROWSER_DOWNLOAD: 1 | |
| GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }} | |
| - name: Install build dependencies | |
| run: npm ci | |
| working-directory: build | |
| - name: Install build/vite dependencies | |
| run: rm -f package-lock.json && npm install | |
| working-directory: build/vite | |
| - name: Build vite | |
| run: npm run build | |
| working-directory: build/vite | |
| - name: Install Playwright Chromium | |
| run: npx playwright install chromium | |
| - name: Capture screenshots | |
| run: ./node_modules/.bin/component-explorer screenshot --project ./test/componentFixtures/component-explorer.json | |
| - name: Compare screenshots | |
| id: compare | |
| run: | | |
| ./node_modules/.bin/component-explorer screenshot:compare \ | |
| --project ./test/componentFixtures \ | |
| --report ./test/componentFixtures/.screenshots/report | |
| continue-on-error: true | |
| - name: Prepare explorer artifact | |
| run: | | |
| mkdir -p /tmp/explorer-artifact/screenshot-report | |
| cp -r build/vite/dist/* /tmp/explorer-artifact/ | |
| if [ -d test/componentFixtures/.screenshots/report ]; then | |
| cp -r test/componentFixtures/.screenshots/report/* /tmp/explorer-artifact/screenshot-report/ | |
| fi | |
| - name: Upload explorer artifact | |
| uses: actions/upload-artifact@v7 | |
| with: | |
| name: component-explorer | |
| path: /tmp/explorer-artifact/ | |
| - name: Upload screenshot report | |
| if: steps.compare.outcome == 'failure' | |
| uses: actions/upload-artifact@v7 | |
| with: | |
| name: screenshot-diff | |
| path: | | |
| test/componentFixtures/.screenshots/current/ | |
| test/componentFixtures/.screenshots/report/ | |
| - name: Set check title | |
| env: | |
| GH_TOKEN: ${{ secrets.GITHUB_TOKEN }} | |
| run: | | |
| REPORT="test/componentFixtures/.screenshots/report/report.json" | |
| STATE="success" | |
| if [ -f "$REPORT" ]; then | |
| CHANGED=$(node -e "const r = require('./$REPORT'); console.log(r.summary.added + r.summary.removed + r.summary.changed)") | |
| TITLE="⚠ ${CHANGED} screenshots changed" | |
| BLOCKS_CI=$(node -e " | |
| const r = require('./$REPORT'); | |
| const blocking = Object.entries(r.fixtures).filter(([, f]) => | |
| f.status !== 'unchanged' && (f.labels || []).includes('blocks-ci') | |
| ); | |
| if (blocking.length > 0) { | |
| console.log(blocking.map(([name]) => name).join(', ')); | |
| } | |
| ") | |
| if [ -n "$BLOCKS_CI" ]; then | |
| STATE="failure" | |
| TITLE="❌ ${CHANGED} screenshots changed (blocks CI: ${BLOCKS_CI})" | |
| fi | |
| else | |
| TITLE="✅ Screenshots match" | |
| fi | |
| SHA="${{ github.event.pull_request.head.sha || github.sha }}" | |
| DETAILS_URL="https://hediet-ghartifactpreview.azurewebsites.net/${{ github.repository }}/run/${{ github.run_id }}/component-explorer/___explorer.html?report=./screenshot-report/report.json&search=changed" | |
| gh api "repos/${{ github.repository }}/statuses/$SHA" \ | |
| --input - <<EOF || echo "::warning::Could not create commit status (expected for fork PRs)" | |
| {"state":"$STATE","target_url":"$DETAILS_URL","description":"$TITLE","context":"Component Screenshots"} | |
| EOF | |
| # - name: Post PR comment | |
| # if: github.event_name == 'pull_request' | |
| # env: | |
| # GH_TOKEN: ${{ secrets.GITHUB_TOKEN }} | |
| # run: | | |
| # COMMENT_MARKER="<!-- screenshot-report -->" | |
| # BODY="$COMMENT_MARKER"$'\n' | |
| # | |
| # if [ -f test/componentFixtures/.screenshots/report.md ]; then | |
| # BODY+=$(cat test/componentFixtures/.screenshots/report.md) | |
| # BODY+=$'\n\n' | |
| # BODY+="📦 [Download the \`screenshot-diff\` artifact](${{ github.server_url }}/${{ github.repository }}/actions/runs/${{ github.run_id }}) to review images." | |
| # else | |
| # BODY+="## Screenshots ✅"$'\n\n' | |
| # BODY+="No visual changes detected." | |
| # fi | |
| # | |
| # # Find existing comment | |
| # EXISTING=$(gh api "repos/${{ github.repository }}/issues/${{ github.event.pull_request.number }}/comments" \ | |
| # --paginate --jq ".[] | select(.body | startswith(\"$COMMENT_MARKER\")) | .id" | head -1) | |
| # | |
| # if [ -n "$EXISTING" ]; then | |
| # gh api "repos/${{ github.repository }}/issues/comments/$EXISTING" -X PATCH -f body="$BODY" | |
| # else | |
| # gh pr comment "${{ github.event.pull_request.number }}" --body "$BODY" | |
| # fi |