Guides

How to write a bug report for an AI coding agent

A bug report for an AI coding agent says where the bug is, what you did, what happened, what you expected, and whether the fix is for this spot or everywhere, with a marked screenshot and any error text.

Updated

AI coding agents like Claude Code, Codex and Cursor are fast at changing code. They are slow at guessing. Every gap in your report turns into a search through files, a wrong fix, or a question back to you. A good report closes the gaps before they open.

The template

Select the block below, copy it into a note, and fill it in each time. Delete any line you can't fill.

Page/URL: (address, like localhost:3000/settings)
What I did: (what you clicked or typed, in order)
What I expected: (what should have happened)
What happened: (what you saw instead)
Scope: (only this page / everywhere this appears)
Element: (the button, card or field, by its visible text or position)
Errors: (red lines from the browser console, as text)
Screenshot path: (like screenshots/save-button.png, broken part boxed)

The screenshot path line is there because a file in your project always reaches the agent, even when pasting an image fails. If paste is giving you trouble, see why a screenshot won't paste into Claude Code or Cursor.

Each line, and why the agent needs it

Page/URL

The address is the cheapest clue there is. Routes usually match file or folder names, so /settings points the agent at a settings page file before it searches anything.

What I did

Write them like a recipe. "Add two items, open the cart, change the first to 3." Even an agent that can open a browser starts on a fresh page, so the steps are how it gets to the state yours was in.

What I expected

This is the line that matters most. "Total should be $60" gives the agent a target it can test against. If it should look like something else in the app, say so: "like the cards on the home page".

What happened

Describe, don't diagnose. "The total stayed at $20" is better than "the state is broken". Your guess at the cause can send the agent the wrong way.

Scope

"Only on this page" or "every button like this". Without it, agents either ask, or pick one and sometimes pick wrong. See why your agent asks if a change is local or global.

Element

Name the exact thing that's wrong, by what it says or where it is: "the Save plan button under the cards". A page often has several buttons that look alike, and the agent can search the code for visible text.

Errors

Paste error text, not a picture of it. Text is exact and the agent can search for it. Here is how to copy console errors.

Screenshot path

A screenshot with the broken part boxed or circled, saved in your project, with its path in the report. You can paste the image too, but a path works in every terminal. Add your browser and screen size if it might matter. What browser am I using? copies all of that in one click.

A bad report and a good one

Bad:

the settings page is broken pls fix

Good:

Page/URL: localhost:3000/settings
What I did: changed Display name to "Sam", clicked Save
What I expected: name saves and a "Saved" message shows
What happened: nothing. After reload the old name is back.
Scope: only this form
Element: the Save button at the bottom of the Profile card
Errors: TypeError: Cannot read properties of undefined (reading 'id')
Screenshot path: screenshots/settings-save.png (Save button boxed)

The second one takes a minute to write and usually saves several rounds of back and forth.

Common mistakes

Let Darnly write most of it

Darnly is a free Chrome extension that fills in most of this template for you. Press Option+Shift+B (Windows is coming soon), click the broken part, and type the Expected line. Darnly adds the page address, a screenshot with the element boxed in red, the element's selector, text, HTML and styles, console errors and failed requests from the last 60 seconds, and the What I did part: your last few clicks and pages (where you typed, never what you typed). Secrets are replaced with [hidden].

The report is saved as markdown and a PNG in .darnly/inbox/ in your project, with a short note in AGENTS.md so Claude Code, Codex or Cursor knows to look there. You still write the two lines only you know: what you expected, and the scope. Put both in the note box.

Questions

What is the most important part of a bug report for an AI agent?

The "Expected" line. Without it the agent has to guess what "fixed" means. With it, the agent has a clear goal it can check its change against.

How long should a bug report be?

Short. Five to eight lines is plenty for most UI bugs. Long reports bury the important part. Add logs as a separate block, not in the middle of your sentences.

Should I tell the agent which file to change?

Only if you know. A wrong guess sends it to the wrong place. The page address, the visible text and the element name are safer clues.

Is there a template I can copy?

Yes, the one on this page: page, what you did, what you expected, what happened, scope, element, errors and screenshot path. Save it in a note and fill it in each time.

Can a tool write the report for me?

Darnly, a free Chrome extension, writes most of it: you click the broken part and type the Expected line, and it adds the screenshot, element, page address and recent errors.