code-coverage doesn't work w/o babel for typescript

[akoidan]

Related stackoverflow issue

It's not clear from the documentation that babel is nessesary for code coverage to work.

The article provided in the docs cypress-typescript-coverage-example uses babel. But

• babel doesn't check types on ts files, it just strips them. We can use ts-loader in a separate thread, but that doesn't solve the next problem.
• vue-property-decorator doesn't support babel.

I'm using ts-loader with typescript and webpack and don't use babel at all. Currently what I see is:

If you cannot use .babelrc for some reason (maybe it is used by other tools?), try pushing babel-plugin-istanbul directory to browserify plugins list.

and all I need to do for typescript is:

 npm i -D @istanbuljs/nyc-config-typescript source-map-support ts-node

package.json:

{
  "nyc": {
    "extends": "@istanbuljs/nyc-config-typescript",
    "all": true
  }
}

Solution

• if coverage is not possible w/o babel, please stay so in the README.md
• if coverage is possible w/o, please provide the link to a working example in the documentation and/or the documentation on how to do it.

Example w/o babel that doesn't work

• yarn install
• yarn start &
• yarn run e2e

Expected non-empty coverage to be in coverage dir in the root.

You can also switch to babel branch to see that babel loader fails as well with vue-property-decorator + vue + typescript. So atm there's no way to make vue-property-decorator work with cypress coverage ;(

[bahmutov]

Have you seen one of the linked examples https://github.com/skylock/cypress-angular-coverage-example#get-code-coverage-on-angular that uses istanbul-instrumenter-loader inside WebPack - I think you can do the same. If you can do it successfully let me know, and we can include your project as an example for all Vue + TS users

[akoidan]

Have you seen one of the linked examples https://github.com/skylock/cypress-angular-coverage-example#get-code-coverage-on-angular that uses istanbul-instrumenter-loader inside WebPack - I think you can do the same. If you can do it successfully let me know, and we can include your project as an example for all Vue + TS users

Hm I think there's no way to do instanbul coverage w/o babel, since istanbul-instrumenter-loader has a babel dependency as well

That still doesn't solve my problem. Even with babel-loader -> ts-loader -> babel-loader I still can't get coverage work with VUE :(

[akoidan]

No away it's ever gonna work with typescript compiler, @babel-typescript seems to be the only way to get it work. For type checks we can run typescript as a separate process. I added an example to PR