Module 5 of 5

CI/CD Integration

Run Playwright tests automatically on every code push using GitHub Actions.

🤖 GitHub Actions Workflow

Add this file to your repo and Playwright tests will run on every pull request and push to main.

.github/workflows/playwright.yml
YAML
name: Playwright Tests

on:
  push:
    branches: [main, develop]
  pull_request:
    branches: [main]

jobs:
  test:
    timeout-minutes: 60
    runs-on: ubuntu-latest

    steps:
      - uses: actions/checkout@v4

      - uses: actions/setup-node@v4
        with:
          node-version: 20

      - name: Install dependencies
        run: npm ci

      - name: Install Playwright Browsers
        run: npx playwright install --with-deps

      - name: Run Playwright Tests
        run: npx playwright test

      - name: Upload Test Report
        uses: actions/upload-artifact@v4
        if: always()   # Upload even on failure!
        with:
          name: playwright-report
          path: playwright-report/
          retention-days: 30

⚡ Parallel Execution & Sharding

Run tests 4x faster by splitting them across multiple machines (shards).

playwright.config.ts
import { defineConfig } from '@playwright/test';

export default defineConfig({
  // Run tests in 4 workers in parallel locally
  workers: process.env.CI ? 2 : 4,

  // Retry failed tests once in CI (flakiness protection)
  retries: process.env.CI ? 2 : 0,

  reporter: [
    ['html'],           // HTML report
    ['github'],         // GitHub Actions annotations
    ['json', { outputFile: 'results.json' }],
  ],
});
Sharding across 4 CI machines
# Machine 1 runs 25% of tests
npx playwright test --shard=1/4

# Machine 2 runs 25% of tests
npx playwright test --shard=2/4

# ... and so on. All run in parallel!
📊

HTML Reports

Beautiful test reports with screenshots, videos, and traces. Auto-uploaded as GitHub artifacts.

🎥

Trace Viewer

When a test fails in CI, use `npx playwright show-trace trace.zip` to replay every action.

📦

Cache Browsers

Cache the Playwright browser binaries in CI to save 2-3 minutes on every run.

đź””

Slack Notifications

Add a Slack notify step at the end — get instant alerts when tests fail in production.

🎉 Course Complete!

You've mastered Playwright from zero to CI/CD integration. Now test your skills in our interactive playground and earn your certificate!

📝 Module Quiz

Test Your Knowledge

Score 70%+ to advance to the next module

Question 1 of 4
0 answered

Q1. In GitHub Actions, what does `if: always()` do on the "Upload Report" step?

Q2. What is test sharding in Playwright?

Q3. Which reporter format is most useful for debugging CI failures?

Q4. How many retries should you typically set in CI to handle flaky tests?