Detect when is Firebug (or any other web-debugger) used for debugging

6
votes

I have a Javascript application that relies on capturing keyboard events in a textarea. While testing and debugging it on Firefox (14.x) with firebug (1.10.2) I noticed that my application behaves differently when I have breakpoints active and the debugger is working.

I know how to detect Firebug but I would like to know if it is possible to detect (with Javascript) when the Firebug is actually used for debugging?

Edit: here is an example on some random site

This site catches the key event in an input box, prints out character code and replaces the pressed key with a text representation (ie. "enter" for enter key) or an uppercase (if a letter).

When I debug it with Chrome and place a breakpoint on the listener function, nothing happens when the breakpoint is reached (as expected), when I resume the script the text is printed out as normal.

When I debug it with Firebug on Firefox: Let us say that previously I pressed the "e" letter and the input bar contains text "E". I turn on the breakpoint and press letter "z". Firebug stops at the breakpoint but the input bar now has text "Ez" instead of "E". When I resume the script, this text is replaced with "Z" as expected.

I tried out another Firefox debugger (Venkman 0.9.89) and the same thing happened. So my guess is this is a Firefox problem, not the debugger problem. So the question might be more general, can it be detected when is the Javascript code being debugged?

2
javascriptdebuggingfirefoxfirebug
This is a very odd requirement. How is your application behaving differently? Maybe you should address and fix your application's behaviour rather than try to work around it - it usually shouldn't behave differently when being debugged, and maybe there is a architectural problem behind it. And what about the many other debuggers out there? You would have to detect them all... - Pekka
Does it work differently when Firebug is working even if you have no breakpoints or other differences from non-Firebug runs? - Yusuf X
I am capturing the event, processing it and preventing it. While debugging the method that does the work, the event actually happens before my method is called, therefore I am unable to prevent it. Since my application works while Firebug is turned off I supposed this behavior was not a Firefox problem. Finding another debugger did not occur to me, thank you for the idea! Also, while Firebug is turned on but not debugging, everything is working fine. - Bikush
Any minimal code to reproduce would be really helpful. Trying to minimize the amount of code which reproduces the quirk will also help you understanding better what's happening. Ad Firebug, it does not work well when debugging asynchronous code. If you halt on debugger in some place, and in the meantime there's active setTimeout to be invoked, Firebug doesn't freeze the clock. See here for more: stackoverflow.com/a/11834880/245966 - jakub.g

2 Answers

2
votes

This is what I do to detect Firebug:

if (window.console && (window.console.firebug || window.console.exception)) {
  // At this point, Firebug is enabled
}

The first test is important to make sure that the console actually exists The second one will test for Firebug, although it will only work for older versions of it. The third one is there as Firebug adds the "exception" This is because the property "exception" is added by Firebug's plugin.

(Unrelated but interested: window.console.exception is the method used by Firebug to display a message onto the console. For example, type:

>>> window.console.exception("A message", {param:'Value'})

You will see an error that will look very familiar, with a dump of the passed object!

Merc.

1
votes

Well, hope this answer will help someone.

Let function we debug to be such as:

function debugged()
{
   debugger;
}
setTimeout(debugged, 3000);

add this debug detection code is:

setTimeout(this.x = function(a){ s = Math.abs(new Date() - a.c - 1000); a.c = new Date(); setTimeout(a.foo,1000, a); if(s>100)console.log("debug") },1000, {c: new Date(), foo:this.x})

so if we run it in some place and open debugger, it will trigger breakpoint and debug event will be catched(you can see it by "debug" word appearing in console). This is a concept, you may change detection period time and a way of raising debug flag. Thanks to single-threaded javascript.