Replay Pipelines for Browser Agents

Modern browser automation has leapt from brittle E2E tests into autonomous agents that can navigate, extract, and transact. Yet the fundamental problems remain: tests are flaky, environments are non-deterministic, and DOMs drift with every deploy. If you want agents that learn reliably and CI pipelines that you trust, you need determinism as a first-class design constraint, not a hopeful byproduct.

This article details a concrete, opinionated blueprint for a CI/CD-ready deterministic replay pipeline centered on three pillars:

• DOM snapshots: capture a canonical view of the page state beyond the outerHTML.
• Network stubs: freeze the world, replay the exact bytes, and control the clock.
• Self-healing selectors: resist DOM drift without masking real regressions.

The result: dramatically fewer flakes, reproducible agent training, and faster deployment cycles.

Why Deterministic Replay Now

• LLM-powered browser agents consume terabytes of user interactions but fail to generalize if training data is noisy or inconsistent. Deterministic replays let you curate clean trajectories with known outcomes.
• CI gates are increasingly time-bounded. Flaky suites are expensive. The surest way to cut flake rates is to eliminate sources of nondeterminism: time, network, and UI concurrency.
• Product teams ship daily. DOMs drift weekly, CSS selectors break quietly, and experiments taper in and out. You need resilient, observable, and automated healing to keep signal high.

We’ll lean on primitives you already have: Chrome DevTools Protocol (CDP), Playwright or Puppeteer, HARs, and object storage. Where vendors differ, we prefer CDP and Playwright for their deterministic features:

• CDP Emulation.setVirtualTimePolicy (virtual time)
• Playwright’s routeFromHAR and recordHar
• CDP DOMSnapshot for deep DOM snapshots

References:

• Chrome DevTools Protocol: https://chromedevtools.github.io/devtools-protocol/
• Playwright HAR: https://playwright.dev/docs/network#replay-har
• DOMSnapshot domain: https://chromedevtools.github.io/devtools-protocol/tot/DOMSnapshot/

Architecture at a Glance

The pipeline has three stages, each with strict contracts.

1. Capture (from real traffic or guided sessions)

• Inputs: real user clickstreams or curated flows
• Outputs: event log, DOM snapshots, network trace with bodies, storage state (cookies, localStorage, IndexedDB), environment fingerprint (UA, viewport, timezone, locale), feature flags

2. Replay (in CI or training rigs)

• Inputs: capture bundle
• Deterministic mechanisms: virtual time, frozen randomness, network stubs, disabled animations, stable fonts, pinned browser build
• Outputs: pass/fail, DOM/state oracles, visual diffs, step timings, healing suggestions

3. Heal and Promote

• Inputs: replay discrepancies and selector failures
• Actions: apply self-healing selector updates with guardrails, produce diffs and PRs, flag real regressions, update baselines

Storage: use content-addressed blobs in object storage (e.g., S3) with a metadata index (Postgres/Parquet). Keep captures immutable; create new versions when promoting.

Capture: Turn Reality into a Deterministic Specimen

1) Clickstream modeling

Record user actions at the browser boundary, pointer, keyboard, wheel, scroll, and frame contexts. Capture:

• High-level intents: click, type, select, scroll, navigation
• Target element fingerprints: tag, id, classes, ARIA role, text, bounding box
• Timing: event timestamps and relative order
• Frame info: main frame vs OOPIF; origin and DOM path

Don’t capture raw mouse move noise; coalesce to discrete steps with reproducible pointer coordinates. Normalize to device-independent coordinates (CSS pixels). Keep scrolls explicit.

2) DOM snapshotting: beyond outerHTML

Plain outerHTML is insufficient. Modern apps depend on computed styles, pseudo-elements, shadow DOM, and paint order. Prefer CDP DOMSnapshot.captureSnapshot which provides:

• Nodes with attributes and layout
• DOM rects and paint order (for hit testing)
• Computed styles for requested CSS properties
• Shadow DOM support

Recommended properties to request: display, visibility, opacity, pointer-events, position, overflow, transform, z-index, content, font-family, color. You don’t need the entire style universe; pick the subset required for targeting and visual assertions.

When to snapshot?

• After each action that semantically changes the page (navigation, click that opens a dropdown, form submission)
• Once the event loop is quiescent: use network idle + RAF settle + microtask drain
• In CDP, combine Network idle with Emulation virtual time to force deterministic quiescence

3) Network capture with bodies

The replay will be only as deterministic as your network stubs. Use:

• Playwright context.recordHar with content: "embed" (captures request/response bodies)
• Or custom CDP Network.* handlers that store bodies (requires fetch interception)
• Include headers, cookies, status codes, and redirects

Special cases:

• WebSockets: log messages bidirectionally and stub them in replay (or fall back to an integration test environment that deterministically emits the same sequence)
• SSE: capture the event stream content
• Service workers: snapshot and on replay disable SW or stub via routeFromHAR before SW installs

Token volatility:

• If requests carry ephemeral auth tokens, either record the raw bytes (preferred for CI) or define a stable test account and capture the cookie jar. In production replay, redact secrets and re-mint tokens with a fixture service.

4) State capture: storage and environment

• Cookies: use context.storageState in Playwright
• localStorage, sessionStorage: enumerate in each frame
• IndexedDB: optional; if used for critical state, export via an injected script or the StorageInspector protocol
• Feature flags: capture evaluation results (the exact variant assignment). Prefer a test env with deterministic flag assignments.
• Environment fingerprint: UA string, viewport size, DPR, timezone, locale, fonts list, color scheme, reduced motion

5) Privacy by construction

• Redact PII from DOM snapshots by CSS selectors or heuristics (e.g., mask inputs of type=password/email)
• Redact request bodies for endpoints marked sensitive
• Store redaction manifests alongside captures; rehydrate masked fields during replay only if fixture data is present

Data Model and Serialization

Make captures portable and content-addressable. A simple structure:

• capture.json (metadata)
• events.ndjson (one event per line)
• dom/XXXX.json (CDP DOMSnapshot per step)
• network.har (embedded bodies)
• storage.json (cookies, storage state)
• env.json (UA, viewport, locale, timezone, fonts)

An example capture.json:

json
{
  "id": "cap_01HZY2K9H6Z9V7P4G7T1F7W9T3",
  "app": "checkout",
  "version": 12,
  "created_at": "2025-11-23T09:15:00Z",
  "browser": {
    "name": "chromium",
    "revision": "120.0.6099.28",
    "headless": true
  },
  "steps": [
    {"i": 0, "name": "visit_home", "dom": "dom/000.json", "ts": 0},
    {"i": 1, "name": "search_shoes", "dom": "dom/001.json", "ts": 947},
    {"i": 2, "name": "open_product", "dom": "dom/002.json", "ts": 2025}
  ],
  "network": "network.har",
  "events": "events.ndjson",
  "storage": "storage.json",
  "env": "env.json",
  "hash": "b2e24b...",
  "pii_redaction": {"enabled": true, "ruleset": "v3"}
}

Keep each DOM snapshot separately and gzip them. Use sha256 of content to deduplicate identical snapshots.

Replay: Make the Browser Boring

Deterministic replay means the only degrees of freedom are the ones you control: time, network, RNG, and scheduling.

Key principles:

• Virtual time: drive the clock with Emulation.setVirtualTimePolicy so timers, animations, and network progress deterministically advance only when you allow it.
• Frozen randomness: seed Math.random and crypto.getRandomValues.
• Stubbed network: responses return identical bytes with identical timing (or zero-latency if using virtual time).
• Stable rendering: disable animations, stabilize fonts, fix DPR/viewport, and pause WebGL/canvas if not needed.

Virtual time and event scheduling

Use CDP:

• Emulation.setVirtualTimePolicy with policy pause or pauseIfNetworkFetchesPending
• Advance time via Emulation.setVirtualTimePolicy budget increments or via Runtime.evaluate to progress timers

Example (TypeScript with Playwright’s CDP):

ts
import { chromium } from 'playwright';

const browser = await chromium.launch({ headless: true });
const context = await browser.newContext({
  viewport: { width: 1280, height: 800 },
  deviceScaleFactor: 1,
  timezoneId: 'UTC',
  locale: 'en-US'
});
const page = await context.newPage();
const cdp = await context.newCDPSession(page);

await cdp.send('Emulation.setVirtualTimePolicy', {
  policy: 'pauseIfNetworkFetchesPending',
  budget: 0,
  maxVirtualTimeTaskStarvationCount: 1000,
  waitForNavigation: true
});

Advance deterministically after dispatching each action:

ts
async function tick(ms: number) {
  await cdp.send('Emulation.setVirtualTimePolicy', {
    policy: 'advance',
    budget: ms
  });
}

Freeze randomness and time APIs

Inject on every new document:

ts
await context.addInitScript({
  content: `
    // Seeded RNG
    (function(){
      function mulberry32(a){return function(){var t=a+=0x6D2B79F5;t=Math.imul(t^t>>>15,t|1);t^=t+Math.imul(t^t>>>7,t|61);return ((t^t>>>14)>>>0)/4294967296;}}
      const rand = mulberry32(123456789);
      Math.random = rand;
      const orig = crypto.getRandomValues.bind(crypto);
      crypto.getRandomValues = (arr) => { const tmp = new Uint8Array(arr.length); for (let i=0;i<arr.length;i++) tmp[i] = Math.floor(rand()*256); arr.set(tmp); return arr; };
      const base = Date.parse('2025-01-01T00:00:00Z');
      Date = class extends Date { constructor(...a){ if (a.length) { super(...a); } else { super(base); } } static now(){ return base; } };
      const perf = performance;
      const start = 0; // virtual time 0
      perf.now = () => start;
    })();
  `
});

Note: In strict setups, prefer CDP virtual time over monkeypatching Date/performance. Many apps read both, so belt-and-suspenders is useful.

Disable animations and stabilize layout

• Emulate reduced motion: Emulation.setEmulatedMedia with reduced motion
• Inject CSS to pause animations and transitions

ts
await cdp.send('Emulation.setEmulatedMedia', { media: 'screen', features: [{ name: 'prefers-reduced-motion', value: 'reduce' }] });
await page.addStyleTag({ content: `* { animation: none !important; transition: none !important; }` });

Fonts and rendering:

• Use a pinned container image with stable font packages
• Set font-rendering flags if needed; disable GPU to avoid driver variability

Stub network exactly

Playwright’s HAR replay is straightforward:

ts
await context.routeFromHAR('network.har', {
  update: false, // read-only replay
  notFound: 'error'
});

For advanced control (e.g., WebSockets), implement a router that matches request URL+method+headers and returns stored bodies and timing metadata. Ensure content-encoding and transfer-encoding match originals. If using virtual time, you can compress latencies to 0 ms without nondeterminism.

Input injection: high-fidelity but simple

• Use page.dispatchEvent or page.mouse/page.keyboard with integer coordinates and deterministic scroll positions
• Avoid pixel-hunting; prefer semantic targeting by stable selectors or healed targets
• Ensure you activate the correct frame before dispatch

State restoration

• Load storage state: await context.addCookies and inject localStorage/sessionStorage before navigation
• Consider disabling service workers on replay: context.addInitScript to self.skipWaiting() and registration.unregister(), or route SW endpoints before registration installs

Validation oracles

Go beyond “no exception thrown”: validate meaningful invariants per step.

• DOM checksum: hash a stable projection of the DOM (tag/role/tree structure sans dynamic counters)
• Screenshot diff: optional, expensive; prefer diffing specific regions or accessibility tree outputs
• Network oracles: assert no unexpected outbound requests (especially to analytics)
• Accessibility: run aXe/ARIA checks to catch regressions that might break agents relying on roles

Self-Healing Selectors: Fight DOM Drift Without Lying to Yourself

Selectors break. You need a principled, observable healing system with guardrails, not a magic wand.

Principles:

• Prefer stable, semantic selectors first: data-testid, ARIA role+name, label associations, accessible description
• Maintain a selector chain with fallbacks (primary -> secondary -> heuristic)
• When healing, produce an explanation and a diff; require human promotion for test code updates

Element fingerprint

For each target element at capture time, store:

• Tag name, id, classes
• Role and accessible name
• Text content (normalized) and localization key if available
• DOM path context: k-hop ancestors (tag, role, id), sibling order
• Bounding box and visual anchors (nearest labeled element)
• Dataset attributes (data-testid, data-qa)

Heuristic healing algorithm

1. Candidate generation

• If data-testid present, query by it
• Else, query by role+name
• Else, query by tag+class subset
• Else, search all nodes of same tag

2. Scoring

• Features:
  • id exact match (binary)
  • Jaccard(class_set_original, class_set_candidate)
  • Levenshtein similarity of text content
  • Role equality
  • Ancestor similarity (common prefix length of CSS path)
  • Visual proximity to prior anchor nodes (if available)
• Weighted sum with calibrated weights

3. Thresholding and guardrails

• If top-1 score exceeds threshold and margin over top-2 is large, heal automatically for this run
• Otherwise, fail with a healing suggestion requiring review
• Never heal when the action semantics obviously diverge (e.g., candidate is disabled or hidden)

A compact TypeScript sketch:

ts
type Fingerprint = {
  tag: string;
  id?: string;
  classes: string[];
  role?: string;
  name?: string; // accessible name
  text?: string;
  ancestors: Array<{ tag: string; id?: string; classes: string[]; role?: string }>;
};

function jaccard(a: Set<string>, b: Set<string>) {
  const inter = new Set([...a].filter(x => b.has(x))).size;
  const union = new Set([...a, ...b]).size;
  return union ? inter / union : 0;
}

function scoreCandidate(fp: Fingerprint, el: Element): number {
  const tagScore = (el.tagName.toLowerCase() === fp.tag) ? 1 : 0;
  const idScore = fp.id && (el.getAttribute('id') === fp.id) ? 1 : 0;
  const classScore = jaccard(new Set(fp.classes), new Set(el.className.split(/\s+/).filter(Boolean)));
  const role = (el.getAttribute('role') || (el as any).role || '').toLowerCase();
  const roleScore = fp.role && role === fp.role ? 1 : 0;
  const text = (el.textContent || '').trim();
  const textScore = fp.text && text ? (1 - Math.min(1, levenshtein(fp.text, text) / Math.max(fp.text.length, 1))) : 0;
  const ancestorScore = commonAncestorScore(fp, el);
  return 2*idScore + 1.5*roleScore + 1.2*tagScore + 1.0*classScore + 0.6*textScore + 0.7*ancestorScore;
}

For DOM path similarity, compute the longest common prefix of tag/id/role tuples from the root.

ML alternative: train a candidate ranking model on historical drift labels with features above; a simple gradient-boosted tree often outperforms manual weights. You don’t need a full GNN unless your DOMs are very complex.

Guardrails

• Log each heal with features, score, and chosen selector
• Enforce visibility and interactability checks (computed style visibility/opacity/pointer-events and hit test via CDP)
• Cap automatic heals per run (e.g., at most 1 per scenario) to avoid masking systemic changes
• Generate a PR updating the test’s primary selector to the healed form after human review

Minimal Reference Implementation

Below is a scaffold using Playwright + CDP for capture and replay.

Capture script (Node/TypeScript)

ts
import { chromium } from 'playwright';
import fs from 'node:fs/promises';

async function captureFlow() {
  const browser = await chromium.launch();
  const context = await browser.newContext({
    recordHar: { path: 'network.har', content: 'embed' },
    viewport: { width: 1280, height: 800 },
    timezoneId: 'UTC',
    locale: 'en-US'
  });
  const page = await context.newPage();
  const cdp = await context.newCDPSession(page);

  const domSnaps: any[] = [];
  async function snapshotDOM(label: string) {
    const snap = await cdp.send('DOMSnapshot.captureSnapshot', {
      computedStyles: ['display','visibility','opacity','position','z-index','transform','pointer-events'],
      includeDOMRects: true,
      includePaintOrder: true
    });
    const file = `dom/${domSnaps.length.toString().padStart(3,'0')}.json`;
    await fs.mkdir('dom', { recursive: true });
    await fs.writeFile(file, JSON.stringify(snap));
    domSnaps.push({ label, file });
  }

  const events: any[] = [];
  function logEvent(e: any) { events.push({ ts: Date.now(), ...e }); }

  await page.goto('https://example.com');
  await snapshotDOM('home');
  logEvent({ type: 'nav', url: page.url() });

  // Example flow: click a link
  await page.click('a.more-info');
  await page.waitForLoadState('networkidle');
  await snapshotDOM('details');
  logEvent({ type: 'click', selector: 'a.more-info' });

  await fs.writeFile('events.ndjson', events.map(e => JSON.stringify(e)).join('\n'));
  const storage = await context.storageState();
  await fs.writeFile('storage.json', JSON.stringify(storage));
  await fs.writeFile('env.json', JSON.stringify({ ua: await page.evaluate(() => navigator.userAgent), viewport: { width: 1280, height: 800 }, timezone: 'UTC', locale: 'en-US' }));

  await browser.close();
}

captureFlow().catch(e => { console.error(e); process.exit(1); });

Replay script (Node/TypeScript)

ts
import { chromium } from 'playwright';
import fs from 'node:fs/promises';

async function replayFlow() {
  const storage = JSON.parse(await fs.readFile('storage.json','utf8'));
  const env = JSON.parse(await fs.readFile('env.json','utf8'));

  const browser = await chromium.launch({ headless: true });
  const context = await browser.newContext({
    storageState: storage,
    viewport: env.viewport,
    timezoneId: env.timezone,
    locale: env.locale
  });
  await context.routeFromHAR('network.har', { update: false, notFound: 'error' });

  await context.addInitScript({ content: `
    (function(){
      function mulberry32(a){return function(){var t=a+=0x6D2B79F5;t=Math.imul(t^t>>>15,t|1);t^=t+Math.imul(t^t>>>7,t|61);return ((t^t>>>14)>>>0)/4294967296;}}
      const rand = mulberry32(1337);
      Math.random = rand;
      const orig = crypto.getRandomValues.bind(crypto);
      crypto.getRandomValues = (arr) => { const tmp = new Uint8Array(arr.length); for (let i=0;i<arr.length;i++) tmp[i] = Math.floor(rand()*256); arr.set(tmp); return arr; };
    })();
  `});

  const page = await context.newPage();
  const cdp = await context.newCDPSession(page);
  await cdp.send('Emulation.setVirtualTimePolicy', {
    policy: 'pauseIfNetworkFetchesPending', budget: 0, maxVirtualTimeTaskStarvationCount: 1000
  });
  await cdp.send('Emulation.setEmulatedMedia', { media: 'screen', features: [{ name: 'prefers-reduced-motion', value: 'reduce' }] });
  await page.addStyleTag({ content: `* { animation: none !important; transition: none !important; }` });

  const events = (await fs.readFile('events.ndjson','utf8')).trim().split('\n').map(l => JSON.parse(l));

  for (const e of events) {
    if (e.type === 'nav') {
      await page.goto(e.url, { waitUntil: 'load' });
    } else if (e.type === 'click') {
      await page.click(e.selector, { timeout: 5000 });
    }
    // Advance virtual time between steps if needed
    await cdp.send('Emulation.setVirtualTimePolicy', { policy: 'advance', budget: 50 });
  }

  await browser.close();
}

replayFlow().catch(e => { console.error(e); process.exit(1); });

This is intentionally minimal. In a production implementation, add DOM oracles, healing, and comprehensive error reporting.

CI/CD Integration

A typical GitHub Actions matrix:

• Job: capture-on-merge

  • Trigger: nightly on main or on-demand by QA
  • Output: capture bundle artifact pushed to S3 with immutable hash

• Job: replay-on-PR

  • Trigger: pull_request
  • Steps:
    • Fetch latest promoted capture bundle
    • Launch pinned container image with Chromium revision and fonts
    • Run replay with virtual time and HAR
    • Produce:
      • JUnit XML with pass/fail
      • JSON diffs of DOM oracles
      • Healing suggestions and PR comments

• Job: promote-capture

  • Trigger: manual approval if healing remains within budget and diffs approved
  • Action: write a new capture.json version with updated selectors

Containerization recommendations:

• Base: mcr.microsoft.com/playwright:focal or official Chromium image + fonts
• Pin browser revision; avoid auto-updating Playwright runtime across jobs
• Disable GPU in CI to avoid driver differences (--disable-gpu)

Secrets and redactions:

• Never store real tokens in artifacts; use a token shim or fully stubbed network responses
• Validate that replay emits no unexpected egress (denylist analytics endpoints)

Parallelization and sharding:

• Shard replays by scenario
• Warm caches by pre-fetching capture bundles
• Measure per-step wall-clock; with virtual time and stubbed network, suites often run 3–10x faster

Agent Training with Deterministic Replays

Deterministic replays aren’t just for tests, they’re gold for agent training.

• Behavior cloning: train on stable trajectories where observation (DOM snapshot) to action (click/type) mapping is unambiguous
• Offline RL/OPE: deterministic environment simplifies off-policy evaluation; you can implement IPS or doubly robust estimators without confounding from drift
• Curriculum: start with frozen replays to teach basic skills; graduate to semi-live with controlled perturbations (minor DOM changes) to teach robustness

Observation space options:

• DOM graph features (tag, class, role, ARIA, text embeddings)
• Accessibility tree as a semantic graph
• Visual crops anchored by bounding boxes for agents with vision modules

Action space:

• Semantic actions: click role=button[name="Add to cart"] rather than pixel coordinates
• Controlled text inputs with expected value ranges

Label quality:

• Use the same selector healing features as supervision signals. If a healed selector was necessary, mark the step as “shifted,” and optionally downweight it during training.

Benchmarks and Expected Impact

Across mid-size web apps (50–200 critical flows):

• Flake rate: from 5–20% down to <1% when virtual time + network stubs + animation disablement are enabled
• Runtime: 3–10x faster CI runs due to zero-latency network and quiescent waits
• Maintenance: selector churn reduced by 60–80% with self-healing and data-testid adoption; reviewable diffs lower cognitive load

Your mileage will vary, but if you adopt only two things, virtual time and HAR replay, you’ll see immediate, material improvements.

Edge Cases and Gotchas

• Cross-origin iframes (OOPIF): healing and queries must be frame-aware; Playwright makes this manageable via frame.locator
• Experiment flags: randomization breaks determinism; lock flags to a known configuration in captures
• Fonts: subtle layout shifts can break hit testing; pin fonts in images and set font fallback
• Canvas/WebGL: determinism is tricky; disable if not essential, or stub draw calls
• Service workers: uninstall or pre-route before registration; otherwise they’ll intercept and violate your stub assumptions
• WebSockets: ensure you record and deterministically replay the message schedule; otherwise, segregate such flows into integration tests with a mocked server

Opinionated Guidance: What to Prefer and Why

• Use Playwright over Selenium for deterministic CI. Playwright’s HAR replay, built-in selectors, and CDP access make it the pragmatic choice.
• Prefer CDP DOMSnapshot over outerHTML dumps. You need computed styles and rects for robust oracles and hit testing.
• Make “data-testid” mandatory for critical actions. It’s the single highest ROI practice to prevent selector chaos.
• Embrace virtual time. It’s non-negotiable for determinism in timer-heavy SPAs.
• Do not auto-promote healed selectors without review. Healing should earn trust via transparency, not magic.

A Simple DOM Oracle Example

Stabilize a hash over a DOM projection:

ts
import crypto from 'node:crypto';

function domProjection(doc: Document): string {
  function walk(n: Node): string {
    if (n.nodeType !== 1) return '';
    const el = n as Element;
    const tag = el.tagName.toLowerCase();
    const role = el.getAttribute('role') || '';
    const id = el.id ? 'id' : '';
    const cls = [...el.classList].filter(c => !/^\w+-\d+$/.test(c)).sort().join('.'); // drop numeric suffixes
    const kids = Array.from(el.children).map(walk).join('');
    return `${tag}#${id}.${cls}[${role}](${kids.length})` + kids;
  }
  return walk(doc.documentElement);
}

function domHash(doc: Document): string {
  const p = domProjection(doc);
  return crypto.createHash('sha256').update(p).digest('hex');
}

On replay, compute the hash post-step and compare to the captured baseline. Allow small tolerated diffs if you expect benign UI change; otherwise flag.

Costs, Storage, and Scaling

• DOM snapshots: 200–800 KB gzipped per step depending on CSS properties included
• HAR with bodies: typically 1–10 MB per flow; compress further with zstd if storing outside HAR
• Total per 100 flows with 5 steps each: ~1–5 GB per version

Scaling tips:

• Deduplicate identical DOM snapshots and responses by sha256
• Store blobs in S3 with hash-based paths; index metadata in Postgres/SQLite for CI lookup
• Prune old versions via retention policies but keep golden baselines per release

Putting It All Together

1. Record realistic flows as capture bundles
2. Store them immutably
3. Replay in CI with virtual time, frozen randomness, and HAR stubs
4. Validate with DOM oracles; when selectors break, apply guarded healing
5. Promote updates after review; retrain agents on clean, deterministic trajectories

Do this, and your browser agents get a stable gym to learn in, your CI behaves like a metronome, and your team spends time on features, not chasing flakes.

The web is inherently dynamic; your tests and agents don’t have to be. Determinism is a choice. Build for it.