|
| 1 | +name: Playwright Tests |
| 2 | + |
| 3 | +# Trigger CI on push to main and on all pull requests |
| 4 | +on: |
| 5 | + push: |
| 6 | + branches: [ main, master ] |
| 7 | + pull_request: |
| 8 | + branches: [ main, master ] |
| 9 | + |
| 10 | +# Allow manual workflow runs from Actions tab |
| 11 | + workflow_dispatch: |
| 12 | + |
| 13 | +jobs: |
| 14 | + test: |
| 15 | + # Job timeout (prevents hanging tests from blocking CI) |
| 16 | + timeout-minutes: 20 |
| 17 | + |
| 18 | + # Run on latest Ubuntu (also works on windows-latest, macos-latest) |
| 19 | + runs-on: ubuntu-latest |
| 20 | + |
| 21 | + steps: |
| 22 | + # 1. Checkout code |
| 23 | + - name: Checkout repository |
| 24 | + uses: actions/checkout@v4 |
| 25 | + |
| 26 | + # 2. Setup Node.js (v20 LTS, change if needed) |
| 27 | + - name: Setup Node.js |
| 28 | + uses: actions/setup-node@v4 |
| 29 | + with: |
| 30 | + node-version: 20 |
| 31 | + cache: 'npm' # Cache node_modules for faster subsequent runs |
| 32 | + |
| 33 | + # 3. Install dependencies (production + dev) |
| 34 | + - name: Install dependencies |
| 35 | + run: npm ci |
| 36 | + # npm ci is faster than npm install and ensures clean installs |
| 37 | + # Uses package-lock.json for deterministic dependencies |
| 38 | + |
| 39 | + # 4. Install Playwright browsers (Chromium only, as per config) |
| 40 | + - name: Install Playwright Browsers |
| 41 | + run: npx playwright install chromium --with-deps |
| 42 | + # --with-deps: Installs system dependencies (fonts, media codecs) |
| 43 | + # chromium: Only install Chromium (faster than --with-deps alone) |
| 44 | + |
| 45 | + # 5. Run Playwright tests |
| 46 | + - name: Run Playwright tests |
| 47 | + run: npx playwright test |
| 48 | + env: |
| 49 | + CI: true # Triggers CI-specific config (retries, workers, etc.) |
| 50 | + # This uses settings from playwright.config.ts: |
| 51 | + # - retries: 2 (auto-retry flaky tests) |
| 52 | + # - workers: process.env.CI ? 8 : undefined (8 parallel workers) |
| 53 | + # - trace: 'retain-on-failure' (capture debug artifacts) |
| 54 | + |
| 55 | + # 6. Upload HTML report (on failure, so you can debug) |
| 56 | + - name: Upload Playwright Report |
| 57 | + uses: actions/upload-artifact@v4 |
| 58 | + if: always() # Upload even if tests fail |
| 59 | + with: |
| 60 | + name: playwright-report |
| 61 | + path: playwright-report/ |
| 62 | + retention-days: 30 # Keep artifacts for 30 days |
| 63 | + # Access: Go to Actions → Workflow run → Artifacts → Download |
| 64 | + |
| 65 | + # 7. Upload test results (traces, screenshots, videos) |
| 66 | + - name: Upload Test Results |
| 67 | + uses: actions/upload-artifact@v4 |
| 68 | + if: failure() # Only upload on test failures (saves storage) |
| 69 | + with: |
| 70 | + name: test-results |
| 71 | + path: test-results/ |
| 72 | + retention-days: 7 # Shorter retention (larger files) |
| 73 | + # Contains: |
| 74 | + # - trace.zip (full execution trace, viewable in Playwright Trace Viewer) |
| 75 | + # - screenshots (on-failure only, per config) |
| 76 | + # - videos (on-failure only, per config) |
| 77 | + |
| 78 | +# MIGRATION STORY CONTEXT: |
| 79 | +# |
| 80 | +# Old CI (Jenkins + Selenium): |
| 81 | +# - 2-hour runtime (sequential execution) |
| 82 | +# - Manual re-runs for flaky tests |
| 83 | +# - Only screenshots on failure (no trace/video) |
| 84 | +# - Complex Jenkins pipeline config |
| 85 | +# |
| 86 | +# New CI (GitHub Actions + Playwright): |
| 87 | +# - 15-minute runtime (8 parallel workers) |
| 88 | +# - Auto-retry flaky tests (retries: 2) |
| 89 | +# - Rich artifacts (trace viewer, video, screenshots) |
| 90 | +# - Simple YAML config (this file) |
| 91 | +# |
| 92 | +# RESULT: |
| 93 | +# - 40% faster feedback (2hr → 15min) |
| 94 | +# - Zero false negatives (auto-retry eliminates flakiness) |
| 95 | +# - Better debuggability (trace viewer shows every action/assertion) |
| 96 | +# - Per-PR testing enabled (fast enough for every PR) |
| 97 | + |
| 98 | +# ADVANCED CONFIGURATIONS (Optional): |
| 99 | +# |
| 100 | +# 1. Matrix strategy (test multiple Node versions): |
| 101 | +# strategy: |
| 102 | +# matrix: |
| 103 | +# node-version: [18, 20, 22] |
| 104 | +# steps: |
| 105 | +# - uses: actions/setup-node@v4 |
| 106 | +# with: |
| 107 | +# node-version: ${{ matrix.node-version }} |
| 108 | +# |
| 109 | +# 2. Sharding (split tests across multiple jobs): |
| 110 | +# strategy: |
| 111 | +# matrix: |
| 112 | +# shard: [1, 2, 3, 4] |
| 113 | +# steps: |
| 114 | +# - run: npx playwright test --shard=${{ matrix.shard }}/4 |
| 115 | +# |
| 116 | +# 3. Browser matrix (Chromium + Firefox + WebKit): |
| 117 | +# First, update playwright.config.ts to define multiple projects |
| 118 | +# Then CI will automatically run all projects in parallel |
| 119 | +# |
| 120 | +# 4. Deploy preview environment: |
| 121 | +# - name: Deploy preview |
| 122 | +# run: | |
| 123 | +# # Deploy to staging/preview URL |
| 124 | +# # Update baseURL in playwright.config.ts |
| 125 | +# # Run tests against preview |
| 126 | +# |
| 127 | +# 5. Slack/Teams notifications on failure: |
| 128 | +# - name: Notify on failure |
| 129 | +# if: failure() |
| 130 | +# uses: 8398a7/action-slack@v3 |
| 131 | +# with: |
| 132 | +# status: ${{ job.status }} |
| 133 | +# webhook_url: ${{ secrets.SLACK_WEBHOOK }} |
| 134 | + |
| 135 | +# COST OPTIMIZATION: |
| 136 | +# - Use 'npm ci' instead of 'npm install' (faster, deterministic) |
| 137 | +# - Install only needed browsers (chromium vs all three) |
| 138 | +# - Upload artifacts only on failure (saves storage) |
| 139 | +# - Set retention-days to balance debuggability vs cost |
| 140 | +# - Use matrix sharding only if tests take > 30min |
| 141 | + |
| 142 | +# SECURITY BEST PRACTICES: |
| 143 | +# - Never commit secrets (use GitHub Secrets) |
| 144 | +# - Use actions/checkout@v4 (pinned major version) |
| 145 | +# - Review action permissions (GITHUB_TOKEN scope) |
| 146 | +# - Use 'npm ci' to avoid supply chain attacks (uses lock file) |
0 commit comments