~robcee/ more than just sandwiches

Posted
20 December 2012 @ 12pm

Tagged
devtools, Firebug, Mozilla

Firefox Debugger Search Features

One of the great unsung features of the Debugger is the built-in search facilities by Victor Porof. They started out simply-enough with a search field for filtering which scripts were displayed in the drop down. However, as of Firefox 18, this little search box has gotten some Super Powers.

View of the Search Field in Debugger

It still acts as a filter if you just start typing. The search field will limit the files that appear in the drop-down to files that include the substring. But if you use one of the listed operators, magical things will happen!

! = Search in all files (Cmd/Ctrl+Alt F) – This is Super Search. You can search all of the loaded script files for a given string. Useful for finding references to variable or function names across your project. Hitting Enter after your search takes you to the first result. Hit Enter again and it advances to the next occurrence and so on.

# = Find in this file (Cmd/Ctrl-F) – Search the currently-loaded file for occurrences of a string. Basic search. Hitting Enter behaves the same way as above taking you to the next occurrence.

: = Jump to line (Cmd/Ctrl-J) – go to the line number in a file. Useful for rapid navigation. Also note that the up/down arrows will let you move through the file without explicitly focusing the editor from here.

It’s worth noting that you can combine these in the form “filefilter#string” or “file:xxx” for line number.

* = Filter variables (Cmd+Alt-V). This one’s new (in Firefox 19, currently in Aurora). If you’re on a breakpoint and the variables view is visible, you can filter the contents of it with this search operator. Sweet.

… and, in a few days, when bug 762160 lands just in time for Firefox 20,

@ = Find Implementors. Locate the definition of a function across all scripts. If there are multiple definitions, it will present a file-list for your consideration.

Note the keyboard shortcuts next to all of these and visible in the palette. Cmd/Ctrl-P focuses the search field (a nod to the Sublime Text editor which has a powerful, operator-driven search capability) to get you searching quickly while using the Debugger. You will need to have the debugger itself focused for these keys to be in effect, otherwise, you’re likely going to encounter browser shortcuts that do different things. Also check out the docs if you want to read about some of the remote capabilities of the Debugger.

Happy Debugging!