Source Map Support

TrackJS has full support for source maps, along with a few other tricks that can make diagnosing errors easier.

• Automatic Retrieval
• Whitelisting IP Access to Sourcemaps
• Drag and Drop Support
• Other Options

Automatic Source Map Retrieval

Whenever you view an error in TrackJS, we will attempt to find and retrieve the source maps associated with that stack trace. There are a few things necessary to ensure this works.

• There must be a stack trace.
• The JavaScript file(s) in the stack frames must be publicly accessible.
• There must be a single source map directive in the file.
• The source map file itself must be publicly accessible.

Assuming these criteria are met, you’ll see a little green toggle in the stack trace pane, and you’ll now have real file, lines and columns to look at. If you’ve optionally included the original source in your map, we will include that and beautify it as well.

Whitelisting IP Access to Sourcemaps

Some customers do not want to expose their sourcemaps publicly, especially if they include the original source. One solution is to whitelist the TrackJS servers that make sourcemap requests. Our servers have static IPs, so you can confidently add exceptions for them.

Server IPs

142.4.218.95
167.114.172.73
198.27.94.180

Configuring Nginx

server {
  # ... Somewhere in your server block
  location ~ \.map$ {
    allow 142.4.218.95;
    allow 167.114.172.73;
    allow 198.27.94.180;
    deny all;
  }
}

Configuring Apache

<Files ~ "\.map$">
  Require all denied
  Require ip 142.4.218.95
  Require ip 167.114.172.73
  Require ip 198.27.94.180
</Files>

Drag and Drop Source Map Support

If you’re developing an internal application, or on a development environment, your source map information may not be public. In that case, we also support the option of drag and dropping a source map right on the stack trace as well. This works exactly like the automatic retrieval, except you’re in full control. It’s also worth noting that if you use drag and drop, your sourcemap file is never sent to our servers, and is processed strictly client side.

Snippets

Don’t use source maps? No problem! We also support beautification of minified files. Assuming we’re unable to apply a sourcemap for whatever reason, each valid stack frame will have a “View Raw Source” link next to it.

If you click on one of those links, we’ll retrieve the minified version of the script, at the specified line and column, and run it through a beautifier. This is usually more than enough detail to figure out which original file was the culprit. For example, here’s the same code without source maps, but using the beautifier. Pretty darn close, minus the extra webpack stuff.