Use Firebug Console to Catch Javascript Errors

Use Firebug Console to Catch Errors

UPDATE: Firebug is not supported anymore. Please try Dev Tools in Firefox, or Developer Tools in Chrome instead.

We’ve regularly written about the Firebug add-on for Firebox because it is a great way to troubleshoot CSS issues.

Did you know that Firebug can also help to detect Javascript errors that may break your site?

In this post, I’ll share with you how to catch errors by using Firebug’s console feature.

Step #1. Install Firebug

We have a tutorial to help you to install Firebug addon in Firefox browser.

Step #2. Activate Firebug console

  • Go to your website.
  • Activate Firebug by clicking the “bug” icon.

The Firebug icon in Firefox

  • Click the “Console” tab (mine says “Consola”, as I’m using the Spanish version)

The console tab in Firebug in Firefox

Step #2. Catch errors

  • Reload the page by clicking the “refresh” icon in the address bar:

Refreshing a page in Firefox

  • Wait until the page finishes loading, and see if any errors come up in the Console area.

The results showing in the Firebug Console

By default, the console will display a lot of information, and not all of the results will be errors. You may see process details, log details, warnings and errors.

Pay special attention to the information that is marked red. You can filter down and only see errors by doing click the “Errors” tab.

The error tab in the Firebug Console

Step #3. Fix the errors.

Firefox Console will work with WordPress, Drupal, Joomla or any other software you use. The errors you found in the previous step will be very helpful to debug problems in your website.

Report the errors to your developer in order to get them fixed.

Instructor

  • Valentin discovered Joomla in 2010, and since then he has considered it as the best CMS. Valentin has been coding extensions and templates for Joomla for many years and truly enjoys helping people build their own websites with Open Source tools. He lives in San Julián, Jalisco, México.

0 0 votes
Blog Rating
Subscribe
Notify of
3 Comments
Oldest
Newest Most Voted
Inline Feedbacks
View all comments
dennisth19

Thanks for the helpful hints. Would be great if you could publish some examples to fix css errors too? Not a whole course, but only some tips and short lessons to solve everyday problems…

steve

Funny you should ask. We do indeed have a whole course: [url=https://www.ostraining.com/class/webdev/]https://www.ostraining.com/…[/url]

dennisth19

I know, but what i ment was the opposite;-) Like short lessons here and there where issues are solved within 5 minutes or so. As a webmaster i need to train my skills next to my work…

3
0
Would love your thoughts, please comment.x
()
x