Browser Debugging Tools

Some work cannot be verified by reading files.

For frontend tasks, Claude needs browser evidence: screenshots, console errors, network requests, layout state, and form behavior.

Useful tool categories

• Playwright MCP for driving a fresh browser, filling forms, and taking screenshots.
• Chrome DevTools MCP for console logs, network requests, performance data, and runtime inspection.
• Claude browser or Chrome extensions for authenticated pages already open in your browser.

Good uses

• Reproduce a UI bug.
• Compare a screenshot to a design.
• Test a form flow.
• Inspect console errors.
• Check network failures.
• Verify responsive layouts.

Prompt pattern

Use browser tooling to open the local app, reproduce the bug,
capture a screenshot and console errors, then fix the issue.
Verify the page again before stopping.

Browser tools pair especially well with verification loops.