Jest: [BUG] Typescript bad coverage

[CarlosSoares]

Do you want to request a _feature_ or report a _bug_?
BUG

What is the current behavior?
Right now when I execute the jest command and it never give me 100% of coverage.

If the current behavior is a bug, please provide the steps to reproduce and if possible a minimal repository on GitHub that we can npm install and npm test.
I created an simple example with the bug: Repository
Is just npm install and after that npm test and if you guys see the coverage report it appears 87.5% and if you guys open the coverage report in the browser you guys see the issue that I'm having.

What is the expected behavior?
That the coverage it will be at 100%

[beckend]

I have the same problem.

[cpojer]

cc @dmitriiabramov

[jsynowiec]

I'm not getting same results. Coverage seems to be reported correctly, but I'm not using React or tsx files. Don't know if this helps.

[CarlosSoares]

@jsynowiec when I try with an simple class without using react only with ts extension the coverage works fine.

[jsynowiec]

I have some more complex classes that extend others and still, coverage works. Only difference that I can see right now is the React library and jsx.

Do you have type definitions?

[CarlosSoares]

Yes, but I don't think that is the issue, but I don't know for sure.
If you download the repository you can see the issue that I'm having.
The funny thing is if I use the var MyClass = React.createClass({}) it works fine, but if I use export class MyClass extends React.Component<{}, {}> {} the report is wrong. I already tried change the tests in jest and it fails also.

[kwonoj]

I think this is similar case to https://github.com/facebook/jest/issues/1584, jest supports preprocessor to transpile codes but coverage remapping's on consumer's own in case of TypeScript in opposite to babel which jest supports natively.

I was able to create proof-of-concept code snippet does remapping code coverage to generate correct test coverage, shows below differences.

_raw coverage_

_remapped coverage_

I hope jest supports hook for coverage processing as same as preprocessing compilation allows to create / or existing preprocessor integrates coverage remapping as well. (Maybe it's already available but I didn't noticed?)

Anyone interested can look code snippet at https://github.com/kwonoj/jest-typescript-coverage.

[CarlosSoares]

I got an solution for this, basically what I do is using an custom typescript processor and change the target from ES5 to ES6.
Always run with the option --no-cache and should start working fine.

const tsc = require('typescript');

const compilerOptions = require('./tsconfig.json').compilerOptions;
compilerOptions.target = "ES6";

module.exports = {
  process(src, path) {
    if (path.endsWith('.ts') || path.endsWith('.tsx')) {
      return tsc.transpile(
        src,
        compilerOptions
      );
    }
    return src;
  },
};

[beckend]

I was using target ES6 to begin with and it's not working.

[CarlosSoares]

That's weird then, can you try replicate in a clean repository an give the link to see if I can help in some way?

[beckend]

You can use the active repo react-themeable-ts.
You need:
npm -g i jest-cli
npm i
jest --coverage
And you can find coverage folder in root.

[CarlosSoares]

@beckend after tried in my own application you're right and didn't solve my solution.

Could this to be done in karma or another tool?

[kwonoj]

Anyone interested in this topic can refer https://github.com/kulshekhar/ts-jest/pull/25 as well, I've managed code coverage remapping works with testresultsprocessor. Unfortunately this is not ideal approach as given interface from jest lacks of few things.

• jest does not allow return post processed results to back to jest runtime
• testresults delivered by testresultsprocessor does not contain empty coverage from uncovered files
• jest configuration is not passed into processor, so process need to own responsibility if it need to figure out current configuration of jest

[cpojer]

TypeScript support in Jest is not "officially" supported by us. I recommend using ts-jest like @kwonoj mentioned. As somebody pointed out above, if the preprocessor prints code with different line numbers etc., Jest cannot do the proper remapping on its own so this is strictly out of the scope of Jest.

@kwonoj feel free to send PRs to solve any of the problems you outlined above if that will help you have better coverage support.

[alexgorbatchev]

ts-jest README says to add "mapCoverage": true to jest config. This has fixed the mapping for me.

[zackify]

@alexgorbatchev thanks for this, it's not mentioned well enough in the docs!