Unable to ignore specific files with jest.config

Viewed 130

Trying to ignore all index files, but specifically the src/index.jsx and src/reportWebVitals.js files, however my coverage command still shows up covered lines.

My Github repo on the correct dev branch where this is an issue.

enter image description here

According to the docs, it should be as simple as adding the file to coveragePathIgnorePatterns and testPathIgnorePatterns.

jest.config

module.exports = {
  testEnvironment: 'node',
  testEnvironmentOptions: {
    NODE_ENV: 'test',
  },
  restoreMocks: true,
  coveragePathIgnorePatterns: [
    'node_modules',
    'index.js',
    'index.jsx',
    'server/src/config',
    'server/src/app.js',
    'src/index.jsx',
    'src/reportWebVitals.js',
    'tests',
  ],
  coverageReporters: ['text', 'lcov', 'clover', 'html'],
  testPathIgnorePatterns: ['index.js', 'index.jsx', 'src/index.jsx', 'src/reportWebVitals.js'],
  roots: ['<rootDir>/server/tests'],
};

Also tried with a much longer version here:

module.exports = {
  testEnvironment: 'node',
  testEnvironmentOptions: {
    NODE_ENV: 'test',
  },
  restoreMocks: true,
  collectCoverageFrom: [
    'src/{!(index),}.jsx',
    'src/{!(reportWebVitals),}.js',
    'src/{!(store),}.js'
  ],
  coveragePathIgnorePatterns: [
    'node_modules',
    'index.js',
    'index.jsx',
    'server/src/config',
    'server/src/app.js',
    'index.jsx',
    'reportWebVitals.js',
    'store.js',
    'tests',
  ],
  coverageReporters: ['text', 'lcov', 'clover', 'html'],
  modulePathIgnorePatterns: [
    'node_modules',
    'index.js',
    'index.jsx',
    'server/src/config',
    'server/src/app.js',
    'index.jsx',
    'reportWebVitals.js',
    'store.js',
    'tests',
  ],
  watchPathIgnorePatterns: [
    'node_modules',
    'index.js',
    'index.jsx',
    'server/src/config',
    'server/src/app.js',
    'index.jsx',
    'reportWebVitals.js',
    'store.js',
    'tests',
  ],
  testPathIgnorePatterns: [
    'node_modules',
    'index.js',
    'index.jsx',
    'server/src/config',
    'server/src/app.js',
    'index.jsx',
    'reportWebVitals.js',
    'store.js',
    'tests',
  ],
  roots: ['<rootDir>/server/tests'],
};

My package.json scripts

"client-dev": "react-scripts start",
"client-build": "react-scripts build",
"client-test": "react-scripts test ./src",
"client-coverage": "react-scripts test ./src --coverage",

UPDATE: One interesting thing I noted, I removed all my ignore rules form the jest.config.js and the coverage is still the same, node_modules isn't a problem in the coverage... so now exploring if my project is even picking up the config.

module.exports = {
  testEnvironment: 'node',
  testEnvironmentOptions: {
    NODE_ENV: 'test',
  },
  restoreMocks: true,
  coverageReporters: ['text', 'lcov', 'clover', 'html'],
};
3 Answers

You will have to explicitly mention your config file path in your test script. If you do so, it will lead to another issue which has been discussed here: https://stackoverflow.com/a/68912023/10055300. It would be ideal to have jest configs in package.json itself rather than having a separate file for it.

The answer was my jest.config.js is being ignored by the project. Initially when I started working on this project this config was already included which why I kept it rather than using jest config inside of my package.json.

After using the jest rules inside package.json the ignores are working 100% now.

I am unsure as to why the jest.config.js did not work, if someone answers that I will select their answer and award them the 250 Bounty points.

"jest": {
  "coveragePathIgnorePatterns": [
    "node_modules",
    "server/src/config",
    "store.js",
    "index.jsx",
    "index.js",
    "tests"
  ],
  "watchPathIgnorePatterns": [
    "node_modules",
    "server/src/config",
    "store.js",
    "index.jsx",
    "index.js",
    "tests"
  ]
},

enter image description here

Since you are using an unejected create-react-app, the only way to override the jest configuration(without ejecting) is to add the allowed configuration keys in package.json under the parent key jest.

Something like this:

{
  "jest": {
    "coveragePathIgnorePatterns": [
      "index.jsx"
    ],
  }
}

If you go through the source code for facebook/create-react-app/.../react-scripts/.../createJestConfig.js, you will see that react-scripts allows only a fixed set of jest configuration keys to be overridden, and only using the package.json method. It does not support adding your own jest.config.js file. CRA(react-scripts) creates its own jest configuration and uses that to run your tests.

enter image description here

Related