Are JavaScript source maps used to detect errors?

Question

I did client-side exception logging with window.onerror , where I retrieve the current error and stack trace and send it to the server using AJAX

  window.onerror = function(message, url, line) { var stackTrace = printStackTrace(); //get stack trace //send message, url, line and stackTrace to the server using an ajax call } 

where printStackTrace is the function provided by this library: http://stacktracejs.com/

The problem is that all JavaScript files are reduced in production, so the stack trace and line number are not very useful, because all error messages are reported on line 1 in the file, which is normal, since the miniature version contains one line of code. For instance:

 Message: Object doesn't support property or method 'indexOf' URL: http://[server]/[site]/content/combined/combined.635EE367354E6DF721593CAC56FECF95.min.js Line: 1 

Can this be improved using source maps, or does it only work when the developer tools are active?

I would like to get a full stack trace using the source maps (or at least the real line number) when an error occurs for a user who does not have activated / activated developer maps. Is this even possible?

Answer 1

You can definitely get all the information contained in the source maps and design the stack trace yourself, but AFAIK is not yet an elegant solution. In any case, this will require a minimal change to the map file and, possibly, the source file. And you will have problems with a hard cross browser, as not all browsers fully support the source maps.

It seems that the stack trace has this in its plan, but no one has yet done it: https://github.com/eriwen/javascript-stacktrace/issues/44

Get Sentry does this as part of its js logging utility, but it is wrapped in a more feature-rich tool, and I believe that it only supports stack logging in Chrome now: https://github.com/getsentry/raven-js