systemjs: Sourcemaps not correct when Error is not inside exported function

Sorry for flooding with issues, I’ve closed the original one - https://github.com/systemjs/systemjs/issues/489 I am not sure if this is a bug or just a limitation. I’ve tested it using both Babel and TypeScript as a transpiler and the result was the same.

Let’s say i have a file app.js and index.html.

A SCENARIO WHERE IT WORKS AS EXPECTED app.js

export function bootstrap() {
    unknown_function_call('sourcemaps are OK'); // app.js:2 Uncaught (in promise) ReferenceError: unknown_function_call is not defined
}

index.html

<script>
    System.import('app').then(function(app) {
        app.bootstrap();
    });
</script>

A SCENARIO WHERE IT DOES NOT app.js

unknown_function_call('sourcemaps are WRONG'); // jspm-sourcemaps-test.dev/:1 Uncaught (in promise) Error: unknown_function_call is not defined

<script>System.import('app')</script>

I’d expect here it tells me the error comes from from app.js:1, not from the root.

About this issue

Original URL
State: closed
Created 9 years ago
Comments: 24 (14 by maintainers)

Most upvoted comments

This seems like a Chrome-specific debugging optimization. Perhaps we have to choose between being able to add extra information to the error message and having the error message show the right source maps.

As an alternative, perhaps try:

System.import('x')
.catch(function(e) {
  if (e.originalErr)
    throw e.originalErr;
  throw e;
});

I suspect throwing the e.originalErr should give the same source maps result you’re aiming for with your extension here. If so, perhaps we can just document this as an alternative workflow for source maps.

guybedford on Apr 24, 2016

I managed to get SystemJS to wrap soon to be loaded code in a function and eval() it in the instantiate hook, then call that function when importing (so it doesn’t run synchronously inside the same eval that contains the source map). It did not help.

This far easier solution fixed everything for me:

var oldInstantiate = System.instantiate;

System.instantiate = function(load) {
    return(oldInstantiate.call(this, load).then(function(result) {
        if(!load.metadata.bundle && load.metadata.format.match(/^(amd|cjs)$/)) {
            load.source = 'try {' + load.source + '\n} catch(err) {console.error(err.stack);}';
        }

        return(result);
    }));
}

Errors encountered during a synchronous import now show the correct line of code according to the source map.

jjrv on Apr 20, 2016