fix #307574. support opening scm diff in modal. #9496
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 rspack dependencies | |
| run: npm ci | |
| working-directory: build/rspack | |
| - name: Transpile source | |
| run: npm run transpile-client | |
| - name: Install Playwright Chromium | |
| run: npx playwright install chromium | |
| - name: Capture screenshots | |
| run: ./node_modules/.bin/component-explorer render --project ./test/componentFixtures/component-explorer.json | |
| - name: Upload screenshots | |
| uses: actions/upload-artifact@v7 | |
| with: | |
| name: screenshots | |
| path: test/componentFixtures/.screenshots/current/ | |
| - name: Trigger ingestion | |
| run: | | |
| curl -sS -X POST "https://hediet-screenshots.azurewebsites.net/ingest" \ | |
| -H "Content-Type: application/json" \ | |
| -d '{ | |
| "owner": "${{ github.repository_owner }}", | |
| "repo": "${{ github.event.repository.name }}", | |
| "runId": ${{ github.run_id }}, | |
| "artifactName": "screenshots" | |
| }' | |
| # - 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 |