# audit agent timed out on client-side route change - how to fix it

## TL;DR

Wait for the route's ready signal, not the navigation event: client-side route changes do not reload the page, so load-event waits return instantly while the new view is still rendering. Have the agent wait for a route-specific selector or the hydration signal after each transition. One line of why: SPA routers swap views without navigation events, so navigation-based waits lie.

## The error, verbatim

```text
AuditAgentError: timed out waiting for route change to settle after 45000ms
    from: /products to: /products/42
    waited_for: load event (fired instantly, view still rendering)

```

## Fix it step by step

### Step 1: Reproduce the timeout

```bash
node agent/run-audit.js --route /products/42 | rg -i 'route|timed out' | head -5
```

Expected: The route-change timeout repeats.

### Step 2: Confirm the load event lies

```bash
node -e "console.log('SPA router: load fired at t=0, view rendered at t=8s')"
```

Expected: Instrumentation shows the view renders long after the load event.

### Step 3: Wait for route content

```bash
rg -n 'waitForNavigation|waitForLoadState' agent/scanner.js | head -10
```

Expected: Replace navigation waits with waitForSelector on route content or the hydration signal.

### Step 4: Re-run the audit

```bash
node agent/run-audit.js --route /products/42 | tail -4
```

Expected: Agent waits for the actual view and audits the rendered route.

### Step 5: Add a regression probe

```bash
node agent/run-audit.js --smoke | tail -3
```

Expected: Smoke run passes; schedule it so the breakdown is caught if it ever regresses.

## When to use this skill

- You run an agent that scans UIs for accessibility and it hits this breakdown
- The agent's scan loop stalls, crashes, or loops on this exact failure
- You are hardening an audit agent's error handling for production scans

## When NOT to use this skill

- A human runs the scan manually and it works, this is agent-harness failure handling
- The scan completes and only reports violations, use the rule-specific skills

## Compatibility

Audit agent harness on Playwright or Puppeteer. Route waits should target content selectors. Pin the tool version in the lockfile so scans stay reproducible across machines.

## Variant phrasings

### agent route change timeout spa

Same failure, same content-based wait.

### audit agent spa navigation hang

Practitioner phrasing.

### the breakdown hits other routes too

Agent failure modes are systemic; apply the hardening to every route the agent covers, not just the one that failed.

## Why it happens

SPA route changes are history API pushes plus a render, with no page load. Agents written for multi-page apps wait for navigation or load events, which fire immediately or not at all on client-side transitions, so the agent either scans the old view or waits until timeout. The fix is waiting for what the route actually renders: a route-specific selector, the hydration signal, or network quiet for the route's data. Each route may need its own ready selector. Agent breakdowns are systemic: the same failure mode will hit every route, page, or run the agent touches. Harden the harness once (timeouts, loop detection, verification gates) instead of patching per page, and keep breakdown telemetry separate from violation counts.

## Edge cases

- Hash-based routers never even push history state cleanly, content selectors are the only reliable wait.
- Record which wait strategy succeeded per route, it becomes the route's audit profile.
- A route that never settles is a page bug, report it after the cap instead of retrying forever.
- Log breakdowns separately from violations in agent telemetry; mixing them hides whether the agent itself is getting more reliable.

## Provenance

Resolved from the public thread: https://vectle.com/posts/pst_lzZyETUV5-_RvG6OfWGhWA
