Create-react-app: Code coverage comments like `/* istanbul ignore file */` are ignored for jsx files

[dbartholomae]

Is this a bug report?

Yes

Did you try recovering your dependencies?

Yes - I have a minimum repo to reproduce.

Which terms did you search for in User Guide?

istanbul comment
coverage comment

Environment

System:
OS: Windows 10
CPU: x64 Intel(R) Core(TM) i7-8550U CPU @ 1.80GHz
Binaries:
Yarn: 1.12.3 - C:Program Files (x86)Yarnbinyarn.CMD
npm: 6.4.1 - C:Program Filesnodejsnpm.CMD
Browsers:
Edge: 42.17134.1.0
Internet Explorer: 11.0.17134.1
npmPackages:
react: ^16.7.0 => 16.7.0
react-dom: ^16.7.0 => 16.7.0
react-scripts: 2.1.2 => 2.1.2
npmGlobalPackages:
create-react-app: Not Found

Steps to Reproduce

Code coverage comments like /* istanbul ignore file */ are ignored for jsx files. When you set up a new app, adding this line to index.js doesn't work. This seems to be related to the Babel config as pure JS files work fine.

Here's an example repo:

1. Clone https://github.com/dbartholomae/coverage-bug
2. Run npm test (note that the command is modified in package.json and includes the coverage flag)

This could be related to #5756

Expected Behavior

Neither index.js nor index-no-jsx.js should show up in the coverage-report.

Actual Behavior

index.js shows up in the coverage-report.

Reproducible Demo

See "Steps to Reproduce"

[mrmckeb]

Hi @dbartholomae, you can actually use Jest here to ignore files. I know Istanbul comments work with Jest, but I'm not sure that specific comment does.

As an example, here I'm ignoring all tsx files (for no good reason):

  "jest": {
    "collectCoverageFrom": [
      "src/**/*.{js,jsx,ts}", 
      "!src/**/*.tsx"
    ],
  }

[dbartholomae]

Thanks! Unfortunately that solution isn't ideal as I will have to add it to multiple files, and adding it in a central file introduces unnecessary coupling that makes it harder to refactor later on.
Furthermore the comment is respected in the .js file, only in the .jsx it is ignored - as are other comments like ignoring the next line. I assume it has to do with Babel config, maybe Babel throws out comments?
Btw I'm happy to help if there is a good way of doing so.

[mrmckeb]

Hi @dbartholomae, I understand - I had assumed this was a jest issue, and that would explain why they have the coverage ignore patterns.

So, it sounds like the JSX transform is removing the comments... but that's also quite confusing, as it would be affecting a lot of people. Can you see the comments in your HTML report?

[dbartholomae]

Yes, the comments are shown. I've also set up a repo which reproduces the bug with basically 2 lines changed compared to the vanilla verion created by create-react-app:
https://github.com/dbartholomae/coverage-bug

[FezVrasta]

In my case, the file I add the comment to drops to 0% coverage even if it was higher without the comment (rather than ignoring it)

[stale[bot]]

This issue has been automatically marked as stale because it has not had any recent activity. It will be closed in 5 days if no further activity occurs.

[FezVrasta]

@mrmckeb may you guys add some label to prevent this from getting auto-closed by the stale bot? This is a verified issue, there's no reason to close it automatically just because you guys are busy working on other things.

[mrmckeb]

Hi @FezVrasta, sorry about that. We need to investigate this more. Would anyone be interested in picking this up and submitting a PR? If not, I can take a look this week.

[dragonghy]

+1

[FezVrasta]

I'm trying to upgrade to 3.x one of my projects and now I'm reproducing this issue even on .js files. Is there any progress on this issue?

Thanks!

[jensbodal]

FWIW, for me the file was was only ignored if I placed this comment at the top of the file and had a newline between it and the next block:

WORKS

/* istanbul ignore file */

import { Foo } from 'bar';

DOES NOT WORK

/* istanbul ignore file */
import { Foo } from 'bar';

[nickmccurdy]

I don't seem to have this issue on src/index.tsx