6. Building a Feedback Loop

Why feedback loops matter

Last year, I asked Claude to build a feature for a Chrome Extension I was building - display a number as a badge on the extension icon. It finished, told me everything looked good, and the TypeScript compiler agreed. No type errors, no lint warnings. Then I opened the browser. The outcome was way off because the agent had no way to know whether the right number and style is displayed on the extension icon.

That single experience changed how I think about agent assisted development. Your type checker cannot tell you that a certain number is displayed as white text color on a red background in the icon badge.

Do you remember the agentic loop you've learned in Chapter 2? The final and the most important stage of the loop is "Verification". In this Chapter and the next, you'll focus entirely on the verification stage of the loop and extend the verification stack that you started building in the previous chapter: Guardrails for Quality.

Guardrails that only check code structure miss an entire class of bugs:

• Visual regressions - wrong colors, broken layouts, misaligned elements
• Runtime exceptions - errors that only surface during execution, not at compile time
• Broken API responses - incorrect data, wrong status codes, malformed payloads
• Layout shifts - elements jumping around after render
• Race conditions - double submissions, stale closures, out-of-order responses
• Accessibility failures - broken screen reader flow, keyboard dead-ends, missing ARIA labels
• Empty state rendering - zero items, null user, missing images showing a blank or broken page
• Network degradation - infinite spinners on slow connections, no offline error state
• Mobile interaction bugs - gesture conflicts, keyboard pushing content off-screen, safe area overlap

The fix is not a single tool. It is a full verification stack.

• Browser MCPs and skills (Playwright, Chrome DevTools, playwright-cli, agent-browser) give Claude eyes.
• Your documentation discovery skills and Context7 MCP help the agent make accurate library calls, by using updated and relevant docs so Claude stops hallucinating deprecated APIs.
• Verbose logging system and custom hooks give Claude ears in the right context and user scenario.
• Your backend systems running in containers and MCPs or skills providing access to them give Claude a way to verify your data and business logic.
• Screenshots, interactive gifs, and mobile emulators let Claude verify across every channel your users actually touch.
• Accessibility auditing tools (axe-core, Lighthouse CI) catch screen reader failures, missing labels, and contrast violations that no visual check reveals.
• Network simulation through browser throttling and offline modes lets Claude verify how your app behaves on slow connections and disconnected states.
• Test data and state seeding give Claude the ability to set up edge cases (empty databases, expired tokens, null fields) before verifying how the UI handles them.

Chapters 1 through 5 gave Claude the ability to write correct code. This chapter gives Claude the ability to see what that code actually does, catch what went wrong, and fix it without waiting for you.