Vibe coding compendium
How to debug AI-generated code without an endless prompt loop
Stop adding fixes until you have a repeatable failure. Record the expected and actual behavior, trace where they diverge, and change the smallest part supported by that evidence.
Make the failure repeatable
Record the page, user state, input, action and visible result. Include the relevant error with secrets removed. “The save button fails for a new account after refresh” gives an investigation a useful starting point.
Check whether the failure happens locally, in the hosted app or both. Missing runtime configuration can look like faulty application logic.
Trace one request
Follow the browser event to the request, server validation, permission check and storage operation. Compare the response with the UI state. A success message with no persisted record is a different bug from a request rejected before it reaches storage.
Ask the agent for its explanation and the observations that support it. If it cannot reproduce the problem, record that limitation instead of treating a speculative patch as a confirmed fix.
Verify the fix at the right boundary
Use a regression test when it protects meaningful behavior. For an account leak, test the actual access boundary; for layout clipping, inspect the rendered page at the affected width.
Repeat the original failure, the normal path and one nearby edge case. Remove test fixtures and preserve unrelated user data. Keep the fix in a reviewable change.
When to restart the investigation
If each patch creates another failure, return to the last understood state. Reduce the reproduction and inspect the original assumption. Add a short project note explaining the cause so a later session does not rediscover it.
Sources and scope
These are original Wantlist explanations. Product descriptions use official sources; practical checklists reflect our implementation and editorial judgment. They are not a comparative tool benchmark or a security certification.