30

I trying to collect test coverage for this project using

yarn test --coverage # i.e. "react-scripts test --coverage"

My jest config is this:

  "jest": {
    "collectCoverageFrom": [
      "src/**/*.ts*"
    ],
    "coverageThreshold": {
      "global": {
        "lines": 90,
        "statements": 90
      }
    }
  }

and my folder structure is as follows:

.
├── package.json
├── postcss.config.js
├── public/
├── README.md
├── src/
│   ├── App.css
│   ├── App.test.tsx
│   ├── App.tsx
│   ├── assets/
│   ├── components/
│   │   ├── Emoji/
│   │   │   ├── Emoji.test.tsx
│   │   │   ├── Emoji.tsx
│   │   │   └── index.ts
│   │   └── Home/
│   │       ├── Home.css
│   │       ├── Home.test.tsx
│   │       ├── Home.tsx
│   │       └── index.ts
│   ├── index.css
│   ├── index.tsx
│   ├── react-app-env.d.ts
│   └── serviceWorker.ts
├── tsconfig.json
├── yarn-error.log
└── yarn.lock

Jest is being able to find all the tests but it fails to collect coverage:

 PASS  src/components/Home/Home.test.tsx
 PASS  src/components/Emoji/Emoji.test.tsx
 PASS  src/App.test.tsx
----------|----------|----------|----------|----------|-------------------|
File      |  % Stmts | % Branch |  % Funcs |  % Lines | Uncovered Line #s |
----------|----------|----------|----------|----------|-------------------|
All files |        0 |        0 |        0 |        0 |                   |
----------|----------|----------|----------|----------|-------------------|

Test Suites: 3 passed, 3 total
Tests:       3 passed, 3 total
Snapshots:   0 total
Time:        3.432s
Ran all test suites.

What am I missing? What should I add to the configuration to get the coverage?

Any hint is welcome :)

Tries

  1. Changing the glob pattern to "src/**/*.{js,jsx,ts,tsx}".
  2. Removing node_modules and then running yarn to reinstall everything.
  3. Removing node_modules and yarn.lock, and then reinstall everything, which led to another bug, which I tried to solve installing that particular dependency, but it didn't work.
  4. Cloning the repository from GitHub and then running the command on the fresh version.
  5. Switching to a different Node version (v10.16.2, and v11.7.0).
Lual
  • 1,776
  • 1
  • 20
  • 24
  • 1
    I downloaded your project and ran the test. It collected coverage correctly – Tien Duong Aug 11 '19 at 15:15
  • @TienDuong O.O, then it must be something related to my environment, what's your OS and Node version? did you run the tests using yarn or npm? – Lual Aug 11 '19 at 16:31
  • 1
    I used Win 10, Node 10.16 and yarn – Tien Duong Aug 11 '19 at 16:38
  • @TienDuong thanks for the info, I downgraded my Node version and rerun and still no luck. I'm using Linux though, but I'm also able to collect coverage in a work project that has almost the exact config in this machine, so it's kinda weird :/ – Lual Aug 11 '19 at 16:48
  • 3
    I had similar trouble, not sure if for similar reasons. I added "--watchAll", so `react-scripts test --coverage --watchAll` and it worked... – atomictom Nov 05 '19 at 00:24
  • @atomictom it worked! thanks! please post the comment as an answer to accept it as the solution :) – Lual Nov 08 '19 at 11:46
  • adding --watchAll or --watchAll:false does not work for me – Jason G Feb 03 '20 at 19:16

7 Answers7

38

The quick fix I said in my comment, using --watchAll instead, eg: react-scripts test --coverage --watchAll.

Just for future reference, I think ideally we should be using --watch, which would only run on changed files, but it gave me the same trouble. I think it's related to this issue '--coverage --watch' should calculate coverage for all files at first iteration and also this issue No coverage when running in watch mode. I'm not sure why it worked for some people and not you, presumably something to do with Git and staging of files.

atomictom
  • 829
  • 9
  • 13
14

Not necessarily the solution in the original questioner's case, but i ran into the exact same problem and this was my solution:

I found that when upgrading jest (from 23 to 26) that i had this issue, and the resolution was to run with the --no-cache option. Presumably they changed something about these coverage reports internally such that the cached data was incompatible.

Jemar Jones
  • 1,118
  • 2
  • 15
  • 22
  • 1
    I have upgraded from 24 to 26 and running with `--no-cache` once solved the issue. After that I had to use `--watchAll` for the coverage task, otherwise it was showing empty results – Anton Matosov Nov 04 '20 at 19:44
  • @AntonMatosov could u please check https://stackoverflow.com/questions/64727591/jest-coverage-in-a-node-typescript-project-always-returns-empty/64745848#64745848, I am still facing the same issue – muthu Nov 09 '20 at 05:36
  • In my case, the jest coverage is updating, but the Istanbul coverage html file is not. – darKnight Apr 15 '21 at 16:35
7

Seems to be working fine on Linux Mint 19.2. I'd suggest changing your jest config to something a bit more flexible:

"jest": {
    "collectCoverageFrom": [
      "src/**/*.{js,jsx,ts,tsx}",
      "!<rootDir>/node_modules/"
    ],
    "coverageThreshold": {
      "global": {
        "lines": 90,
        "statements": 90
      }
    }
  }

And then change your package.json test script if you're using npm (with yarn you can just append --coverage, for example: yarn test --coverage; however, with npm, it'll just ignore it). So I'd suggest either doing this:

 "test": "react-scripts test --coverage",

Or, I'd recommend using yarn over npm. To install yarn, use one of the following methods.

Working: enter image description here

Matt Carlotta
  • 13,627
  • 3
  • 24
  • 39
  • 1
    Hi! Thanks for answering. I changed the glob pattern, I'm using yarn, and I'm also using Linux Mint (19.1), but for some obscure reason Jest still doesn't collect the coverage: https://i.imgur.com/06ZXQNA.png. – Lual Aug 13 '19 at 00:43
  • 1
    Unfortunately, I can't replicate it. So... my guess is it might be your related to your node_modules folder. Try deleting the node_modules folder and the yarn.lock file. Then reinstall your deps. Or, better yet, clone your repo into another folder, install the deps and try again. This can at least narrow it down to be project-related or OS-related. – Matt Carlotta Aug 13 '19 at 01:19
  • I tried deleting node_modules and then reinstalling and it didn't work. I also tried deleting yarn.lock too, but then I got this error: https://i.imgur.com/qfBEt4S.png, which I tried to solve by reinstalling that particular dependency but it didn't work either. My guess is that it has something to do with some mismatching version of one of the many random dependencies, but both the initial issue and this new one seem to be rabbit holes :/ – Lual Aug 13 '19 at 03:04
  • 1
    Have you tried cloning your repo into a new folder? If not, please do so: 1. Open a terminal on your desktop (or open a terminal and `cd ~/Desktop`), 2. type `git clone git@github.com:lualparedes/lualparedes.github.io.git`, 2. `cd lualparedes.github.io`, 4. `yarn install` and 5. `yarn test --coverage`. If that fails, then I'd recommend uninstalling node and npm completely and then reinstalling it again. – Matt Carlotta Aug 13 '19 at 03:49
  • I tried cloning the repo, and it didn't work. I also tried switching Node versions but it didn't work either, I've tried with v11.7.0 (default version on my computer at the moment) and 10.16 (version used by @Tien Duong), but still no luck. – Lual Aug 14 '19 at 01:04
  • 1
    No idea then. Since it's seems related to your system, I'd recommend the following: 1. Make sure you have enough available RAM (ideally 16GB), 2. Install Linux Mint 19.2 (or reinstall 19.1) and try again. 3. Create a bug report here https://github.com/facebook/jest/issues and include everything above (system specs, include the repo, and what you've tried to remedy the issue, .etc). – Matt Carlotta Aug 14 '19 at 03:16
  • I only have 8GB, but I'm able to collect coverage from a huge work project (200+ test files) in the same machine, and that project has almost the exact same configuration —I literally copied chunks of the config files of that project. I'll probably use this as an opportunity to learn a little bit about Jest internals, but turning the website into a blog is higher in my priority list at the moment. Thanks so much for taking the time to think about the issue and even follow up for several days! :) – Lual Aug 14 '19 at 03:51
  • Why does the src folder appear that low number? I mean shouldn't it be higher? @MattCarlotta – SotoArmando Jun 20 '20 at 00:32
0

In my case, I was testing React Native/Expo app with the option cacheDirectory: '.jest/cache'. Deleting the .jest directory has solved the issue for me.

Mehmet N. Yarar
  • 408
  • 6
  • 14
0

Been there... You're missing one more parameter in Jest config:

collectCoverage: true
David
  • 461
  • 5
  • 15
0

In my case I was able to get to work by deleting cache and do npm install. In windows cache location (~\AppData\Roaming\npm-cache)

indika
  • 1
-1

Add this to your package.json

"jest": {
    "testPathIgnorePatterns": [
      "<rootDir>/path/to/ignore/"
    ]
  }

This will solve the issue of yours instead of specifying a lot of these commands