Console Error Explainer

About

Understand any browser console error — in plain English.

Console Error Explainer catches the errors a webpage throws and tells you, in simple language, what actually went wrong and how to fix it. No more squinting at cryptic stack traces or copy-pasting red text into a search engine. Click the icon, read the explanation, fix the bug.

Built for developers, QA testers, students, and anyone who has ever opened DevTools and wondered "okay… but what does that mean?"


WHAT IT DOES

• Captures errors live on the page you're viewing — console.error and console.warn messages, uncaught exceptions, unhandled promise rejections, and failed resource loads (missing scripts, images, and API calls).
• Explains each one in plain language: what it means, the most likely cause, and concrete things to try.
• Shows a badge count so you know at a glance how many errors a page produced.
• Filter by errors vs. warnings, expand any item for the full explanation, and clear the list with one click.


WORKS COMPLETELY OFFLINE

The explanations are generated on your device by a built-in rule engine — no account, no sign-up, no network calls. Your data never leaves your browser.


ERRORS IT EXPLAINS

Out of the box it recognizes the errors you actually hit every day, including:

• "Cannot read properties of undefined / null"
• "X is not a function"
• "X is not defined" (ReferenceError)
• CORS — requests blocked by cross-origin security
• Content Security Policy (CSP) violations
• 404s, failed resource loads, and net::ERR_ network failures
• SyntaxError and "Unexpected token" (including the classic
  "Unexpected token '<'" when an API returns HTML instead of JSON)
• "Maximum call stack size exceeded" (infinite recursion)
• Mixed content (HTTP resources on an HTTPS page)
• WebSocket connection failures
• Minified React errors and server/client hydration mismatches

Anything not in the list still gets a clear, structured breakdown so you're never left staring at raw red text.


OPTIONAL AI EXPLANATIONS (BRING YOUR OWN KEY)

Want a deeper explanation of an unusual error? Add your own API key for OpenAI, Anthropic, or Google Gemini in settings and get an AI-written breakdown on demand. This is completely optional and off by default. When you use it, only the single error you click is sent — using your own key, straight from your browser. Your browsing history and page content are never included.


PRIVACY FIRST

• Nothing is sent anywhere unless you opt in to the AI feature with your own key.
• Captured errors are held in memory only and cleared when the tab navigates away or closes — nothing is written to disk.
• No analytics, no tracking, no remote code. Everything ships inside the extension.


WHO IT'S FOR

• Web developers debugging their own sites
• QA and support teams reproducing and reporting issues
• Students and people learning JavaScript who want errors demystified
• Anyone curious why a page in the wild is misbehaving


WHY IT NEEDS ACCESS TO ALL SITES

Errors can happen on any website, so the extension needs permission to read console output on the pages you visit — that's the whole feature. It only ever reads the error and warning messages a page already prints to its own console. It does not read your page content, form inputs, passwords, or browsing history, and it collects nothing.

Open DevTools-level insight without opening DevTools. Install it and turn confusing errors into clear next steps.