Console Errors: What They Are, What Our Report Flags and How to Fix Them
Learn what browser console errors are, which ones our free audit counts, and how to find and fix them in Chrome DevTools.
Free to use 6 min read Updated Oct 2026
Console Errors: The Quick Answer
Quick answer: Console errors are red messages the browser writes to the developer console when a script, a file request or a security rule fails as your page loads. Our report fails the check if even one is logged.
- Pass: zero error level console messages during the load.
- Fail: one or more errors were logged, and the report shows the count.
- Fix: open DevTools, read the first error, follow its file and line link, fix the cause, then recheck.
The report is free, and no account is needed.
What Are Console Errors in a Browser?
The browser console is a message panel inside developer tools. It lists what the page and the browser report as it loads, including JavaScript errors. Google Chrome, Microsoft Edge, Mozilla Firefox and Safari all have one.
In Chrome and Edge, messages come in four severity levels: verbose, info, warning and error. For our report, only the error level counts. Your own code might call console.error('Cart failed to load'), while the browser itself writes Failed to load resource: the server responded with a status of 404 for a missing image. Not every error breaks the visible page.
How Our Report Tests for Console Errors
The audit opens your URL in headless Chromium through Playwright and attaches a console listener before navigation starts, so early errors aren't missed. It saves only error level messages as plain text. Warnings, info notes and console.log lines are ignored.
The exact rule: the check passes when the stored list is empty and fails when it holds one or more entries. There is no warning state.
It does catch failed requests such as a 404, CORS blocks, Content Security Policy violations and any console.error() call. Logged-in users can open the message list in the website SEO score checker report. Some problems stay out of reach:
- Uncaught exceptions and unhandled promise rejections. Chromium reports these as page errors, so they show red in DevTools yet aren't counted.
- Anything after the load. Errors that need a click, scroll or login are invisible, and a late timer can slip by.
A pass is a good sign, not a guarantee. The Lighthouse errors in console audit is a separate Best Practices test with its own collection method, so its count can differ from ours.
Common Causes of Console Errors
Match your message to its usual cause.
| Message | Usual cause | First fix |
|---|---|---|
| Failed to load resource (404 or 5xx) | A renamed file or a failing server | Correct the URL or read the log |
| Blocked by CORS policy | A cross origin API or font without the header | Send Access-Control-Allow-Origin |
| Violates the Content Security Policy | An inline script or host missing from the policy | Add the host or move the code |
| Mixed content blocked | An http file on an https page | Change the URL to https |
| SyntaxError, TypeError or ReferenceError | Code that logs a caught error, such as a failed JSON.parse | Guard the code or fix the order |
| Ads, chat, analytics or consent tags | Third party scripts you didn't write | Update, delay or remove the tag |
You'll often see Uncaught ReferenceError: $ is not defined. Uncaught means nothing caught the exception, the name before the colon is the error type, and the file and line link points at the failing statement. DevTools shows these in red, but our report doesn't count them.
For CORS, the MDN CORS errors guide decodes each message. For http files on https pages, read what mixed content is, then run our mixed content test. The JSON validator finds the stray comma behind a parse error.
How to Check Console Errors in Chrome, Edge, Firefox and Safari
- Chrome and Edge. Press Ctrl+Shift+J on Windows or Cmd+Option+J on Mac.
- Firefox. Press Ctrl+Shift+K, or Cmd+Option+K on Mac.
- Safari. In Settings, Advanced, tick Show features for web developers, then press Cmd+Option+C.
- Filter errors. Set the level filter to Errors, the closest match to the audit, though your count may run higher.
How to Fix Console Errors
- Reset. Clear console output, reload, and start with the first red message, because later ones often follow from it.
- Follow the link. Click the file and line reference, read the call stack, then apply the usual remedy from the table above.
- Check third parties. For a Google Tag Manager tag, pause it and publish, or use Preview mode, then reload. If the red line vanishes, that vendor is the source.
- Contain what you can't fix yet. Wrap your call to that code in try catch so one bad line doesn't stop the script. It covers script errors only: the browser logs a 404, CORS or CSP block itself, and a catch that calls
console.errorstill counts. - Confirm. Reload, check the console is clean, then run the free report again.
For scripts that run too early, see defer JavaScript, and for slow ones JavaScript execution time.
Worked example: a 404 on a script
DevTools usually shows the address, for example GET https://example.com/js/app.js net::ERR_ABORTED 404 (Not Found). Our report keeps only the Failed to load resource text, so open the Network tab and sort by status to see the path.
<!-- Before -->
<script src="/js/app.js"></script>
<!-- After -->
<script src="/assets/js/app.js"></script>Keep Your Console Clean After the Fix
- Test on a copy. Staging shows plugin, theme or tag errors first.
- Keep source maps. A minified bundle is often one line, so every error points at line 1 until a source map traces it back. Our JavaScript minifier doesn't produce one, so generate it in your bundler.
- Strip leftovers. A forgotten debugging
console.errorfails the check. - Recheck new tags. Rerun the report after adding one, and use the technical SEO checklist for the rest.
How to Fix
The short version, the same steps you see when you click How to Fix in your report.
Why this fails: The browser logged at least one error-level message while your page loaded, such as a missing file, a blocked request or a script fault. Warnings don't count, and uncaught exceptions aren't captured, so test by hand as well.
How to fix it:
- Open DevTools with Ctrl+Shift+J (Cmd+Option+J on Mac) and reload.
- Set the filter to Errors and start with the first message.
- Click the file and line link, match the message to its cause and correct it.
- Update or remove third party scripts that keep failing. For a Google Tag Manager tag, pause it and publish, or use Preview mode, then reload to confirm it is the source.
- Wrap your call to code you can't change yet in try and catch, but only for script errors. The browser logs a 404, CORS or CSP block itself, so no catch can reach it, and a catch that calls console.error is still counted.
Match your message to its cause:
- 404: restore the file or correct the URL.
- CORS: make the server that hosts the file send an Access-Control-Allow-Origin header that allows your site.
- Content Security Policy: add the blocked host to the policy, or move the inline script to a file.
- Mixed content: change the http:// address to https://.
- Script error: guard the code or fix the load order.
Example of a 404 fix:
<!-- Broken path -->
<script src="/js/app.js"></script>
<!-- Corrected path -->
<script src="/assets/js/app.js"></script>- WordPress: deactivate plugins one at a time, then switch to a default theme, reloading with the console open each time.
- Shopify: disable the app embed, or remove the script added in the theme code (theme.liquid), then reload.
- Wix: open Settings, then Custom Code, and turn off the snippet that logs the error.
- Plain HTML and custom code: fix the path, or wrap the failing script call in try and catch.
Re-test: Reload with the console open, filter to Errors and confirm the list is empty, then run our free report again. For how Lighthouse treats this, see the Lighthouse errors in console audit.
Frequently Asked Questions
What are console errors?
How do I check console errors in Chrome?
How do I fix console errors?
Do console errors affect SEO?
What is the browser console?
Does console.error stop the page from running?
Why does my site have console errors but still look fine?
See how your site scores right now
Paste your address into the free report, then use the How to Fix button on anything that needs work.
Free to use. Results in under a minute for most sites.