How to Cache Playwright Browsers in GitHub Actions

Playwright downloads hundreds of megabytes of Chromium, Firefox, and WebKit on every fresh runner.

Cache ~/.cache/ms-playwright, keyed on the Playwright version from your lockfile, and only run --with-deps on a cache miss.

Steps

• Resolve the Playwright version (e.g. from package-lock.json) into the cache key.
• Cache ~/.cache/ms-playwright with that key.
• Run npx playwright install --with-deps only when the cache missed.
• Always run install-deps so system libraries are present even on a hit.

Workflow

jobs:
  e2e:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v4
      - uses: actions/setup-node@v4
        with:
          node-version: '20'
      - run: npm ci
      - uses: actions/cache@v4
        id: pw
        with:
          path: ~/.cache/ms-playwright
          key: ${{ runner.os }}-pw-${{ hashFiles('package-lock.json') }}
      - if: steps.pw.outputs.cache-hit != 'true'
        run: npx playwright install --with-deps
      - if: steps.pw.outputs.cache-hit == 'true'
        run: npx playwright install-deps
      - run: npx playwright test

Gotchas

• Browser binaries are version-pinned; key on the Playwright version or you will run stale browsers.
• System dependencies are not cached, so still run install-deps on a hit.
• Latchkey keeps the browser cache warm so e2e suites start cheaper and re-run flaky tests automatically.

Related guides