Frequently Asked Questions

From FirebugWiki

(Difference between revisions)
Jump to: navigation, search
(New FAQ page)
(Applied some formatting)
Line 10: Line 10:
=== To which versions of Firefox is Firebug compatible? ===
=== To which versions of Firefox is Firebug compatible? ===
-
1.10 8.0 14.a1 (final version not yet released)
+
{| class="wikitable" style="width:300px; vertical-align:top;"
-
1.9.1 5.0 12.a1
+
|- bgcolor=lightgrey
-
1.9.0 5.0 11.*
+
! Firebug version || Min. Firefox version || Max. Firefox version
-
1.8.4 5.0 10.*
+
|-
-
1.8.3 5.0 9.*
+
| 1.10 || 13.0 || 17.*
-
1.8.2 5.0 7.*
+
|-
-
1.8.1 5.0 6.*
+
| 1.9.1 || 5.0 || 12.a1
-
1.8.0 5.0 5.*
+
|-
-
1.7.3 3.6 5.*
+
| 1.9.0 || 5.0 || 11.*
-
1.7.2 3.6 5.*
+
|-
-
1.7.1 3.6 5.*
+
| 1.8.4 || 5.0 || 10.*
-
1.7.0 4.0b12 5.*  
+
|-
-
1.6.2 3.6 3.6.*
+
| 1.8.3 || 5.0 || 9.*
-
1.6.1 3.6 3.6.*
+
|-
-
1.6.0 3.6 3.6.*
+
| 1.8.2 || 5.0 || 7.*
-
1.5.4 3.5 3.6.*
+
|-
-
1.5.3 3.5 3.6.*
+
| 1.8.1 || 5.0 || 6.*
-
1.5.2 3.5 3.6.*
+
|-
-
1.5.0 3.5 3.6.*
+
| 1.8.0 || 5.0 || 5.*
-
1.4.5 3.0 3.6.*
+
|-
-
1.4.4 3.0 3.6.*
+
| 1.7.3 || 3.6 || 5.*
-
1.4.3 3.0 3.5.*
+
|-
-
1.4.2 3.0 3.5.*
+
| 1.7.2 || 3.6 || 5.*
-
1.4.1 3.0 3.5.*
+
|-
-
1.4.0 3.0 3.5.*
+
| 1.7.1 || 3.6 || 5.*
-
1.3.3 3.0 3.0.*
+
|-
-
1.3.2 3.0 3.0.*
+
| 1.7.0 || 4.0b12 || 5.*  
-
1.3.1 1.5 3.0.*
+
|-
-
1.3.0 1.5 3.0.*
+
| 1.6.2 || 3.6 || 3.6.*
-
1.2.1 2.0 3.0.*
+
|-
-
1.05 1.5 2.0.0.*
+
| 1.6.1 || 3.6 || 3.6.*
-
1.04 1.5 2.0.0.*
+
|-
-
1.03 1.5 2.0.0.*
+
| 1.6.0 || 3.6 || 3.6.*
-
1.02 1.5 2.0.0.*
+
|-
-
1.01 1.5 2.0.0.*
+
| 1.5.4 || 3.5 || 3.6.*
-
1.0 1.5 2.0.0.*
+
|-
 +
| 1.5.3 || 3.5 || 3.6.*
 +
|-
 +
| 1.5.2 || 3.5 || 3.6.*
 +
|-
 +
| 1.5.0 || 3.5 || 3.6.*
 +
|-
 +
| 1.4.5 || 3.0 || 3.6.*
 +
|-
 +
| 1.4.4 || 3.0 || 3.6.*
 +
|-
 +
| 1.4.3 || 3.0 || 3.5.*
 +
|-
 +
| 1.4.2 || 3.0 || 3.5.*
 +
|-
 +
| 1.4.1 || 3.0 || 3.5.*
 +
|-
 +
| 1.4.0 || 3.0 || 3.5.*
 +
|-
 +
| 1.3.3 || 3.0 || 3.0.*
 +
|-
 +
| 1.3.2 || 3.0 || 3.0.*
 +
|-
 +
| 1.3.1 || 1.5 || 3.0.*
 +
|-
 +
| 1.3.0 || 1.5 || 3.0.*
 +
|-
 +
| 1.2.1 || 2.0 || 3.0.*
 +
|-
 +
| 1.05 || 1.5 || 2.0.0.*
 +
|-
 +
| 1.04 || 1.5 || 2.0.0.*
 +
|-
 +
| 1.03 || 1.5 || 2.0.0.*
 +
|-
 +
| 1.02 || 1.5 || 2.0.0.*
 +
|-
 +
| 1.01 || 1.5 || 2.0.0.*
 +
|-
 +
| 1.0 || 1.5 || 2.0.0.*
 +
|}
=== How to install Firebug into a clean profile? ===
=== How to install Firebug into a clean profile? ===
To test for bugs regarding interactions with other extensions or corrupted profiles, you should do the following.
To test for bugs regarding interactions with other extensions or corrupted profiles, you should do the following.
-
=== Firefox and Firebug re-install rarely fixes problems because the configuration files are not altered on reinstall. So to clear out the configuration files you need to create a new Firefox profile: ===
 
-
Linux Way
 
-
===    Exit Firefox ===
 
-
    Get to a command line
 
-
    Run Firefox with -ProfileManager
 
-
===  $ firefox -ProfileManager ===
 
-
    Create New Profile
+
Firefox and Firebug re-install rarely fixes problems because the configuration files are not altered on reinstall. So to clear out the configuration files you need to create a new Firefox profile:
-
    Start Firefox with your new profile
+
-
    Load Firebug into this clean profile.  
+
-
=== Windows Way ===
+
-
    Exit Firefox
+
==== Linux Way ====
-
    Get to a command line
+
# Exit Firefox
-
        Windows: Start->Run->"cmd" enter
+
# Get to a command line
-
    Run Firefox with -ProfileManager (use quotes around the file name because of the spaces)
+
# Run Firefox with <code>-ProfileManager</code><br/><source lang="bash">$ firefox -ProfileManager</source>
-
===  "C:\Program Files\Mozilla Firefox\firefox.exe" -ProfileManager ===
+
# Create New Profile
 +
# Start Firefox with your new profile
 +
# https://addons.mozilla.org/firefox/addon/firebug/ Install Firebug] into this clean profile
-
    Create New Profile
+
==== Windows Way ====
-
    Start Firefox with your new profile
+
# Exit Firefox
-
    Load Firebug into this clean profile.
+
# Get to a command line (''Start'' > ''Run...'' > "cmd" <code class="key">Enter</code>)
-
=== Read more about this on Mozilla Support "Managing Profiles" (http://support.mozilla.com/en-US/kb/Managing+profiles) ===
+
# Run Firefox with <code>-ProfileManager</code> (use quotes around the file name because of the spaces)<br/><source lang="powershell">"C:\Program Files\Mozilla Firefox\firefox.exe" -ProfileManager</source>
 +
# Create New Profile
 +
# Start Firefox with your new profile
 +
# https://addons.mozilla.org/firefox/addon/firebug/ Install Firebug] into this clean profile
 +
 
 +
==== OS X Way ====
 +
# Exit Firefox
 +
# Get to a command line
 +
# Run Firefox with <code>-p</code><br/><source lang="bash">$ /Applications/Firefox.app/Contents/MacOS/firefox -ProfileManager</source>
 +
# Create New Profile
 +
# Start Firefox with your new profile
 +
# [https://addons.mozilla.org/firefox/addon/firebug/ Install Firebug] into this clean profile
 +
 
 +
Read more about this on [http://support.mozilla.com/en-US/kb/Managing+profiles Mozilla Support "Managing Profiles"].
I installed Firebug but I don't see the icon. Where is it?
I installed Firebug but I don't see the icon. Where is it?
If you use Firefox 3.6 or earlier you should see the Firebug icon in the status bar. Starting from Firefox 4.0 the Firebug Start Button moved to the toolbar. If it's not visible there, it can be found inside the Customize Toolbar dialog. For more info about this please read Honza's blog post (http://www.softwareishard.com/blog/firebug/firebug-start-button-in-firefox-4/).
If you use Firefox 3.6 or earlier you should see the Firebug icon in the status bar. Starting from Firefox 4.0 the Firebug Start Button moved to the toolbar. If it's not visible there, it can be found inside the Customize Toolbar dialog. For more info about this please read Honza's blog post (http://www.softwareishard.com/blog/firebug/firebug-start-button-in-firefox-4/).
 +
== Usage ==
== Usage ==
=== Is there some basic description of how Firebug works? ===
=== Is there some basic description of how Firebug works? ===
Line 81: Line 128:
=== How can I see which version of Firebug I have? ===
=== How can I see which version of Firebug I have? ===
You have three possibilities:
You have three possibilities:
-
* Firefox Menu > Add-ons or Tools > Add-ons > Firebug (version number on the panel)
+
* ''Firefox'' Menu > ''Add-ons'' or ''Tools'' > ''Add-ons'' > ''Firebug'' (version number on the panel)
* Firebug Menu > About... <version number> (since 1.1)
* Firebug Menu > About... <version number> (since 1.1)
-
* Hover over the Firebug Start Button
+
* Hover over the Firebug [[Start Button]]
-
 
+
== Activation ==
== Activation ==
Line 92: Line 138:
=== How does the activation model of Firebug work? ===
=== How does the activation model of Firebug work? ===
Firebug implements a whitelist model as well as an "always on" model. For more info see Activation (http://getfirebug.com/wiki/index.php/Activation).
Firebug implements a whitelist model as well as an "always on" model. For more info see Activation (http://getfirebug.com/wiki/index.php/Activation).
-
 
== Preferences ==
== Preferences ==
Line 100: Line 145:
=== Are there options, which you can't set through the UI? ===
=== Are there options, which you can't set through the UI? ===
Yes, there are some hidden options. You can change them via about:config. See Firebug Preferences (http://getfirebug.com/wiki/index.php/Firebug_Preferences) for more info.
Yes, there are some hidden options. You can change them via about:config. See Firebug Preferences (http://getfirebug.com/wiki/index.php/Firebug_Preferences) for more info.
-
 
== Console Panel ==
== Console Panel ==
Line 106: Line 150:
See the Console Panel description (http://getfirebug.com/wiki/index.php/Console_Panel).
See the Console Panel description (http://getfirebug.com/wiki/index.php/Console_Panel).
-
=== Does Firebug interfere in any way with jQuery's '$' shortcut? ===
+
=== Does Firebug interfere in any way with jQuery's <code>$</code> shortcut? ===
Although Firebug uses the '$' notation it doesn't interfere with your code. Sometimes you may have issues testing code in the console but can easily avoid them by using the jQuery's alternative notation:
Although Firebug uses the '$' notation it doesn't interfere with your code. Sometimes you may have issues testing code in the console but can easily avoid them by using the jQuery's alternative notation:
-
=== jQuery('div'); ===
+
 
 +
<source lang="javascript">jQuery('div');</source>
Instead of:
Instead of:
-
=== $('div'); ===
+
 
 +
<source lang="javascript">$('div');</source>
=== Why do I get the error "console is not defined"? ===
=== Why do I get the error "console is not defined"? ===
Line 119: Line 165:
== HTML Panel ==
== HTML Panel ==
=== How does the HTML panel work? ===
=== How does the HTML panel work? ===
-
See the HTML Panel description (http://getfirebug.com/wiki/index.php/HTML_Panel).
+
See the [[HTML Panel|HTML Panel description]].
=== Why keeps the HTML panel scrolling up? ===
=== Why keeps the HTML panel scrolling up? ===
Line 129: Line 175:
=== How can I save changes I made inside the HTML panel back to my source file? ===
=== How can I save changes I made inside the HTML panel back to my source file? ===
You can't. As John J. Barton wrote on the newsgroup:
You can't. As John J. Barton wrote on the newsgroup:
-
===     Editing in Firebug is kinda like taking out the pickles from and ===
+
 
 +
     Editing in Firebug is kinda like taking out the pickles from and
     adding mustard to a restaurant sandwich: you can enjoy the result, but
     adding mustard to a restaurant sandwich: you can enjoy the result, but
     the next customer at the restaurant will still get pickles and no
     the next customer at the restaurant will still get pickles and no
     mustard.
     mustard.
 +
=== The reason is that the HTML output is normally dynamically generated by some kind of server script language like e.g. PHP. ===
=== The reason is that the HTML output is normally dynamically generated by some kind of server script language like e.g. PHP. ===
-
Though what could be done is to provide some mapping between URLs and files on your local machine (http://code.google.com/p/fbug/issues/detail?id=5035). Meanwhile, you can try Firediff (http://www.incaseofstairs.com/firediff/), an extension for firebug by Kevin Decker.  
+
Though what could be done is to provide some [http://code.google.com/p/fbug/issues/detail?id=5035 mapping between URLs and files on your local machine]. Meanwhile, you can try [http://www.incaseofstairs.com/firediff/ Firediff], an extension for firebug by Kevin Decker.  
-
 
+
== CSS Panel ==
== CSS Panel ==
=== How can I save changes I made inside the CSS panel back to my source file? ===
=== How can I save changes I made inside the CSS panel back to my source file? ===
This feature is not integrated into Firebug, but there are some extensions, which do this (or at least let you save the generated CSS):
This feature is not integrated into Firebug, but there are some extensions, which do this (or at least let you save the generated CSS):
-
=== * cssUpdater (http://www.cssupdater.com/) ===
+
 
-
* FireFile (https://addons.mozilla.org/en-US/firefox/addon/52365/)
+
* [http://www.cssupdater.com/ cssUpdater]
-
* Firediff (http://www.incaseofstairs.com/firediff/)
+
* [https://addons.mozilla.org/en-US/firefox/addon/52365/ FireFile]
 +
* [http://www.incaseofstairs.com/firediff/ Firediff]
=== How to enabled the Console panel? ===
=== How to enabled the Console panel? ===
When the message appears that the Console Panel is disabled, you can click the "Enable" link inside of it.
When the message appears that the Console Panel is disabled, you can click the "Enable" link inside of it.
Open the Options Menu and click on "Enabled".
Open the Options Menu and click on "Enabled".
-
 
== Script Panel ==
== Script Panel ==
=== Why does the Script panel claim there's no JavaScript on the page when there obviously is code? ===
=== Why does the Script panel claim there's no JavaScript on the page when there obviously is code? ===
This means that your JavaScript contains a syntax error and could not be parsed by the browser. Check the Console Panel for the error position.
This means that your JavaScript contains a syntax error and could not be parsed by the browser. Check the Console Panel for the error position.
 +
=== Is there an option to de-minify JavaScript? ===
=== Is there an option to de-minify JavaScript? ===
-
Currently not, but there is already a request to implement that (http://code.google.com/p/fbug/issues/detail?id=1238). Also there is another extension called Javascript Deminifier (https://addons.mozilla.org/firefox/addon/javascript-deminifier/) that does exactly that. It is working independently from Firebug, so you can also use it together with other debuggers (https://addons.mozilla.org/firefox/search/?atype=1&cat=4&q=debugger).
+
Currently not, but there is already a [http://code.google.com/p/fbug/issues/detail?id=1238 request to implement de-minifying JavaScript]. Also there is another extension called [https://addons.mozilla.org/firefox/addon/javascript-deminifier/ Javascript Deminifier] that does exactly that. It is working independently from Firebug, so you can also use it together with other [https://addons.mozilla.org/firefox/search/?atype=1&cat=4&q=debugger debuggers].
=== Why is there no syntax highlighting? ===
=== Why is there no syntax highlighting? ===
-
That's not implemented yet. See issue 4823 (http://code.google.com/p/fbug/issues/detail?id=4823).
+
That's not implemented yet. See [http://code.google.com/p/fbug/issues/detail?id=4823 issue 4823].
-
Though you can get syntax highlighting via an extension called FireRainbow (http://firerainbow.binaryage.com/).
+
Though you can get syntax highlighting via an extension called [http://firerainbow.binaryage.com/ FireRainbow].
-
 
+
== DOM Panel ==
== DOM Panel ==
=== What do the different colors of the variables mean? ===
=== What do the different colors of the variables mean? ===
-
=== Bold Black are objects ===
+
The [[DOM Panel#Color Codes|DOM panel]] explains the different colors.
-
Not so bold Black are DOM objects
+
-
Get in Gray in front means "getter"
+
-
Bold green are user functions
+
-
Not so bold Green are DOM functions
+
-
Bold Red are constructor functions
+
== Miscellaneous ==
== Miscellaneous ==
=== Why doesn't Firebug integrate feature X? ===
=== Why doesn't Firebug integrate feature X? ===
This can have different reasons:
This can have different reasons:
-
- A Firebug extension (http://getfirebug.com/wiki/index.php/Firebug_Extensions) already implements it
+
* A [[Firebug Extensions|Firebug extension]] already implements it.
-
- Another extension (https://addons.mozilla.org/firefox/extensions/) already implements it
+
* [https://addons.mozilla.org/firefox/extensions/ Another extension] already implements it.
-
- We decided not to do so (e.g. because it misses the purpose of Firebug, would better fit into an extension, etc.); see the issue tracker (code.google.com/p/fbug/issues/list?can=1) and the discussion group (https://groups.google.com/forum/#!forum/firebug)
+
* We decided not to do so (e.g. because it misses the purpose of Firebug, would better fit into an extension, etc.); see the [http://code.google.com/p/fbug/issues/list?can=1 issue tracker] and the [https://groups.google.com/forum/#!forum/firebug discussion group].
-
- We already know about it (http://code.google.com/p/fbug/issues/list), but didn't have the resources yet to implement it
+
* We already [http://code.google.com/p/fbug/issues/list know about it] but didn't have the resources yet to implement it.
-
- Nobody told us (http://code.google.com/p/fbug/issues/entry?template=User%20enhancement%20request) yet about that feature
+
* [http://code.google.com/p/fbug/issues/entry?template=User%20enhancement%20request Nobody told us] yet about that feature.
-
- It already has the feature, but it isn't visible enough; write us about that in the discussion group (https://groups.google.com/forum/#!forum/firebug)
+
* It already has the feature but it isn't visible enough. Write us about that in the [https://groups.google.com/forum/#!forum/firebug discussion group].
=== Why is Firebug that slow? ===
=== Why is Firebug that slow? ===
-
When Firebug reacts slowly, this might be caused by several things:
+
When Firebug reacts slowly, this might have the following reasons:
-
* loading huge files (mainly inside the CSS or Script panel)
+
 
-
* logging many things into the Console Panel
+
* loading huge files (mainly inside the [[CSS Panel|CSS]] or [[Script Panel]])
-
=== If you get an "Unresponsive script" message, it might be a bug (http://getfirebug.com/wiki/index.php/I_found_a_Firebug_Bug!). ===
+
* logging many things into the [[Console Panel]]
 +
* If you get an "Unresponsive script" message, it might be a [[http://getfirebug.com/wiki/index.php/I_found_a_Firebug_Bug!|bug]].
=== How can I check from my website whether Firebug is enabled? ===
=== How can I check from my website whether Firebug is enabled? ===
-
We try to avoid the detection of Firebug through websites for privacy reasons. There's also an issue (http://code.google.com/p/fbug/issues/detail?id=5139) related to this.
+
We try to avoid the detection of Firebug through websites for privacy reasons. There's also an [http://code.google.com/p/fbug/issues/detail?id=5139 issue related to this].
 +
 
=== Can I change the shortcuts used within Firebug? ===
=== Can I change the shortcuts used within Firebug? ===
-
Yes, via Firebug Menu > Customize Shortcuts or by pressing Ctrl/Cmd+Shift+Alt+B you can open the Firebug Shortcut Bindings dialog, in which you can change the shortcuts.
+
Yes, via [[Firebug Menu]] > ''Customize Shortcuts'' or by pressing <code class="key">Ctrl/&#8984;+Shift+Alt+B</code> you can open the ''Firebug Shortcut Bindings'' dialog, in which you can change the shortcuts.
 +
 
=== Can you check the code I wrote for my Firebug extension? ===
=== Can you check the code I wrote for my Firebug extension? ===
-
If you have a specific issue you always contact us via the discussion group (https://groups.google.com/forum/#!forum/firebug) or IRC (irc://irc.mozilla.org/firebug).
+
If you have a specific issue you always contact us via the [https://groups.google.com/forum/#!forum/firebug discussion group] or [irc://irc.mozilla.org/firebug IRC].
 +
 
Please make sure you're asking about a specific issue. Unfortunately we normally don't have the time to check the whole code of your extension for errors or functionality.
Please make sure you're asking about a specific issue. Unfortunately we normally don't have the time to check the whole code of your extension for errors or functionality.
 +
=== How can I participate in the Firebug project? ===
=== How can I participate in the Firebug project? ===
-
There are many ways how you can help us. Please read about how to become a contributor (http://getfirebug.com/wiki/index.php/How_to_become_a_contributor).
+
There are many ways how you can help us. Please read about [[How to become a contributor]].
== Issues ==
== Issues ==
=== Where to get help? ===
=== Where to get help? ===
-
This wiki (http://getfirebug.com/wiki/)
+
* This wiki (http://getfirebug.com/wiki/)
-
Web Site (http://getfirebug.com/)
+
* Web Site (http://getfirebug.com/)
-
Discussion group (https://groups.google.com/forum/#!forum/firebug)
+
* Discussion group (https://groups.google.com/forum/#!forum/firebug)
-
IRC (irc://irc.mozilla.org/firebug)
+
* IRC (irc://irc.mozilla.org/firebug)
-
Bug reports (http://code.google.com/p/fbug/issues/list)
+
* Bug reports (http://code.google.com/p/fbug/issues/list)
-
=== General info: ===
+
 
-
I can't install Firebug. What can I do?
+
=== General info ===
 +
==== I can't install Firebug. What can I do? ====
Normally Firefox will tell you the reason when an extension couldn't be installed.
Normally Firefox will tell you the reason when an extension couldn't be installed.
Common reasons are:
Common reasons are:
-
=== * The Firebug version you wanted to download is not compatible to the Firefox version you use. => Check the compatibility table above. ===
+
 
 +
* The Firebug version you wanted to download is not compatible to the Firefox version you use. => Check the [[#To_which_versions_of_Firefox_is_Firebug_compatible.3F|compatibility table]] above.
* A file couldn't be written. => Restart Firefox and try again.
* A file couldn't be written. => Restart Firefox and try again.
* "Invalid file hash (possible download corruption)" => Try a new profile; Re-install Firefox.
* "Invalid file hash (possible download corruption)" => Try a new profile; Re-install Firefox.
* You get an error message inside Firefox' Error Console like "installLocation has no properties" => Try a new profile; Re-install Firefox.
* You get an error message inside Firefox' Error Console like "installLocation has no properties" => Try a new profile; Re-install Firefox.
-
=== If you're using Windows, you can try the following: ===
+
 
-
    With Firefox closed, locate your profile directory (http://support.mozilla.com/en-US/kb/Backing+up+your+information#Locate_your_profile_folder), delete these temporary files, they will be automatically re-created by Firefox:
+
==== If you're using Windows, you can try the following: ====
-
        extensions.ini
+
* With Firefox closed, locate your [http://support.mozilla.com/en-US/kb/Backing+up+your+information#Locate_your_profile_folder profile directory], delete these temporary files, they will be automatically re-created by Firefox:
-
        extensions.cache
+
  <code>extensions.ini</code>
-
        extensions.rdf
+
  <code>extensions.cache</code>
-
        compreg.dat  
+
  <code>extensions.rdf</code>
-
    Disable any Antivirus or BackUp program you may have running and then install Firebug.
+
  <code>compreg.dat</code>
-
        It may be that some software is stopping Firefox creating the file structures needed for the installation process.  
+
* Disable any Antivirus or Backup program you may have running and then install Firebug.<br/>It may be that some software is stopping Firefox creating the file structures needed for the installation process.  
-
    Run Firefox as Administrator. It may be the same as in reason 2, because firefox doesn't have enough permissions.
+
* Run Firefox as Administrator. It may be the same as in reason 2, because firefox doesn't have enough permissions.
-
    Manually install Firebug.
+
* Manually install Firebug.<br/>This can be done easily, just unzip the XPI (it's a normal zipped file with the extension changed) in your extensions folder, inside your profile. You should unzip firebug's XPI content inside a folder named 'firebug@software.joehewitt.com'. Do this with Firefox closed.
-
        This can be done easily, just unzip the XPI (it's a normal zipped file with the extension changed) in your extensions folder, inside your profile. You should unzip firebug's XPI content inside a folder named 'firebug@software.joehewitt.com'. Do this with Firefox closed.  
+
 
-
=== To get the XPI go to Firebug on addons.mozilla.org (AMO) (https://addons.mozilla.org/addon/firebug/), right click on the "Add to Firefox" button and select "Save Link As...". ===
+
To get the XPI go to Firebug on [https://addons.mozilla.org/addon/firebug/ addons.mozilla.org (AMO)], right click on the "Add to Firefox" button and select ''Save Link As...''.
If your problem didn't get solved or your error message is not listed above:
If your problem didn't get solved or your error message is not listed above:
-
* Wanted to download from AMO? => Contact Mozilla.
+
* Wanted to download from AMO? => [http://support.mozilla.org/ Contact Mozilla].
-
* Wanted to download from getfirebug.com (http://getfirebug.com/releases/) => Contact us.
+
* Wanted to download from getfirebug.com (http://getfirebug.com/releases/) => [https://groups.google.com/forum/#!forum/firebug Contact us].
-
=== Firebug crashes Firefox. What can I do? ===
+
==== Firebug crashes Firefox. What can I do? ====
Crash means the program exits.
Crash means the program exits.
 +
Note that we're not responsible for fixing Firefox crashes - even when you can confirm that they are related to Firebug.
Note that we're not responsible for fixing Firefox crashes - even when you can confirm that they are related to Firebug.
Browser crashes can have different reasons. Generally in such cases it's a browser API Firebug uses, which is corrupt.
Browser crashes can have different reasons. Generally in such cases it's a browser API Firebug uses, which is corrupt.
-
When the browser crashes the Mozilla Crash Reporter (http://support.mozilla.org/kb/Mozilla%20Crash%20Reporter) should appear. To get the crash fixed please report it (https://bugzilla.mozilla.org/) to Mozilla attaching the crash report URL, so they can fix it. Please inform us about the crash and post us the link to the report via the discussion group (https://groups.google.com/forum/#!forum/firebug) or IRC (irc://irc.mozilla.org/firebug), though. Other people might have the same problem. In these cases we could point them to the report.
+
When the browser crashes the [http://support.mozilla.org/kb/Mozilla%20Crash%20Reporter Mozilla Crash Reporter] should appear. To get the crash fixed please [https://bugzilla.mozilla.org/ report it to Mozilla] attaching the crash report URL, so they can fix it. Please inform us about the crash and post us the link to the report via the [https://groups.google.com/forum/#!forum/firebug discussion group] or [irc://irc.mozilla.org/firebug IRC], though. Other people might have the same problem. In these cases we could point them to the report.
-
If you see a crash, which affects many people (https://crash-stats.mozilla.com/topcrasher/), we might be able to find a workaround in some cases until it's fixed in Firefox.
+
If you see a crash, which [https://crash-stats.mozilla.com/topcrasher/ affects many people], we might be able to find a workaround in some cases until it's fixed in Firefox.
-
=== Firebug hangs itself or Firefox. Why? ===
+
==== Firebug hangs itself or Firefox. Why? ====
Hang means the program is still running (it did not crash) but it fails to respond to user commands. The causes and diagnosis is completely different from a crash.  
Hang means the program is still running (it did not crash) but it fails to respond to user commands. The causes and diagnosis is completely different from a crash.  
-
You should follow the steps for what to do when you experience a bug(http://getfirebug.com/wiki/index.php/I_found_a_Firebug_Bug!), so you can find out if it's a problem in Firebug or the browser and create a test case.
+
You should follow the [[I_found_a_Firebug_Bug!|steps for what to do when you experience a bug]], so you can find out if it's a problem in Firebug or the browser and create a test case.
-
=== I found a bug in Firebug. What should I do? ===
+
==== I found a bug in Firebug. What should I do? ====
Many problems with Firebug can already be solved by creating a new Firefox profile.
Many problems with Firebug can already be solved by creating a new Firefox profile.
-
Read about how to do this and further info on what to do when you experience a bug in Firebug (http://getfirebug.com/wiki/index.php/I_found_a_Firebug_Bug!).
+
Read about how to do this and further info on [[I_found_a_Firebug_Bug!|what to do when you experience a bug in Firebug]].
-
=== Specific problems: ===
+
=== Specific problems ===
-
The awesome bar and some menus are displayed transparently. Why?
+
==== The awesome bar and some menus are displayed transparently. Why? ====
-
There's a bug in Firefox causing this. As a workaround you can turn off hardware acceleration via Firefox Button > Options > Advanced > General > Use hardware acceleration when available.
+
There's a bug in Firefox causing this. As a workaround you can turn off hardware acceleration via Firefox Button > ''Options'' > ''Advanced'' > ''General'' > ''Use hardware acceleration when available''.

Revision as of 08:12, 10 September 2012

Contents

Installation

How do I install Firebug?

There are three ways to install Firebug:

Can I use Firebug on non-Firefox browsers?

You can use Firebug Lite, which is a light version of Firebug written completely in JavaScript.

To which versions of Firefox is Firebug compatible?

Firebug version Min. Firefox version Max. Firefox version
1.10 13.0 17.*
1.9.1 5.0 12.a1
1.9.0 5.0 11.*
1.8.4 5.0 10.*
1.8.3 5.0 9.*
1.8.2 5.0 7.*
1.8.1 5.0 6.*
1.8.0 5.0 5.*
1.7.3 3.6 5.*
1.7.2 3.6 5.*
1.7.1 3.6 5.*
1.7.0 4.0b12 5.*
1.6.2 3.6 3.6.*
1.6.1 3.6 3.6.*
1.6.0 3.6 3.6.*
1.5.4 3.5 3.6.*
1.5.3 3.5 3.6.*
1.5.2 3.5 3.6.*
1.5.0 3.5 3.6.*
1.4.5 3.0 3.6.*
1.4.4 3.0 3.6.*
1.4.3 3.0 3.5.*
1.4.2 3.0 3.5.*
1.4.1 3.0 3.5.*
1.4.0 3.0 3.5.*
1.3.3 3.0 3.0.*
1.3.2 3.0 3.0.*
1.3.1 1.5 3.0.*
1.3.0 1.5 3.0.*
1.2.1 2.0 3.0.*
1.05 1.5 2.0.0.*
1.04 1.5 2.0.0.*
1.03 1.5 2.0.0.*
1.02 1.5 2.0.0.*
1.01 1.5 2.0.0.*
1.0 1.5 2.0.0.*

How to install Firebug into a clean profile?

To test for bugs regarding interactions with other extensions or corrupted profiles, you should do the following.

Firefox and Firebug re-install rarely fixes problems because the configuration files are not altered on reinstall. So to clear out the configuration files you need to create a new Firefox profile:

Linux Way

  1. Exit Firefox
  2. Get to a command line
  3. Run Firefox with -ProfileManager
    $ firefox -ProfileManager
  4. Create New Profile
  5. Start Firefox with your new profile
  6. https://addons.mozilla.org/firefox/addon/firebug/ Install Firebug] into this clean profile

Windows Way

  1. Exit Firefox
  2. Get to a command line (Start > Run... > "cmd" Enter)
  3. Run Firefox with -ProfileManager (use quotes around the file name because of the spaces)
    "C:\Program Files\Mozilla Firefox\firefox.exe" -ProfileManager
  4. Create New Profile
  5. Start Firefox with your new profile
  6. https://addons.mozilla.org/firefox/addon/firebug/ Install Firebug] into this clean profile

OS X Way

  1. Exit Firefox
  2. Get to a command line
  3. Run Firefox with -p
    $ /Applications/Firefox.app/Contents/MacOS/firefox -ProfileManager
  4. Create New Profile
  5. Start Firefox with your new profile
  6. Install Firebug into this clean profile

Read more about this on Mozilla Support "Managing Profiles".

I installed Firebug but I don't see the icon. Where is it? If you use Firefox 3.6 or earlier you should see the Firebug icon in the status bar. Starting from Firefox 4.0 the Firebug Start Button moved to the toolbar. If it's not visible there, it can be found inside the Customize Toolbar dialog. For more info about this please read Honza's blog post (http://www.softwareishard.com/blog/firebug/firebug-start-button-in-firefox-4/).

Usage

Is there some basic description of how Firebug works?

There are plenty of tutorials, videos and books on the web. (http://getfirebug.com/wiki/index.php/Firebug_Links) You can also use this wiki (http://getfirebug.com/wiki/) as a source of information. And some of Firebug's features are described in detail in Honza's blog (http://www.softwareishard.com/blog/category/firebug/).

How can I see which version of Firebug I have?

You have three possibilities:

  • Firefox Menu > Add-ons or Tools > Add-ons > Firebug (version number on the panel)
  • Firebug Menu > About... <version number> (since 1.1)
  • Hover over the Firebug Start Button

Activation

How do I open Firebug?

Either via F12 or by clicking the Firebug Start Button in the Firefox main toolbar (Firefox 3.6 and earlier: Firebug status bar icon in the lower right corner of Firefox)

How does the activation model of Firebug work?

Firebug implements a whitelist model as well as an "always on" model. For more info see Activation (http://getfirebug.com/wiki/index.php/Activation).

Preferences

How do I reset all Firebug options?

Firebug Menu > Options > Reset All Firebug Options

Are there options, which you can't set through the UI?

Yes, there are some hidden options. You can change them via about:config. See Firebug Preferences (http://getfirebug.com/wiki/index.php/Firebug_Preferences) for more info.

Console Panel

How does the Console panel work?

See the Console Panel description (http://getfirebug.com/wiki/index.php/Console_Panel).

Does Firebug interfere in any way with jQuery's $ shortcut?

Although Firebug uses the '$' notation it doesn't interfere with your code. Sometimes you may have issues testing code in the console but can easily avoid them by using the jQuery's alternative notation:

jQuery('div');

Instead of:

$('div');

Why do I get the error "console is not defined"?

On Firefox versions up to 3.6 you will see this message in the Firefox Error Console as long as the Console panel is not enabled. When the Console panel is enabled, it makes the 'console' object available to the page's javascript. Since Firefox 4.0 the 'console' object is already defined through the Firefox internal developer tools. So this message should not appear anymore.

HTML Panel

How does the HTML panel work?

See the HTML Panel description.

Why keeps the HTML panel scrolling up?

If the HTML panel scrolls up by itself, you probably have a timed event inside your code, which inserts or changes HTML and triggers the panel to scroll to this change. To avoid scrolling to the change uncheck Expand Changes and Scroll Changes Into View.

Why do the HTML panel contents look different than my source file?

The HTML panel shows a live view on what the browser is showing. I.e. if a JavaScript makes changes to the HTML, the HTML panel will display these changes. Also it displays the HTML structure formatted as tree structure. So it doesn't matter if the code coming from the server is minified or has thousands of spaces in between the tags, the display inside the panel will be the same.

How can I save changes I made inside the HTML panel back to my source file?

You can't. As John J. Barton wrote on the newsgroup:

   Editing in Firebug is kinda like taking out the pickles from and
   adding mustard to a restaurant sandwich: you can enjoy the result, but
   the next customer at the restaurant will still get pickles and no
   mustard.

The reason is that the HTML output is normally dynamically generated by some kind of server script language like e.g. PHP.

Though what could be done is to provide some mapping between URLs and files on your local machine. Meanwhile, you can try Firediff, an extension for firebug by Kevin Decker.

CSS Panel

How can I save changes I made inside the CSS panel back to my source file?

This feature is not integrated into Firebug, but there are some extensions, which do this (or at least let you save the generated CSS):

How to enabled the Console panel?

When the message appears that the Console Panel is disabled, you can click the "Enable" link inside of it. Open the Options Menu and click on "Enabled".

Script Panel

Why does the Script panel claim there's no JavaScript on the page when there obviously is code?

This means that your JavaScript contains a syntax error and could not be parsed by the browser. Check the Console Panel for the error position.

Is there an option to de-minify JavaScript?

Currently not, but there is already a request to implement de-minifying JavaScript. Also there is another extension called Javascript Deminifier that does exactly that. It is working independently from Firebug, so you can also use it together with other debuggers.

Why is there no syntax highlighting?

That's not implemented yet. See issue 4823. Though you can get syntax highlighting via an extension called FireRainbow.

DOM Panel

What do the different colors of the variables mean?

The DOM panel explains the different colors.

Miscellaneous

Why doesn't Firebug integrate feature X?

This can have different reasons:

Why is Firebug that slow?

When Firebug reacts slowly, this might have the following reasons:

  • loading huge files (mainly inside the CSS or Script Panel)
  • logging many things into the Console Panel
  • If you get an "Unresponsive script" message, it might be a [[1]].

How can I check from my website whether Firebug is enabled?

We try to avoid the detection of Firebug through websites for privacy reasons. There's also an issue related to this.

Can I change the shortcuts used within Firebug?

Yes, via Firebug Menu > Customize Shortcuts or by pressing Ctrl/⌘+Shift+Alt+B you can open the Firebug Shortcut Bindings dialog, in which you can change the shortcuts.

Can you check the code I wrote for my Firebug extension?

If you have a specific issue you always contact us via the discussion group or IRC.

Please make sure you're asking about a specific issue. Unfortunately we normally don't have the time to check the whole code of your extension for errors or functionality.

How can I participate in the Firebug project?

There are many ways how you can help us. Please read about How to become a contributor.

Issues

Where to get help?

General info

I can't install Firebug. What can I do?

Normally Firefox will tell you the reason when an extension couldn't be installed. Common reasons are:

  • The Firebug version you wanted to download is not compatible to the Firefox version you use. => Check the compatibility table above.
  • A file couldn't be written. => Restart Firefox and try again.
  • "Invalid file hash (possible download corruption)" => Try a new profile; Re-install Firefox.
  • You get an error message inside Firefox' Error Console like "installLocation has no properties" => Try a new profile; Re-install Firefox.

If you're using Windows, you can try the following:

  • With Firefox closed, locate your profile directory, delete these temporary files, they will be automatically re-created by Firefox:
 extensions.ini
 extensions.cache
 extensions.rdf
 compreg.dat
  • Disable any Antivirus or Backup program you may have running and then install Firebug.
    It may be that some software is stopping Firefox creating the file structures needed for the installation process.
  • Run Firefox as Administrator. It may be the same as in reason 2, because firefox doesn't have enough permissions.
  • Manually install Firebug.
    This can be done easily, just unzip the XPI (it's a normal zipped file with the extension changed) in your extensions folder, inside your profile. You should unzip firebug's XPI content inside a folder named 'firebug@software.joehewitt.com'. Do this with Firefox closed.

To get the XPI go to Firebug on addons.mozilla.org (AMO), right click on the "Add to Firefox" button and select Save Link As....

If your problem didn't get solved or your error message is not listed above:

Firebug crashes Firefox. What can I do?

Crash means the program exits.

Note that we're not responsible for fixing Firefox crashes - even when you can confirm that they are related to Firebug. Browser crashes can have different reasons. Generally in such cases it's a browser API Firebug uses, which is corrupt. When the browser crashes the Mozilla Crash Reporter should appear. To get the crash fixed please report it to Mozilla attaching the crash report URL, so they can fix it. Please inform us about the crash and post us the link to the report via the discussion group or IRC, though. Other people might have the same problem. In these cases we could point them to the report. If you see a crash, which affects many people, we might be able to find a workaround in some cases until it's fixed in Firefox.

Firebug hangs itself or Firefox. Why?

Hang means the program is still running (it did not crash) but it fails to respond to user commands. The causes and diagnosis is completely different from a crash. You should follow the steps for what to do when you experience a bug, so you can find out if it's a problem in Firebug or the browser and create a test case.

I found a bug in Firebug. What should I do?

Many problems with Firebug can already be solved by creating a new Firefox profile. Read about how to do this and further info on what to do when you experience a bug in Firebug.

Specific problems

The awesome bar and some menus are displayed transparently. Why?

There's a bug in Firefox causing this. As a workaround you can turn off hardware acceleration via Firefox Button > Options > Advanced > General > Use hardware acceleration when available.

Personal tools