18.2The 15-Minute Technical Overview

Use this for technical interviews or architecture discussions.

Part 1: Problem Statement (2 min)

"Traditional browser test automation has three problems:

1. Maintenance burden — When the UI changes, every affected test breaks. Teams spend 40-60% of their time maintaining tests, not writing new ones.

2. Brittleness — Tests depend on exact CSS selectors. A simple HTML restructuring breaks dozens of tests.

3. No reasoning — When something unexpected happens (a modal appears, a redirect occurs, a loading spinner takes longer), traditional tests just fail. A human tester would handle it.

AI agents solve all three — they can reason about the UI, adapt to changes, and handle unexpected states."

Part 2: Architecture (5 min)

"Three layers, each with a clear responsibility:

Test Definitions (Markdown plans — specs/):

## Scenario: Login with valid credentials
1. Navigate to the login page
2. Enter valid email and password
3. Submit the form
Expected: dashboard loads with the user's name visible

Agent Layer (coding agent + browser skill):

• The skill is a ~100-line SKILL.md generated by playwright-cli install --skills
• Loaded once into context; commands run through the shell
• The agent reads the plan, executes, verifies against fresh snapshots

Browser Layer (playwright-cli → Playwright engine):

• Snapshots and screenshots saved to .playwright-cli/ on disk — not streamed into context
• Element refs from YAML snapshots (fill e8 "text"), no selector authoring
• Full Playwright auto-wait and actionability underneath
• Named sessions (-s=admin, -s=customer) for parallel isolated contexts

Why CLI skills over MCP:

• ~4x lower token cost per task (Microsoft's benchmark: ~27k vs ~114k), up to 10x on long sessions
• The agent reads page state on demand instead of receiving it on every action
• Composable with other CLI tools in shell pipelines
• Microsoft now recommends this path over their own MCP server for coding agents"

Part 3: Self-Healing (3 min)

"When an interaction fails:

Tier 1 — Re-snapshot and rediscover: the agent takes a fresh snapshot and matches the element by role and accessible name. Cheap; handles most failures.

Tier 2 — Screenshot + state reasoning: catches loading issues, redirects, unexpected modals.

Tier 3 — Playwright's healer agent: replays the failing step against the live app, patches locators/waits/data, reruns until green — or concludes the app itself is broken. That verdict is the difference between self-healing and bug-hiding.

We track healing events. High healing on one test = stale assumptions (update the plan). Frequent healing across tests = a UI refactor happened. Every healer patch goes through code review."

Part 4: CI/CD (3 min)

"GitHub Actions with matrix strategy:

• Headless browsers, fresh isolated sessions per test group
• 4-5 parallel test groups
• Failure artifacts: screenshots, snapshots, command log, and the full Playwright trace with network capture — the audit trail of what the agent did
• JUnit XML for dashboard integration
• Healer runs as a follow-up job on failures; its patches arrive as PRs, not silent fixes"

Part 5: Results (2 min)

"Key outcomes:

• Test maintenance time reduced dramatically (agent adapts instead of breaking)
• Test reliability >98% (actionability checks eliminate most flakiness)
• New tests written as natural-language plans a product owner can review
• Failure debugging time reduced (trace + agent reasoning vs stack traces)"