Firebug Tips

From SquadLimberWiki

Jump to: navigation, search

F12 Toggle Firebug

Ctrl-Shift-K Find (Hit Enter to Find Next)

Ctrl-Shift-L Command Line

Ctrl-Shift-C Toggle inspect

Shift-Enter Inspect the result on the command-line.

Type #43 in the search box to go to line 43.

Hit the middle-mouse-button (or Ctrl-Click) whilst debugging to run through to the line you clicked on.

When editing CSS number like properties, e.g. 5px, use the Up & Down keys to adjust.

In the Script tab hit Ctrl-SPACE to get Quicksilver-style access to all files.

The DOM Tab shows all properties of the window object, the one's in bold are ones you have added.

console.log() used on an object will create a hyperlink to the current properties of the object, console.dir() will list the properties in the state they were when the dir() function was called.

console.trace() will output the function call stack.

Firebug Lite is a script which allows you to use console.log() in any browser.

Firebug Keyboard Shortcuts


Right-click inside a function in the Script tab and choose Log Calls to log every call to that function and show the contents of the arguments passed to it.

Right-click on an element in the HTML tab and choose Log Events to log all events for this element.

(You can filter for a particular event e.g. onclick by typing it in the Search Box.)


Logging links to objects - console.log('My obj is %o', myObject)

Personal tools