Is there anyway to extend a jest configuration file?

Question

Within a node app where I'm using Jest to test client side code (testEnvironment: 'jsdom') and server side code (testEnvironment:'node') as well collecting code coverage for both client and server side.

Currently I'm using 4 Jest config files with lots of redundant configuration to accomplish this.

client

{
  "bail": true,
  "verbose": true,
  "notify": true,
  "scriptPreprocessor": "./node_modules/babel-jest",
  "testPathIgnorePatterns": [
    "./node_modules",
    "./coverage",
    "./dist",
    "./build"
  ],
  "testRegex": "\\.test\\.js"
}

client coverage

{
  "bail": true,
  "verbose": true,
  "notify": true,
  "scriptPreprocessor": "./node_modules/babel-jest",
  "testPathIgnorePatterns": [
    "./node_modules",
    "./coverage",
    "./dist",
    "./build"
  ],
  "testRegex": "\\.test\\.js",
  "collectCoverageFrom": ["**/*.js", "!**/node_modules/**"],
  "collectCoverage": true,
  "coverageDirectory": "./coverage",
  "coveragePathIgnorePatterns": [
    "./node_modules",
    "./coverage",
    "./dist",
    "./build",
    "./test"
  ],
  "coverageThreshold": {
    "global": {
      "branches": 100,
      "functions": 100,
      "lines": 100,
      "statements": 100
    }
  }
}

server

{
  "bail": true,
  "verbose": true,
  "notify": true,
  "scriptPreprocessor": "./node_modules/babel-jest",
  "testPathIgnorePatterns": [
    "./node_modules",
    "./coverage",
    "./dist",
    "./build"
  ],
  "testRegex": "\\.test\\.js",
  "testEnvironment": "node"
}

server coverage

{
  "bail": true,
  "verbose": true,
  "notify": true,
  "scriptPreprocessor": "./node_modules/babel-jest",
  "testPathIgnorePatterns": [
    "./node_modules",
    "./coverage",
    "./dist",
    "./build"
  ],
  "testRegex": "\\.test\\.js",
  "testEnvironment": "node",
  "collectCoverageFrom": ["**/*.js", "!**/node_modules/**"],
  "collectCoverage": true,
  "coverageDirectory": "./coverage",
  "coveragePathIgnorePatterns": [
    "./node_modules",
    "./coverage",
    "./dist",
    "./build",
    "./test"
  ],
  "coverageThreshold": {
    "global": {
      "branches": 100,
      "functions": 100,
      "lines": 100,
      "statements": 100
    }
  }
}

How can I achieve this without repeating my configuration 4 times? I've looked at the preset configuration option. Using that I have to create a separate package for each configuration. Is that the recommended way?

Answer 1

Yes, you could define shared jest.config.js and reuse it in your specific configs:

• It's nice to use <rootDir> in all paths in your shared config, so those could be reused too.

client/jest.config.js

const sharedConfig = require('../jest.config.js');
module.exports = {
  ...sharedConfig,
  'rootDir': './',
}

server/jest.config.js

const sharedConfig = require('../jest.config.js');
module.exports = {
  ...sharedConfig,
  'rootDir': './',
  "testEnvironment": "node"
}

You could also reuse jest defaults if needed: Jest Documentation - Configuring Jest

Answer 2

Yes, since Jest v20 you can define config as a JS file and use it to share common parts of the similar configs. Docs on configuring Jest.

By default Jest looks up for:

• jest.config.js
• "jest" entry in package.json

...and treats the parent directory as a rootDir.

Also be sure to check out the projects option, which makes it easier to run Jest inside monorepos (e.g. client + server code in one codebase). See this answer for reference: Testing two environments with jest