ci: attach Cypress CT diff-snapshots to CI report #9676
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: ⚙️ E2E testing | ||
| on: | ||
| pull_request: | ||
| env: | ||
| CYPRESS_BASELINE_REPO: 'baseline' | ||
| CYPRESS_RESULTS_FOLDER: 'projects/demo-cypress/tests-results' | ||
| CYPRESS_BASELINE_SNAPSHOTS: 'projects/demo-cypress/tests-results/snapshots/baseline' | ||
| CYPRESS_BASELINE_SNAPSHOTS_KEY: 'cy_baseline_${{ CI_COMMIT_SHA }}' | ||
|
Check failure on line 9 in .github/workflows/e2e.yml
|
||
| jobs: | ||
| build-demo: | ||
| if: ${{ !contains(github.head_ref , 'release/') }} | ||
| name: Build demo | ||
| runs-on: ubuntu-latest | ||
| steps: | ||
| - uses: actions/[email protected] | ||
| with: | ||
| fetch-depth: 10 | ||
| - uses: taiga-family/ci/actions/setup/[email protected] | ||
| - uses: taiga-family/ci/actions/run/[email protected] | ||
| continue-on-error: true | ||
| - uses: taiga-family/ci/actions/setup/[email protected] | ||
| - name: Building demo-app of git-branch without cache | ||
| run: npx nx build demo # Don't use prerender please, because it's flaky for e2e | ||
| - name: Upload cache / ${{ env.CACHE_DIST_KEY }} | ||
| uses: actions/cache/[email protected] | ||
| with: | ||
| path: dist/demo | ||
| key: ${{ env.CACHE_DIST_KEY }} | ||
| cypress: | ||
| runs-on: ubuntu-latest | ||
| name: Cypress / Component Testing | ||
| steps: | ||
| - uses: actions/[email protected] | ||
| with: | ||
| ref: ${{ github.base_ref }} | ||
| - uses: taiga-family/ci/actions/setup/[email protected] | ||
| - uses: taiga-family/ci/actions/setup/[email protected] | ||
| - name: Run tests for baseline state | ||
| run: npx nx component-test demo-cypress | ||
| - name: Save Cypress Baseline Snapshots | ||
| uses: actions/[email protected] | ||
| with: | ||
| path: ${{env.CYPRESS_BASELINE_SNAPSHOTS}} | ||
| name: ${{env.CYPRESS_BASELINE_SNAPSHOTS_KEY}} | ||
| if-no-files-found: ignore | ||
| compression-level: 0 | ||
| retention-days: 1 | ||
| - uses: actions/[email protected] | ||
| - uses: taiga-family/ci/actions/setup/[email protected] | ||
| - uses: taiga-family/ci/actions/setup/[email protected] | ||
| - name: Download Cypress Baseline Snapshots | ||
| uses: actions/[email protected] | ||
| with: | ||
| path: ${{env.CYPRESS_BASELINE_SNAPSHOTS}} | ||
| pattern: ${{ env.CYPRESS_BASELINE_SNAPSHOTS_KEY }} | ||
| merge-multiple: true | ||
| - name: Run tests for current state | ||
| run: npx nx component-test demo-cypress | ||
| - name: Prepare diff screenshots | ||
| run: | | ||
| npm install canvas | ||
| npx ts-node ./scripts/visual-testing/combine-cypress-failed-screenshots.ts | ||
| - name: Debug output | ||
| continue-on-error: true | ||
| run: tree ${{ env.CYPRESS_RESULTS_FOLDER }} -L 1 | ||
| - name: Upload artifacts | ||
| uses: actions/[email protected] | ||
| with: | ||
| path: '${{ env.CYPRESS_RESULTS_FOLDER }}/**/*.diff.png' | ||
| name: ${{ env.CYPRESS_SNAPSHOTS_ARTIFACTS_KEY }} | ||
| if-no-files-found: ignore | ||
| compression-level: 0 | ||
| retention-days: 1 | ||
| playwright: | ||
| if: ${{ !contains(github.head_ref , 'release/') }} | ||
| runs-on: ubuntu-latest | ||
| needs: [build-demo] | ||
| strategy: | ||
| fail-fast: false | ||
| matrix: | ||
| shardIndex: [1, 2, 3, 4, 5, 6, 7, 8, 9] | ||
| shardTotal: [9] | ||
| name: Playwright / (${{ matrix.shardIndex }} of ${{ matrix.shardTotal }}) | ||
| steps: | ||
| - uses: actions/[email protected] | ||
| - uses: taiga-family/ci/actions/setup/[email protected] | ||
| - uses: taiga-family/ci/actions/setup/[email protected] | ||
| - uses: taiga-family/ci/actions/setup/[email protected] | ||
| - name: Download cache / ${{ env.CACHE_DIST_KEY }} | ||
| uses: actions/cache/[email protected] | ||
| with: | ||
| path: dist/demo | ||
| key: ${{ env.CACHE_DIST_KEY }} | ||
| - uses: taiga-family/ci/actions/run/[email protected] | ||
| with: | ||
| port: ${{ env.NG_SERVER_PORT }} | ||
| directory: ${{ env.DIST }} | ||
| replaceBaseUrl: false | ||
| - name: Run screenshot tests on ${{ env.DIST }} | ||
| run: npx nx e2e demo-playwright -- --update-snapshots --shard=${{ matrix.shardIndex }}/${{ matrix.shardTotal }} | ||
| - uses: taiga-family/ci/actions/run/[email protected] | ||
| with: | ||
| branch: snapshots/demo/next/${{ github.base_ref }} | ||
| destination: ${{ env.DIST_NEXT }} | ||
| - uses: taiga-family/ci/actions/run/[email protected] | ||
| with: | ||
| port: ${{ env.NG_SERVER_PORT }} | ||
| directory: ${{ env.DIST_NEXT }} | ||
| replaceBaseUrl: false | ||
| - name: Run screenshot tests on ${{ env.DIST_NEXT }} | ||
| continue-on-error: true | ||
| run: npx nx e2e demo-playwright --shard=${{ matrix.shardIndex }}/${{ matrix.shardTotal }} | ||
| - name: Combine images to get diff reports | ||
| run: | | ||
| npm install canvas | ||
| npm view canvas version | ||
| npx ts-node ./scripts/visual-testing/combine-playwright-failed-screenshots.ts | ||
| - name: Debug output | ||
| continue-on-error: true | ||
| run: tree ${{ env.PLAYWRIGHT_SNAPSHOTS_PATH }} | ||
| - name: Upload artifacts / ${{ env.PLAYWRIGHT_SNAPSHOTS_ARTIFACTS_KEY }} | ||
| uses: actions/[email protected] | ||
| with: | ||
| path: | | ||
| ./projects/demo-playwright/tests-results/**/*.diff.png | ||
| !./projects/demo-playwright/tests-results/**/*-retry*/*.diff.png | ||
| name: '${{ env.PLAYWRIGHT_SNAPSHOTS_ARTIFACTS_KEY }}_${{ matrix.shardIndex }}' | ||
| if-no-files-found: ignore | ||
| compression-level: 0 | ||
| retention-days: 1 | ||
| # workaround for status checks -- check this one job instead of each individual E2E job in the matrix | ||
| # see https://github.com/orgs/community/discussions/9141#discussioncomment-2296809 | ||
| playwright-composite-result: | ||
| name: Playwright E2E Tests matrix result | ||
| if: ${{ always() }} | ||
| needs: | ||
| - playwright | ||
| runs-on: ubuntu-latest | ||
| steps: | ||
| - run: | | ||
| result="${{ needs.playwright.result }}" | ||
| # mark as successful even if skipped | ||
| if [[ $result == "success" || $result == "skipped" ]]; then | ||
| exit 0 | ||
| else | ||
| exit 1 | ||
| fi | ||
| result: | ||
| if: ${{ !contains(github.head_ref , 'release/') }} | ||
| name: E2E result | ||
| needs: [playwright, cypress] | ||
| runs-on: ubuntu-latest | ||
| steps: | ||
| - uses: actions/[email protected] | ||
| - uses: taiga-family/ci/actions/setup/[email protected] | ||
| - name: Download artifacts for Playwright | ||
| continue-on-error: true | ||
| uses: actions/[email protected] | ||
| with: | ||
| path: ./total/playwright | ||
| pattern: ${{ env.PLAYWRIGHT_SNAPSHOTS_ARTIFACTS_KEY }}_* | ||
| merge-multiple: true | ||
| - run: ls -R ./total/playwright || echo "not found" | ||
| - name: Download artifacts for Cypress | ||
| continue-on-error: true | ||
| uses: actions/[email protected] | ||
| with: | ||
| path: ./total/cypress | ||
| pattern: ${{ env.CYPRESS_SNAPSHOTS_ARTIFACTS_KEY }} | ||
| merge-multiple: true | ||
| - run: ls -R ./total/cypress || echo "not found" | ||
| - name: Check if diff-output exists | ||
| id: diff_checker | ||
| run: | | ||
| echo "diff_exist=$(find ./total -regex '.*diff\.png$' | wc -l | sed -e 's/^[[:space:]]*//')" >> $GITHUB_OUTPUT | ||
| - name: Fall with an error if diff-output exists | ||
| if: ${{ steps.diff_checker.outputs.diff_exist != '0' }} | ||
| run: | | ||
| find ./total -regex '.*diff\.png$' -exec echo "{}" \; | ||
| exit 1 | ||
| concurrency: | ||
| group: ${{ github.workflow }}-${{ github.ref }} | ||
| cancel-in-progress: true | ||
