Sources maps are not generated for typescript files

[blaugold]

• Operating System: Ubuntu
• Cypress Version: 4.1.0
• Browser Version: Chrome 80

Is this a Feature or Bug?

Bug

Current behavior:

No source maps are generated for typescript files.

Desired behavior:

Source maps should be available for test files.

How to reproduce:

1. Clone https://github.com/cypress-io/cypress-example-recipes
2. run npm install
3. run cd examples/preprocessors__typescript-webpack
4. uncomment debugger in cypress/integration/spec.ts
5. run npx cypress open
6. open spec.ts
7. open devtools
8. rerun tests
9. devtools show transpiled file

Additional Info (images, stack traces, etc)

It seems that webpack does not generate the source maps when the the extension of the output file is .ts. Js files in the same project have source maps generated.

[jp7677]

I had the same issue, though after a lot of digging I finally got sourcemaps by adding the SourceMapDevToolPlugin plugin (https://webpack.js.org/plugins/source-map-dev-tool-plugin/) to my webpack configuration plus configuring *.ts to options.test of that plugin. Thus by specifying:

plugins: [
  new webpack.SourceMapDevToolPlugin({ test: /\.ts$/ })
]

See https://github.com/jp7677/hellocoreclr/blob/master/ui/test-e2e/plugins.js#L19 for a complete example.

I would love to know why this is needed. I don't had to do this with other webpack configurations where I use typescript.

[jp7677]

Maybe this comment provides a clue: webpack/webpack#4314 (comment)

Edit: may it is even just enough to append .js here: https://github.com/cypress-io/cypress-webpack-preprocessor/blob/master/index.js#L86

[chrisbreiding]

🎉 This issue has been resolved in version 5.1.2 🎉

The release is available on:

• npm package (@latest dist-tag)
• GitHub release

Your semantic-release bot 📦🚀