How to report a bug so AI fixes it: errors and screenshots that work
Describe a bug to AI in five parts, find errors in the browser Console and your app's log on BrewInTH, use screenshots well, and fix one thing at a time.
The site your AI built is live, but when you actually use it the Save button does nothing, the list page is empty, or the menu overlaps on a phone. You type "the button doesn't work, please fix it". The AI says it's fixed. You try again: same thing. Three or four rounds later you're still there.
Most of the time the AI isn't the problem. It simply can't see what you see. This article shows how to describe a bug so the AI gets it the first time: what to include, where the error messages hide, which screenshots help, and how to instruct the AI so it fixes the right thing without breaking anything else.
In short
✅ Describe a bug in five parts: what you did, what you expected, what happened, the error message, and where it happened
✅ The error the AI needs is usually in the browser Console (press F12) or in your project's Logs tab
✅ Screenshots are great for layout problems, but always copy errors as text too
✅ Ask the AI to explain the cause before fixing, fix one thing at a time, and check the live site after deploying
✅ Three rounds without progress? Stop, and start again with better information
Why "the button doesn't work" isn't enough
"The button doesn't work" can mean a dozen different things. Nothing happens when you click. It spins forever. A red error appears. It says saved, but nothing reaches the database. Or the button never shows up. Each has a different cause, some in the page, some on the server.
When the information is thin, the AI guesses and fixes the most likely spot. If the guess is wrong it fixes the wrong thing, and sometimes it rewrites code that was working fine. Giving complete information up front is the fastest route.
Describe the bug in five parts
- What you did, as steps someone else could repeat: "Sign in as admin › Products › Add product › enter a name and price › Save".
- What you expected: "The new product appears in the list."
- What actually happened: "The button spins for 5 seconds, then stops. The list doesn't change."
- The error message, copied in full. Don't paraphrase it (the next section shows where to find it).
- Context: which page (send its link), computer or phone, which browser, every time or only sometimes, and what you changed right before it started.
That last point matters more than it looks. If the bug appeared right after a new feature, say so. The AI will start with the code that just changed instead of combing through the whole project.
Where the errors are: three places to look
1. The browser Console (problems in the page)
On a computer, open the broken page in Chrome or Edge, press F12 (Cmd + Option + I on a Mac) and choose the Console tab. Repeat the steps that trigger the bug. The red lines that appear are exactly what the AI wants. Right-click and copy them, or select them and copy as text.
2. The Network tab (data that fails to send)
In the same panel, choose Network and repeat the steps. Look for rows in red, or a Status of 4xx or 5xx. Tell the AI which request (the Name column) got which status. If clicking the row shows text under Response, copy that too.
- 4xx (401, 403, 404…) usually means permissions, sign-in, or a wrong API address.
- 5xx (500, 502…) means the server side failed, so check the app's log next.
3. Your project's Logs tab (server-side errors)
For sites with a running app (Node.js, PHP, Python and so on), open the project on BrewInTH, go to the Logs tab and press Fetch logs. Do it right after you trigger the bug so the newest error is included. Copy the part with "error" or "exception" plus a few lines around it. (Static sites have no Logs tab, because no app is running; use the browser Console instead.)
If you work with an agent-style AI on your computer (Claude Code, Codex, Cursor, Windsurf) connected through the project's link and token, it can read the app's log itself with the logs_tail tool and have the platform open the live page with site_check. You don't need to copy server logs. But the AI can't see your browser Console, so those errors you still copy across.
Screenshots: when they help and how to send them
Screenshots are ideal for layout problems: text spilling out of a box, buttons on top of each other, unreadable colours, a page that falls apart on a phone. To make them useful:
- Capture the whole screen so the AI sees the context, not a tiny crop.
- Circle or point at the problem with your device's markup tool and write what it should look like.
- For phone problems, give the phone model or screen width; the AI needs to know which size to fix.
- If you have an example of how it should look, send that picture alongside.
But never send an error only as a picture. Text in an image can be misread or cut off, and the AI can't search the code for it. Copy the error as text and add the picture if it helps.
A message you can copy and adapt
My site on BrewInTH has a bug. Please find the cause and fix it.
What I did: signed in as admin › Products › Add product › name "Iced coffee", price 45 › Save
Expected: the new product appears in the list
What happened: the button spins, then stops; the list doesn't change. Every time.
Page: https://<site-name>.host.brewinth.net/admin/products (Chrome on a computer)
Started after: we added the product picture field yesterday
Console: <paste the red lines>
Network: POST /api/products returned 500
App log: <paste the part with the error>
Steps:
1. Explain the cause in plain words before changing anything.
2. Fix only this. Do not delete or wipe any data in the database.
3. Deploy, then check this page on the live site with the same steps.
4. If it isn't fixed after 3 rounds, stop and summarise what you tried.Send it in the same chat where the AI built the site; it already knows the project's structure. If the old token has expired, press Create the AI link and token (automatic) on the project page and use the Continue earlier work (the old token expired) box: copy the short message into the old chat.
Loop until it's fixed, not forever
- One bug at a time. Found four problems? Send them one by one, or number them and have the AI fix and check each in turn. Fixing everything at once makes it impossible to tell what broke what.
- Check with the same steps. When the AI says it's done, repeat step 1 on the live site. If it still fails, send the new error back. A changed error usually means you're getting closer.
- Hard refresh first. Your browser may still use old files. Press Ctrl + Shift + R (Cmd + Shift + R on a Mac) before deciding it isn't fixed.
- Three rounds, then stop. Ask the AI to summarise what it tried, then start a fresh chat or round with that summary and better information. It beats letting the AI pile fix on top of fix.
- The site is needed now? If the bug came with the latest deploy, go to Releases › Release history and press Restore this release on the previous version first. Restoring changes the code only; it doesn't roll back data in the database.
Careful: don't send secrets along with the error
Logs and screenshots sometimes contain things that shouldn't travel. Check before you paste them to an AI or send them to anyone:
- Passwords, API keys, the project's token, or values from App settings: delete them or replace them with
***. - Your customers' personal details on screen, such as names, phone numbers and addresses: blur them first.
- If you've already sent an API key by accident, create a new key with that provider and update it in App settings.
FAQ
How do I press F12 on a phone?
Phone browsers don't open a Console the way computers do. If the bug only happens on a phone, send a screenshot with the steps, then open the same page on a computer in mobile view (F12 has a button that switches the screen size). If the bug shows up there too, copy the error from there.
The Console is full of errors. Which one do I send?
The first one that appears after you press the broken button; earlier lines may be about something else. If you're unsure, clear the Console with its clear icon, repeat the steps, and only the related errors remain.
I use ChatGPT in the browser, with no link and token. What then?
The same method works. Describe the bug in five parts, paste the errors and logs, and ask the AI for the corrected files. Then upload them to the same project on the Upload & go live page; it updates the existing site rather than creating a new project.
The deploy fails altogether, it isn't a bug in the page
Then look at the release log instead. See Deploy failed or site slow? Let AI read the logs and fix it.
I've tried everything and it's still broken
Open Customer support in the console, attach the screenshot and the error, and name the project. The team can take a look.
Summary
AI fixes bugs fast when it sees what you see. Describe the bug in five parts, copy errors from the browser Console and the app log as text, use screenshots for layout problems, and ask the AI to explain before fixing, fix one thing at a time, and check the live site every time.