Comment by paulirish | Hacker News Reader

Comment by paulirish | Hacker News Reader

Logging JS errors is quickly becoming easier than you think. :)

On the spec side, we have access to the the column number and… <drumroll>… the stack trace! This took a long time, but it's in now. https://mikewest.org/2013/08/debugging-runtime-errors-with-w...

Chrome already has support and.. if past release schedules are maintained, all users of Chrome should have this feature within the next week. Firefox already has support for the CORS behavior and is working on adding the stack to onerror.

If you want cross-browser stack traces: https://github.com/occ/TraceKit. It's used reliably by many large projects. If you want to track these in a reasonable dashboard: https://getsentry.com/ Sentry even supports sourcemaps, so you can map an error of "e.a is not a function" back to the original unminified JavaScript. Also, open source.

We're turning on CORS for the Google JS Library CDN, too.

"within the next week" -- Awesome!

"We're turning on CORS for the Google JS Library CDN, too." -- Awesome!

Things are looking up!

Unfortunately, Firefox and Safari still don't provide column numbers in error stack traces, only line numbers, which are next to useless if your code is minified. Here's the Firefox bug:

https://bugzilla.mozilla.org/show_bug.cgi?id=762556

Not much discussion about fixing it :( This caused a lot of pain at my last job. When we got Chrome and IE10 stack traces, we had a script run them through our source maps and show us the exact, full stack trace through the unminified source. Firefox's and Safari's traces remained impenetrable, short of manually inspecting the minified line of code and guessing.

Suggesting TraceKit is pretty much:

"In order to get stack traces, you need to wrap your code in a try/catch block like above. Otherwise the error hits window.onerror handler and will only contain the error message, line number, and column number."

TraceKit doesn't do this for you; you still need to wrap in try/catch, so you might as well just do that and have the error/stack trace there.

If using jQuery, it is a few lines of code to add try/catch around the majority of your code entry points.

Go to https://github.com/getsentry/raven-js/blob/master/dist/1.0.8... and you will see code that wraps $.event.add(), $.fn.ready(), $.ajax(), window.setTimeout() and window.setInterval() (search _helper).

Super excited about CORS and sourcemaps on all of the CDNs.

Once all vendors get onboard with reasonable native exception tracebacks life is going to be so much better.

Still a long ways to go, but great to see people making progress.

Reply on news.ycombinator.com