Debugging Errors
Paste the error, the code, and what you expected — Claude helps you find the cause.
When something breaks, Claude is a fast debugging partner. The key is to give it everything it needs to reason about the problem.
Include all three
- The error message — the full stack trace, not a paraphrase.
- The relevant code — the function that throws, plus its callers.
- What you expected vs. what happened.
Ask for the cause, not just a patch
Prompt Claude to explain why the error happens before proposing a fix. Understanding the cause prevents the same bug from returning in a new form.
Example
const prompt = `I get this error in the browser:
TypeError: Cannot read properties of undefined (reading 'map')
at ProductList (ProductList.jsx:12)
Here is the component:
function ProductList({ data }) {
return <ul>{data.products.map(p => <li key={p.id}>{p.name}</li>)}</ul>;
}
Explain why this happens and how to fix it safely.`;
const response = await client.messages.create({
model: "claude-opus-4-8",
max_tokens: 2048,
messages: [{ role: "user", content: prompt }],
});When to use it
- Paste a stack trace and the offending function to get a diagnosis and a corrected snippet in under a minute.
- Share a failed test output with the function under test and ask Claude to find why the assertion fails.
- Describe an intermittent race condition in your async code and ask Claude to suggest where the bug lives.
More examples
Paste error plus code for diagnosis
Gives Claude the exact error message and the relevant code together so it can pinpoint the null-check gap.
const error = `TypeError: Cannot read properties of undefined (reading 'map')
at ProductList (ProductList.jsx:12)`;
const code = `function ProductList({ products }) {
return products.map(p => <li key={p.id}>{p.name}</li>);
}`;
const msg = await client.messages.create({
model: "claude-haiku-4-5",
max_tokens: 256,
messages: [{ role: "user",
content: `Error:\n${error}\n\nCode:\n${code}\n\nWhat is wrong and how do I fix it?` }],
});Failed test with expected vs actual
Providing expected vs. actual output alongside the function lets Claude immediately spot the wrong replacement character.
const msg = await client.messages.create({
model: "claude-sonnet-4-5",
max_tokens: 512,
messages: [{ role: "user", content:
`My test fails:
Expected: 'hello-world'
Received: 'hello world'
Function:
function slugify(s) { return s.toLowerCase().replace(/\\s/g, ' '); }
What is the bug?` }],
});Describe a race condition symptom
Describes the symptom and context so Claude can recommend an AbortController cleanup or similar pattern.
const msg = await client.messages.create({
model: "claude-sonnet-4-5",
max_tokens: 512,
messages: [{ role: "user", content:
`This React component fetches data on mount and on a button click.
Sometimes the old fetch overwrites the new one.
Here is the useEffect: ${effectCode}
How do I fix this race condition?` }],
});
Discussion