Resolving source map references for CDN assets

[gustavnikolaj]

Given an app hosted on example.com referencing a javascript file script.js hosted on cdn.example.com. The html file on example.com loads cdn.example.com/script.js. An error is thrown, and stacktrace-gps is used to map the stacktrace with the sourcemap.

script.js contains a source mapping url reference which is root relative.

//# sourceMappingURL=/script.js.map

Expected Behavior

The source map is loaded from cdn.example.com/script.js.map.

Current Behavior

The source map is attempted to be loaded from example.com/script.js.map.

Steps to Reproduce (for bugs)

I managed to provoke a similar bug in the test suite.

        it('should resolve a root relative url to a source map on the same hostname as the referencing asset', function(done) {
            var source = 'var foo=function(){};function bar(){}var baz=eval("XXX");\n//# sourceMappingURL=/test.js.map';
            jasmine.Ajax.stubRequest('http://localhost:9999/some/folder/test.js').andReturn({responseText: source});
            jasmine.Ajax.stubRequest('http://localhost:9999/test.js.map').andReturn({status: 404});
            var stackframe = new StackFrame({args: [], fileName: 'http://localhost:9999/some/folder/test.js', lineNumber: 23, columnNumber: 0});
            new StackTraceGPS().getMappedLocation(stackframe).then(done.fail, done);
        });

The test is adapted from #getMappedLocation rejects if source map file 404s. It would pass if the URL to the source map was resolved correctly, but it will timeout as the code base is now.

This is not involving a CDN, but shows another example of how a root relative url should be resolved.

Context

I used stacktrace-js when implementing crash reporting functionality for a large webapp I'm working on. I was trying to implement the mapping of errors client side, and this bug meant that none of the errors I ship back to my monitoring endpoint is mapped.

Your Environment

• stacktrace.js version: 2.0.0
• stacktrace-gps version: 3.0.2
• Browser Name and version: Happens accross all tested browsers.
• Operating System and version (desktop or mobile): Happens across all tested operating systems.
• Link to your project: Unfortunately I am unable to share the code of the repository with you.

Possible Solution

This section of getMappedLocation should be extended to properly resolve root relative urls:

https://github.com/stacktracejs/stacktrace-gps/blob/1b80f11a6716dbd189dd08c89049b1efe6f45b65/stacktrace-gps.js#L321-L327

I can think of a few approaches:

1. Use a proper url parsing library.
2. Use an A-tag to parse the url: https://evanhahn.com/parse-urls-with-a-tags/

Option 1 is probably not the most attractive option for client-side use of stacktrace-gps, and option 2 is problematic when dealing with node.js where the document apis are not available.

A hybrid approach would work well, but I'm not sure how we would go about doing that, as it really quickly gets in to specifics about build tools and process.

I would love to provide a PR instead of an issue, but I don't think that there's an obviously right solution here, so I'd like to consult you first.