Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How do I disable some babel transforms when running jest?

I have a project that I started, then ejected, with react-create-app and I've started writing tests. Since I'm using the latest node I shouldn't need to run many of the babel transforms which testing. (Which has the added benefit of simplifying tracebacks). However, I can't figure out how to stop babel from transforming my code while running tests.

In my package.json I have

{
   "scripts": {
      "test": "BABEL_ENV=test node --harmony scripts/test.js --env=jsdom"
   },
   "jest": {
        "moduleFileExtensions": [
      "jsx",
      "js",
      "json"
    ],
    "moduleNameMapper": {
      "^.+\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$": "<rootDir>/config/jest/FileStub.js",
      "^.+\\.css$": "<rootDir>/config/jest/CSSStub.js"
    },
    "setupFiles": [
      "<rootDir>/config/polyfills.js"
    ],
    "testPathIgnorePatterns": [
      "<rootDir>/(build|docs|node_modules|scripts)/"
    ],
    "testEnvironment": "node"
   }
}

My .babelrc file looks like:

{
  "presets": [
    ["es2015", { "modules": false }],
    "react-app"
  ],
  "plugins": [
    ["transform-class-properties", { "spec": true }],
    ["transform-flow-strip-types"]
  ],
  "env": {
    "test": {
      "presets": [
        "node7",
        "react-app"
      ],
      "plugins": [
        ["transform-class-properties", { "spec": true }],
        ["transform-flow-strip-types"]
      ]
    }
  }
}

And the slightly modified test.js file is:

process.env.NODE_ENV = 'test';
process.env.BABEL_ENV = 'test';
process.env.PUBLIC_URL = '';

require('dotenv').config({ silent: true });

const jest = require('jest');
const argv = process.argv.slice(2);

if (!process.env.CI) {
    argv.push('--watch');
}

jest.run(argv);

I think that I am misunderstanding how the "env" section of the babelrc works, but I thought that setting the BABEL_ENV variable would overwrite the defaults provided in the .babelrc. What is it that I'm missing?

like image 276
Richard Avatar asked Jan 30 '26 08:01

Richard


1 Answers

From the Jest documentation for transform:

Default: {"\\.[jt]sx?$": "babel-jest"}

Thus, if you do nothing Jest will transform your code using babel-jest by default.

Also from Jest's documentation on ESM, bullet item #1:

Ensure you either disable code transforms by passing transform: {} or otherwise configure your transformer to emit ESM rather than the default CommonJS (CJS).

Accordingly, you can disable code transforms by setting your Jest configuration for transform to an empty object:

transform: {}
like image 62
morganney Avatar answered Feb 01 '26 23:02

morganney



Donate For Us

If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!