Firebug Internals

From FirebugWiki

(Difference between revisions)
Jump to: navigation, search
(How does debugging work?)
(Resources)
Line 3: Line 3:
*[http://www.softwareishard.com/blog/category/firebug/ The best place to learn about this is Honza's site]
*[http://www.softwareishard.com/blog/category/firebug/ The best place to learn about this is Honza's site]
-
*[http://www.softwareishard.com/blog/firebug-tutorial/extending-firebug Extending Firebug]  
+
*[http://www.softwareishard.com/blog/firebug-tutorial/extending-firebug Extending Firebug]
 +
 
 +
== Source ==
 +
 
 +
Firebug source is available [http://code.google.com/p/fbug/source via subversion]
 +
 
 +
Don't use ''/trunk'', its just old code.
 +
 
 +
The Firebug source is under branches, eg branches/firebug1.5.
 +
 
 +
* fbtest/ Firebug test harness
 +
* tests/content contains the FBTest suite.
 +
* lite/ Firebug for non-Firefox browsers
 +
* chromebug/ Debugger for Firebug (and other Firefox extensions)
 +
* Most of the remaining directories are extensions (to be under extensions/ some day).
== How are the XUL files used? ==
== How are the XUL files used? ==

Revision as of 04:36, 7 November 2009

Contents

Resources

Source

Firebug source is available via subversion

Don't use /trunk, its just old code.

The Firebug source is under branches, eg branches/firebug1.5.

  • fbtest/ Firebug test harness
  • tests/content contains the FBTest suite.
  • lite/ Firebug for non-Firefox browsers
  • chromebug/ Debugger for Firebug (and other Firefox extensions)
  • Most of the remaining directories are extensions (to be under extensions/ some day).

How are the XUL files used?

  • browserOverlay.xul : puts Firebug into the bottom of the browser window by "overlay" on to Firefox's browser.xul
  • firebug.xul: puts Firebug into its own window.
  • firebugOverlay.xul: overlays browserOverlay.xul or firebug.xul to add placement-independent features by XUL.

How are panels created?

Basically follow the pattern of an existing panel.

  • extend Firebug.Panel
  • add methods
  • use 'this.context' for context dependence
  • Add UI to 'this.panelNode' as HTML.
  • Learn about domplate to create the HTML
  • registerPanel

How does debugging work?

See the Chromebug User Guide

How to write a firebug extension?

A Firebug extension is just a Firefox extension that happens to work on top of Firebug.

How to use FBTrace?

if (FBTrace.DBG_YOUREXT)
  FBTrace.sysout(<string>, object);
Personal tools