Tool #10 · What we build with · How we work

Browser, Accessibility & Speed GatesPlaywright + axe-core + Lighthouse CI

Every change passes multi-engine browser checks, WCAG accessibility scans, and mobile speed budgets before it deploys.

Last reviewed: 2026-10-22 · Status: How we work

Full stack receipt#10 · How we work · reviewed 2026-10-22
#10Browser, Accessibility & Speed Gates

Playwright + axe-core + Lighthouse CI

How we work
1. What we use it for: We wire Playwright, axe-core, and Lighthouse CI into GitHub Actions so every pull request must pass real browser rendering, accessibility scans, and mobile performance budgets before going live.
2. Client use case · A members' dinner clubState: live
Problem

When coding agents author 136 commits in three days, subtle mobile layout breaks, contrast failures, or slow hero images will reach production unless automated browsers block bad merges.

What the tool did

Configured Playwright 1.63 + axe-core 4.13 to run 324 browser checks (Chromium, WebKit, and Firefox across 4 viewport widths on all 27 routes), 54 axe accessibility scans, and Lighthouse 13.5 performance gates in CI.

Result

Blocked layout and contrast regressions before merge, pushed home-page mobile Lighthouse scores from 97 to 99, and cut one article’s lab Largest Contentful Paint from 10.65s to 1.58s (score 75 to 100).

2. Client use case · A print and signage companyState: live
Problem

All 49 static pages migrated off Wix needed automated cross-browser smoke tests, accessibility verification, and mobile speed budgets on every pull request.

What the tool did

Added `tests/a11y.mjs` (Playwright + axe-core across Chromium, WebKit, and Firefox) and `lighthouserc.json` mobile budget checks on 5 core page templates inside `.github/workflows/ci.yml`.

Result

Live in CI on every PR, followed by a post-deploy check confirming the live site serves the approved commit SHA.

3. What it costs us or the client

$0 for Playwright, axe-core, and Lighthouse CI (all open source), running on standard GitHub Actions runners ($0 within included repo minutes) (as of 2026-10-22).

4. Setup notes (how it is wired in)

GitHub Actions builds the production site once, boots a local server in CI, runs Playwright across Chromium/WebKit/Firefox at 4 viewport widths with `@axe-core/playwright` and `lhci autorun` (`lighthouserc.json`), deploys the exact build artifact, and verifies the `x-build` SHA header on the live domain.

5. What broke & how it was handled

Running 324 browser checks plus Lighthouse on every push slowed feedback loops, so we added changed-path test selection in `.github/workflows/ci.yml`. More importantly, green DOM and axe checks did not catch that CallRail’s external script missed `fetch`-based `/join` submissions or that GTM fired duplicate GA4 `page_view` events—teaching us to pair DOM checks with network-beacon assertions.

6. What we compared it against & why we picked it

Compared against manual Chrome click-testing and unit-only Jest/Vitest tests (which never catch Safari/WebKit overflow, WCAG contrast violations, or 10-second mobile LCP regressions). We picked Playwright + axe-core + Lighthouse CI because it tests the real rendered DOM across all three browser engines.

7. Last reviewed: 2026-10-228. Video / tutorial: Featured in Episode 3 (Wix cutover CI gates) and Episode 4 (Browser gates for AI coding agents)
All stack tools
How an engagement runsthree steps, in order

Three separate steps. Stop after any of them.

Step 1 is a free 15-minute fit call. Step 2 is the AI Staff Assessment, $500, a written assessment you keep. Step 3 is your first hire at a published price, or you take the assessment and stop.

Step 1

Fit call

$0 · 15 min
  • tell me which job eats your week: the phone, the inbox, marketing or support
  • I tell you whether an AI hire fits, and whether I am the right person for it
  • you leave with the first hire I would start with
  • a slide deck

video call · same week

book it
Step 2

AI Staff Assessment

$500
  • a 60-minute video call about how your business runs
  • my written assessment the same day: whether an AI hire would pay for itself, the job I would hand off first, what to settle first, and the fixed price for that first hire
  • not taken off the build, and no separate quoting call: the assessment names the package at its published price
  • proposals written before anyone learned your business

paid when you book · not taken off the build

start here
Step 3

Your first hire

fixed price
  • Front Desk Hire or Brain + First Hire, at the published price
  • built in 2 to 6 weeks, then 30 days of tuning
  • or take the assessment and stop there
  • bench developers you never met

priced in the assessment

see the prices

Want Playwright + axe-core + Lighthouse CI wired into your business?

Bring the workflow or codebase to a free 15-minute fit call. We will tell you how we wire Playwright + axe-core + Lighthouse CI in production, what breaks first, and whether a $500 AI Staff Assessment fits your scope.

Book a 15-minute fit call
or email david@nexaiadvisors.com about Playwright + axe-core + Lighthouse CI