Incorrect content type for TypeScript files with `singleBundle: false`

[BenoitZugmeyer]

👋 I'm trying to migrate a TypeScript project from webpack to esbuild. We are using one bundle per spec file (our test suite will fail to execute if all spec files are in the same bundle). So I was quite happy to see the karma-esbuild singleBundle: false option. Sadly, I have an issue where generated bundles are served with the incorrect Content-Type: video/mp2t header, preventing Chrome to evaluate them.

Here is a minimal project to reproduce:

git clone https://gist.github.com/BenoitZugmeyer/c75043256523ac251766e6559cafdba3 test-project
cd test-project
npm i
npm test

Expected: the spec file is executed (you can see the assertion failing) Actual: the spec file is ignored (karma prints TOTAL: 0 SUCCESS)

You can see in the Chrome devtools "Network" panel that the bundle is served with an incorrect content-type header:

[jridgewell]

This is an issue with Karma, and it doesn't allow us to override the content-type without overriding the user's configuration. You can specify the correct type via the mime setting:

// karma.conf.js
module.exports = function (config) {
  config.set({
    mime: {
      'text/javascript': ['ts', 'tsx'],
    },
  });
}

[BenoitZugmeyer]

Thanks! This unblocks my situation, but sourcemaps seem to be missing. The issue is, in the bundle generated by esbuild, we can see:

//# sourceMappingURL=test.spec.js.map

But the source map is not available at this address. A warning message is displayed in the console:

DevTools failed to load source map: Could not load content for http://localhost:9877/base/test.spec.js.map: HTTP error: status code 404, net::ERR_HTTP_RESPONSE_CODE_FAILURE

It appears that the sourcemap is available at test.spec.ts.map. Maybe it could be fixed by providing the outfile esbuild option instead of outdir?

[jridgewell]

Great test case. I added a fix in #49 for both the content-type and the sourcemap URL.

[BenoitZugmeyer]

Thank you very much, the new release works great!