Debugging jquery exception with Firebug

Question

I am receiving a javascript error whose source line is in the jquery javascript library:

uncaught exception: Syntax error, unrecognized expression: #

I know what this error is: it usually happens if you try something like:

$('#');

However, I am struggling to debug it. It should be straightforward if I could just get a stack-trace. But Firebug refuses to either break-on-error or provide a stack trace.

I have tried clicking the "Break on error" button which is at the top left of Firebug's Console pane. I have also selected "Show Stack Trace with Errors" under the Console menu. But the exception still gets outputted without breaking and without a stack trace. Is there some other option in Firebug I could use... any tricks for debugging this message?

Answer 1

For debugging try:

console.log("#");

or

console.trace();

It will output stack traces into the FB console.

I think the problem is that you are trying to select an empty ID ("#") which throws the error. Jquery is probably parsing/looking for the id of "", which is an empty string using css selectors.

Answer 2

Download the development version of the jQuery library. In the jQuery function, add a console.log call to whatever selector was passed in. When you get your exception, the list of printed selectors should let you figure out where your code is going wrong.

Answer 3

You can try using the Javascript Stacktrace tool (there's even a bookmarklet version). You might also try the debuggers built into Safari or Chrome... unless of course your problem is specific to Firefox.