Add remaining ARIA snapshots and tests #3559
Workflow file for this run
This file contains 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: On Pull Request Opened And Synchronize | |
| on: | |
| pull_request: | |
| types: [opened, synchronize] | |
| env: | |
| CI: true | |
| concurrency: | |
| group: ${{ github.head_ref || github.ref }} | |
| cancel-in-progress: true | |
| jobs: | |
| install-dependencies: | |
| name: Install | |
| runs-on: ubuntu-latest | |
| steps: | |
| - uses: actions/checkout@v4 | |
| - uses: ./.github/actions/pnpm | |
| fetch-baseline-screenshots: | |
| name: Fetch Baseline Screenshots | |
| runs-on: ubuntu-latest | |
| steps: | |
| # TODO: Remove after this is resolved: https://www.cloudflarestatus.com/incidents/t5nrjmpxc1cj | |
| - name: Install AWS CLI | |
| run: | | |
| curl "https://awscli.amazonaws.com/awscli-exe-linux-x86_64-2.22.35.zip" -o "awscliv2.zip" | |
| unzip awscliv2.zip | |
| sudo ./aws/install --update | |
| - name: Configure AWS CLI | |
| env: | |
| CLOUDFLARE_R2_ACCESS_KEY_ID: ${{ secrets.CLOUDFLARE_R2_ACCESS_KEY_ID }} | |
| CLOUDFLARE_R2_SECRET_ACCESS_KEY: ${{ secrets.CLOUDFLARE_R2_SECRET_ACCESS_KEY }} | |
| # https://developers.cloudflare.com/r2/examples/aws/aws-cli | |
| run: | | |
| aws configure set region auto | |
| aws configure set output json | |
| aws configure set aws_access_key_id $CLOUDFLARE_R2_ACCESS_KEY_ID | |
| aws configure set aws_secret_access_key $CLOUDFLARE_R2_SECRET_ACCESS_KEY | |
| - run: aws s3 sync s3://${{ vars.CLOUDFLARE_R2_BUCKET_NAME }}/baseline-screenshots ./baseline-screenshots --endpoint-url ${{ vars.CLOUDFLARE_R2_ENDPOINT }} | |
| - name: Upload baseline screenshots | |
| uses: actions/upload-artifact@v4 | |
| with: | |
| path: baseline-screenshots | |
| name: baseline-screenshots | |
| format: | |
| name: Format | |
| runs-on: ubuntu-latest | |
| needs: | |
| - install-dependencies | |
| steps: | |
| - uses: actions/checkout@v4 | |
| - uses: ./.github/actions/pnpm | |
| - run: pnpm format | |
| env: | |
| NODE_ENV: production | |
| lint: | |
| name: Lint | |
| runs-on: ubuntu-latest | |
| needs: | |
| - install-dependencies | |
| steps: | |
| - uses: actions/checkout@v4 | |
| - uses: ./.github/actions/pnpm | |
| - run: pnpm start | |
| env: | |
| NODE_ENV: production | |
| - run: pnpm lint | |
| env: | |
| NODE_ENV: production | |
| typecheck: | |
| name: Typecheck | |
| runs-on: ubuntu-latest | |
| needs: | |
| - install-dependencies | |
| steps: | |
| - uses: actions/checkout@v4 | |
| - uses: ./.github/actions/pnpm | |
| - run: pnpm typecheck | |
| env: | |
| NODE_ENV: production | |
| test: | |
| name: Test | |
| # https://github.com/CrowdStrike/glide-core/pull/529#discussion_r1886905184 | |
| runs-on: macos-latest | |
| # Something has gone wrong if testing takes longer than 10 minutes. | |
| timeout-minutes: 10 | |
| needs: | |
| - install-dependencies | |
| steps: | |
| - uses: actions/checkout@v4 | |
| - run: git fetch origin main --depth 1 | |
| - uses: ./.github/actions/pnpm | |
| - run: pnpm dlx playwright@1.50.1 install --only-shell --with-deps chromium | |
| - run: pnpm test | |
| env: | |
| NODE_ENV: production | |
| - name: Upload coverage report | |
| uses: actions/upload-artifact@v4 | |
| if: ${{ failure() }} | |
| with: | |
| name: coverage | |
| path: dist/coverage | |
| # Its own job instead of putting it in `test-visuals` and renaming that job | |
| # because `test-visual` sets `continue-on-error` so that missing and changed | |
| # snapshots don't cause it to fail. | |
| test-aria: | |
| name: Test (ARIA) | |
| runs-on: ubuntu-latest | |
| # Increase sharding if the job takes longer than a few minutes. | |
| timeout-minutes: 5 | |
| needs: | |
| - install-dependencies | |
| strategy: | |
| matrix: | |
| shardIndex: [1, 2, 3, 4, 5, 6, 7, 8, 9, 10] | |
| shardTotal: [10] | |
| steps: | |
| - uses: actions/checkout@v4 | |
| - uses: ./.github/actions/pnpm | |
| - run: pnpm dlx playwright@1.50.1 install --only-shell --with-deps chromium | |
| - name: Test | |
| run: pnpm exec playwright test --project aria --shard=${{ matrix.shardIndex }}/${{ matrix.shardTotal }} | |
| test-visuals: | |
| name: Test (Visuals) | |
| runs-on: ubuntu-latest | |
| # Increase sharding if the job takes longer than a few minutes. | |
| timeout-minutes: 5 | |
| needs: | |
| - install-dependencies | |
| - fetch-baseline-screenshots | |
| strategy: | |
| # We need every job in the matrix to finish so we can produce a full report. | |
| fail-fast: false | |
| matrix: | |
| shardIndex: [1, 2, 3, 4, 5, 6, 7, 8, 9, 10] | |
| shardTotal: [10] | |
| steps: | |
| - uses: actions/checkout@v4 | |
| - uses: ./.github/actions/pnpm | |
| - run: pnpm dlx playwright@1.50.1 install --only-shell --with-deps chromium | |
| - name: Download baseline screenshots | |
| uses: actions/download-artifact@v4 | |
| with: | |
| path: dist/playwright-baseline-screenshots | |
| name: baseline-screenshots | |
| - name: Test | |
| # Failing would add quite a bit of time to CI. It would also add complexity, both | |
| # for developers and to this workflow. | |
| # | |
| # To do it, we'd have to hack up GitHub's staged deployments feature to require an | |
| # approval of the visual changes. After they're approved, we'd update the screenshots | |
| # on R2. Then we'd force a re-run of this job so it passes for the branch in question. | |
| # Lastly, after merge, we'd have to synchronize the screenshots again in case another | |
| # branch was merged in the meantime and overwrote them. | |
| # | |
| # So we simply expect the developer and reviewers to look over the test report, deployed | |
| # below, before merging. | |
| continue-on-error: true | |
| run: pnpm exec playwright test --project visuals --shard=${{ matrix.shardIndex }}/${{ matrix.shardTotal }} | |
| - name: Upload blob report | |
| if: ${{ !cancelled() }} | |
| uses: actions/upload-artifact@v4 | |
| with: | |
| name: visual-test-report-blob-${{ matrix.shardIndex }} | |
| path: blob-report | |
| deploy-visual-test-report: | |
| name: Deploy Test Report | |
| if: ${{ !cancelled() }} | |
| runs-on: ubuntu-latest | |
| needs: | |
| - test-visuals | |
| steps: | |
| - uses: actions/checkout@v4 | |
| - uses: ./.github/actions/pnpm | |
| - name: Download blob reports | |
| uses: actions/download-artifact@v4 | |
| with: | |
| merge-multiple: true | |
| path: visual-test-report-blob | |
| pattern: visual-test-report-blob-* | |
| - name: Merge blob reports | |
| run: | | |
| PLAYWRIGHT_HTML_ATTACHMENTS_BASE_URL=https://${{ vars.CLOUDFLARE_CUSTOM_DOMAIN }}/${{ github.head_ref }}/visual-test-report/data/ pnpm exec playwright merge-reports --reporter html ./visual-test-report-blob | |
| # TODO: Remove after this is resolved: https://www.cloudflarestatus.com/incidents/t5nrjmpxc1cj | |
| - name: Install AWS CLI | |
| run: | | |
| curl "https://awscli.amazonaws.com/awscli-exe-linux-x86_64-2.22.35.zip" -o "awscliv2.zip" | |
| unzip awscliv2.zip | |
| sudo ./aws/install --update | |
| - name: Configure AWS CLI | |
| env: | |
| CLOUDFLARE_R2_ACCESS_KEY_ID: ${{ secrets.CLOUDFLARE_R2_ACCESS_KEY_ID }} | |
| CLOUDFLARE_R2_SECRET_ACCESS_KEY: ${{ secrets.CLOUDFLARE_R2_SECRET_ACCESS_KEY }} | |
| # https://developers.cloudflare.com/r2/examples/aws/aws-cli | |
| run: | | |
| aws configure set region auto | |
| aws configure set output json | |
| aws configure set aws_access_key_id $CLOUDFLARE_R2_ACCESS_KEY_ID | |
| aws configure set aws_secret_access_key $CLOUDFLARE_R2_SECRET_ACCESS_KEY | |
| - name: Deploy HTML report | |
| run: aws s3 sync ./playwright-report s3://${{ vars.CLOUDFLARE_R2_BUCKET_NAME }}/${{ github.head_ref }}/visual-test-report --endpoint-url ${{ vars.CLOUDFLARE_R2_ENDPOINT }} | |
| - uses: marocchino/sticky-pull-request-comment@v2 | |
| with: | |
| header: visual-test-report | |
| message: |+ | |
| ## Visual Test Report | |
| https://${{ vars.CLOUDFLARE_CUSTOM_DOMAIN }}/${{ github.head_ref }}/visual-test-report | |
| build: | |
| name: Build | |
| runs-on: ubuntu-latest | |
| needs: | |
| - install-dependencies | |
| steps: | |
| - uses: actions/checkout@v4 | |
| - uses: ./.github/actions/pnpm | |
| - run: pnpm start | |
| env: | |
| BASE_URL: ${{ github.head_ref }} | |
| NODE_ENV: production | |
| - name: Upload Storybook | |
| uses: actions/upload-artifact@v4 | |
| with: | |
| name: storybook | |
| path: dist/storybook | |
| deploy-storybook: | |
| name: Deploy Storybook | |
| # Ubuntu instead of MacOS because the performance difference is | |
| # negligible and Ubuntu includes the AWS CLI. | |
| runs-on: ubuntu-latest | |
| needs: | |
| - build | |
| steps: | |
| # TODO: Remove after this is resolved: https://www.cloudflarestatus.com/incidents/t5nrjmpxc1cj | |
| - name: Install AWS CLI | |
| run: | | |
| curl "https://awscli.amazonaws.com/awscli-exe-linux-x86_64-2.22.35.zip" -o "awscliv2.zip" | |
| unzip awscliv2.zip | |
| sudo ./aws/install --update | |
| - name: Configure AWS CLI | |
| env: | |
| CLOUDFLARE_R2_ACCESS_KEY_ID: ${{ secrets.CLOUDFLARE_R2_ACCESS_KEY_ID }} | |
| CLOUDFLARE_R2_SECRET_ACCESS_KEY: ${{ secrets.CLOUDFLARE_R2_SECRET_ACCESS_KEY }} | |
| # https://developers.cloudflare.com/r2/examples/aws/aws-cli | |
| run: | | |
| aws configure set region auto | |
| aws configure set output json | |
| aws configure set aws_access_key_id $CLOUDFLARE_R2_ACCESS_KEY_ID | |
| aws configure set aws_secret_access_key $CLOUDFLARE_R2_SECRET_ACCESS_KEY | |
| - name: Download Storybook | |
| uses: actions/download-artifact@v4 | |
| with: | |
| name: storybook | |
| path: storybook | |
| - name: Deploy Storybook | |
| run: aws s3 sync ./storybook s3://${{ vars.CLOUDFLARE_R2_BUCKET_NAME }}/${{ github.head_ref }} --endpoint-url ${{ vars.CLOUDFLARE_R2_ENDPOINT }} | |
| - uses: marocchino/sticky-pull-request-comment@v2 | |
| with: | |
| header: storybook | |
| message: |+ | |
| ## Storybook | |
| https://${{ vars.CLOUDFLARE_CUSTOM_DOMAIN }}/${{ github.head_ref }} |