How to use Firebug when debugging Javascript entailing focus/blur event handling

6
votes

I'm trying to use Firebug to debug some Javascript that entails blur and focus event handling, specifically some auto-complete/look-ahead functionality. The issue is that, merely by clicking on the various tabs within Firebug, such as "Console", "Script", "DOM", etcetera, the blur() event in my application is being fired, and then the focus() event when I subsequently click back in the text field that auto-complete is being driven by. The fact that these events are being unnecessarily being fired when trying to interact with Firebug, makes the debugging itself problematic if not well nigh impossible.

Has anybody else encountered this Catch 22, and/or does anybody have solutions/suggestions?

4
javascriptdom-eventsfirebugonbluronfocus
I'm trying to use the interactive debugger so console.log does me no good. You need to click the mouse and or press keys in order to do interactive debugging, and these trigger the blur() event in the browser – Dexygen

4 Answers

0
votes

Could you switch them to debug. i.e. instead of using blur() and focus() use click() or hover().

0
votes

not sure about your question, but as Alex said, you can still use the console to log events and any other javascript things.

For example

var x =5;
console.info(x);
x = 9;
console.info(x);

Run this code in your javascript and you'll see it in the console.

0
votes

Use keyboard instead? http://getfirebug.com/wiki/index.php/Keyboard_and_Mouse_Shortcuts

Also: ->options->show quick info box (then click inspect button) will show a capsule of info about everything you mouse over - if that helps

0
votes

Had a similar experience trying to style a typeahead plugin. Best solution I found was right-clicking an element in the firebug dom and checking "break on child addition and removal" (you can also break on attribute change etc).