Firebug integrates with Firefox to put a wealth of development tools at your fingertips while you browse. You can edit, debug, and monitor CSS, HTML, and JavaScript live in any web page.
This project may be of some help for the following:
Alternatively you can use fiddler2 (only Windows as it written in .NET)
Reverse which libraries and frameworks used by page.
Based on code and incompotable with "Live HTTP Headers" extensions.
For JavaScript:
// Enables strict JavaScript warnings in the Error Console. user_pref("javascript.options.strict", true); // Logs errors in chrome files to the Error Console. Enable Components.utils.reportError(). user_pref("javascript.options.showInConsole", true); // Disables the XUL cache so that changes to windows and dialogs do not require a restart. user_pref("nglayout.debug.disable_xul_cache", true); // Enables the use of the dump() statement to print to the standard console. user_pref("browser.dom.window.dump.enabled", true); // This enables to run JavaScript code snippets in the chrome context of the Scratchpad from the Tools menu. user_pref("devtools.chrome.enabled", true); // This will send more detailed information about installation and update problems to the Error Console. user_pref("extensions.logging.enabled", true); user_pref("dom.report_all_js_exceptions", true); // This adds a "Browser Debugger" entry to the "Web Developer" submenu of the "Tools" menu. // The Browser Debugger can be used to debug the JavaScript code of extensions. user_pref("devtools.debugger.remote-enabled", true); // Detect deprecated code use. user_pref("devtools.errorconsole.deprecation_warnings", true);
Examine devtool options in about:config with prefix devtools.:
user_pref("devtools.debugger.enabled", true); user_pref("devtools.debugger.pause-on-exceptions", true); user_pref("devtools.debugger.auto-pretty-print", true); user_pref("devtools.debugger.chrome-debugging-host", "localhost"); user_pref("devtools.debugger.chrome-debugging-port", 6080); user_pref("devtools.debugger.ignore-caught-exceptions", true); user_pref("devtools.debugger.remote-enabled, true); user_pref("devtools.debugger.remote-host", "localhost"); user_pref("devtools.debugger.remote-port", 6000);
Instead of "Error Console" (press Ctrl+Shift+J) use "Web Console" (press Ctrl+Shift+K) in Firefox >=4.0:
console.log("str"); console.info("str is %s", "str"); console.warn("this is %o", this); console.error("int: %i, float: %f, string: %s, object: %o", 2, .333, "str", this);
To see stack-trace use:
console.trace(); console.log(new Error().stack);
See:
With Firebug you can use 'console.log(obj)' for logging. Also output can be grouped with console.group("name") to start a new indentation block, and then console.groupEnd().
Same but with different coloring do 'console.debug', 'console.info', 'console.warn', and 'console.error' functions.
Set in about:config browser.dom.window.dump.enabled to true.
All messages go to native console. On Windows this require -console option for firefox.exe.
Write error msg to Error console (not in Web Console):
Components.utils.reportError("msg"); // Show the error console. toJavaScriptConsole();
Firefox 3.x require set preference 'javascript.options.showInConsole' to 'true' which is default value fro Firefox 4.x.
Execute in WinDbg:
.sympath SRV*c:\symcache\*http://msdl.microsoft.com/download/symbols;SRV*c:\symcache\*http://symbols.mozilla.org/firefox
or Ctrl+S and add:
SRV*c:\symcache\*http://msdl.microsoft.com/download/symbols;SRV*c:\symcache\*http://symbols.mozilla.org/firefox
See: