Coverage overlay does not appear if coverage was collected with `jest --coverage` rather than `collectCoverage: true` in `jest.config.js`

Environment

1. node -v: v8.11.2
2. npm -v: 6.4.0
3. npm ls jest or npm ls react-scripts (if you haven’t ejected): jest@23.5.0
4. your vscode-jest settings if customized:

  "jest.enableCodeLens": false,
  "jest.pathToJest": "node_modules/.bin/jest",

1. Operating system: Mac 10.13.5 (17F77)

Prerequisite

• are you able to run jest test from command line? Yes
• how do yo run your tests from command line? (for example: npm run test or node_modules/.bin/jest) jest --coverage

Steps to Reproduce

If a project does not have collectCoverage: true in jest.config.js, and instead collects coverage through jest --coverage, then this extension does not show the coverage overlay for the project. I’m talking about the small text at the top of the file does not appear, and the color highlighting does not appear, when using Toggle Coverage Overlay, even though there is uncovered code in the file.

The output of both methods of coverage collection result in the exact same HTML output, so I don’t know why it would matter, but it definitely seems to. I’m guessing because this extension only looks for that key in the config, rather than checking the existence of the coverage files themselves?

If I add collectCoverage: true to jest.config.js, then run npx jest, then reload VSC, then the overlay will work.

[garyking]

What eventually fixed this issue for me, was to use the following VSC setting:

  "jest.pathToJest": "node_modules/.bin/jest --coverage --watchAll",
  "jest.runAllTestsFirst": false,

[connectdotz]

looks like there are a few issues entangled in this thread:

• First, it’s important to separate the coverage summary (the small text appeared on the top of the src file) from coverage overlay: summary should appear as long as jest produced the coverage info,; while overlays would have an extra dependency - sourcemap - to map source location for the transpiled files such as typescripts.

vscode-jest won’t be able to generate such sourcemap as it is highly depending on your transpile mechanisms (babel, react-native, typescripts etc) and therefore it’s your responsibility to ensure such map is produced… (although some examples in the doc might be quite helpful…)

• Now let’s look at the original question:

Coverage overlay does not appear if coverage was collected with jest --coverage rather than collectCoverage: true in jest.config.js

I tried both ways in the sample repo and found no such discrepency, as far as the coverage summary goes (since we are testing if the coverage is run).

One thing to note that when you update the config file, jest (if it findes it) will automatically pick up; but to add the command line option, you will have to configure it via jest.pathToJest, which you can verify by turning on the debug mode.

For people who had problem passing --coverage, if you can’t provide a sample repo to showcase such scenario, I am afraid there is not much to go on…

• Now the overlay, yes the overlay is not displayed properly in @nasreddineskandrani repo, and you did the right thing to separate it into a different issue.