Software is hard

• Published:October 11th, 2008
• Comments:4 Comments
• Category:Firebug, Planet Mozilla

I wrote a post about my FBTrace Console extension a few months ago and as it turned out that the console is actually quite useful for exploring how Firebug works internally, it's part of the Firebug's code base now.

This new feature is integrated in Firebug 1.3X (still in alpha phase), where X means: the version with tracing enabled.

The primary purpose of the console is to display a list of tracing messages coming from Firebug as it runs. It's often tough to debug a debugger by another debugger and so, having the possibility to inspect logs is often really invaluable.

Notice that tracing-console is *not* the same as Firebug's Console panel. Console panel is intended to be used by web applications developers, while tracing console is for Firebug (or Firebug extension) developers.

So, move on if you want to see how it works...

Tracing Console Features

First, there is a new menu item in Firebug (again, only in X version) that is used to open the tracing console window. There is also a new option, which can be used to open it automatically when Firebug starts.

The name of the underlying auto-open preference (boolean) is:

As soon as the console window is opened it should look like as follows:

There are some handy toolbar buttons that make possible to remove all logs (Clear), open Find bar to search for words or phrases (Find), put a separator into the list (Bookmark) and finally exit or restart Firefox.

You can also see two tabs. Logs tab is intended to display list of all logs and Options tab is used to specify, which kind of logs should be collected. You can select an option by clicking on it. For example, if you select NET option, you'll see all logs related to Firebug's Net panel activity. Every option is associated with a preference (in the Firefox user profile), so your selection is persistent.

Every trace-message (log) in the trace console can be expanded by a mouse click in order to see more information. There is always (at least) a Stack tab so, you can quickly find out where the message is coming from. In case you are running Chromebug (made by John J. Barton), clicking on the stack-frame opens Chromebug with the source file scrolled automatically to the proper line. You can also use Chromebug to inspect objects displayed by the tracing console. All is nicely linked together: Firebug, Chromebug and Tracing Console (however still alpha phase).

If a trace-message is associated with an object (which is often the case), there are additional tabs displayed (depends on object's type) so, you can see e.g. all its properties, implemented interfaces etc.

How to use it from another extension

Firebug tracing-console is also ready to be used from another extensions. So, if you are developing a Firebug (or just Firefox) extension, you can log information also from your code. It's simple, see the following guide.

First, you have to specify a group of your logs. This group will be displayed within the Options tab so, you'll be able to switch on/off your tracing (just like the other options). The underlying preference value is updated accordingly.

In order to setup your own group/option, you just have to create a new boolean preference. If you are tracing a lot from your code, it's useful to create more options. This helps to filter out the output list of log messages.

Notice that your preference should be created within your extension's preference domain (e.g. extensions.firecookie). The preference name (the part after the last dot) must begin with DBG_.

Now, you have to get reference to a firebug tracer object that is used to log messages. Use your extension's preference domain as a parameter for getTrace method (extensions.firecookie in the following example).

Finally if you want to trace, use following code:

The FBTrace.DBG_COOKIES and FBTrace.DBG_COOKIES2 properties are automatically set as you enable/disable them in the Options tab.

Bookmark to: