How to inline sourceMap into source

[unional]

Sorry if this is a dumb question. I want to run tests on browser with typescript+jspm+tap-run:

const streams = require('stream');
const jspm = require('jspm');
const run = require('tape-run');
const tapSpec = require('tap-spec');


const testFileGlobs = process.argv[2];
if (!testFileGlobs) {
  console.error('No test file globs specified.');
  process.exit(1);
}

const builder = new jspm.Builder();
builder.config({ sourceMaps: true, sourceMapContents: true });
builder.buildStatic(testFileGlobs)
  .then((output) => {
    const reader = new streams.Readable();
    reader._read = function() { };
    reader.push(output.source);  // Should I / what should I do with output.sourceMap?
    reader.push(null);

    reader
      .pipe(run())
      .on('results', results => {
        if (!results.ok) {
          process.exit(1);
        }
      })
      .pipe(tapSpec())
      .pipe(process.stdout);
  });

This works. However when there is an error, the stack would not be very helpful:

    × (unnamed assert)
    -------------------
      operator: fail
      at: Test.assert [as _assert] (http://localhost:52686/bundle.js:1313:15)

So I want to add the sourceMap and embed it so that it can show stack trace on where it actually fail in the source code.
Is the sourceMap the right approach?

[mikeyoon]

the sourceMaps parameter should be 'inline', not just true. so:

builder.config({ sourceMaps: 'inline' }); //sourceMapContents will be automatically set

Note that due to traceur being used in the pipeline, the sourcemaps will probably be off. See #489.

[unional]

Thanks. I tried it, but seems like it doesn't work:

const builder= new jspm.Builder();
builder.config({ sourceMaps: 'inline' })
builder.buildStatic(testFileGlobs)
  .then((output) => {
    fs.writeFileSync('out.js', output.source.toString());
  });

The out.js only contain the compiled code, there is no sourceMaps. 😭

[aluanhaddad]

Forgive me if I'm missing something obvious, but where is your TypeScript configuration specified?

[unional]

No Problem. I would wish it is a stupid mistake on my side (so I can get it working quickly. 😏)
In tsconfig.json.

{
  "compileOnSave": false,
  "buildOnSave": false,
  "compilerOptions": {
    "module": "system",
    "moduleResolution": "node",
    "noImplicitAny": false,
    "outDir": "dist",
    "sourceMap": true,
    "baseUrl": ".",
    "paths": {
      ...
    }
  },
  "atom": {
    "rewriteTsconfig": false
  },
  "exclude": [
    "dist",
    "node_modules",
    "jspm_packages",
    "typings/browser",
    "typings/browser.d.ts"
  ]
}

And in jspm.config.js:

SystemJS.config({
  transpiler: "plugin-typescript",
  typescriptOptions: {
    "tsconfig": true
  },
  ...

[mikeyoon]

Not sure about this, but you might want to try specifying your options on the buildStatic call itself rather than doing builder.config.

builder.buildStatic(testFileGlobs, { sourceMaps: 'inline' })

Based on the sourcecode for builder.js, it seems that builder.config sets the loader config.

[aluanhaddad]

@unional Try adding

{
    "inlineSourceMap": true
}

[unional]

Yes, nice!!! Thanks @mikeyoon @aluanhaddad.

Turns up just builder.buildStatic(testFileGlobs, { sourceMaps: 'inline' }) would do the magic.
Having some issue with the stack trace:
tape-testing/tape-run#36
Don't know if it is related to what @mikeyoon mentioned:

Note that due to traceur being used in the pipeline, the sourcemaps will probably be off.

[unional]

Note that due to traceur being used in the pipeline...

Actually, might be not. Because my tests and source code are in typescript.

[unional]

Actually, might be not. Because my tests and source code are in typescript.

Oops. Said too soon. #489 (comment)

[unional]

In either way, this can be closed. Thanks. 🌹

[unional]

Seems like it is not mentioned in any docs. Reopen to track doc update.