babel-jest fails to transpile babel code if nested directory contains a package.json file

[EvHaus]

🐛 Bug Report

I'm in the process of upgrading to @babel/core version 7.0.0-beta.51 from babel-core version 6.x.x. As part of this upgrade, I've run into a ton of issues with Jest failing to process tests. It took me nearly 48 hours but I've been able to isolate the issue to a tiny reproducible test case. See "To Reproduce" below for details.

TLDR: When using [email protected] and @babel/[email protected], you cannot have any subdirectories in your project that have a package.json file. If you do -- babel-jest will fail to process files.

To Reproduce

I've created a repo with the smallest repro case I could find. See steps in README: https://github.com/EvHaus/babel-jest-bug

Expected behavior

Jest should run the tests without any babel transpile failures.

Link to repl or repo (highly encouraged)

https://github.com/EvHaus/babel-jest-bug

Run npx envinfo --preset jest

  System:
    OS: Windows 10
    CPU: x64 Intel(R) Core(TM) i7 CPU         930  @ 2.80GHz
  Binaries:
    Yarn: 1.7.0 - C:\Program Files (x86)\Yarn\bin\yarn.CMD
    npm: 6.1.0 - C:\Program Files\nodejs\npm.CMD

Also reproducible on:

npx: installed 1 in 2.766s

  System:
    OS: macOS 10.14
    CPU: x64 Intel(R) Core(TM) i5-5257U CPU @ 2.70GHz
  Binaries:
    Node: 10.6.0 - /usr/local/bin/node
    Yarn: 1.7.0 - /usr/local/bin/yarn
    npm: 6.1.0 - /usr/local/bin/npm

[Hypnosphi]

My workaround is this:

babel-jest.js

const path = require('path');
const babelJest = require('babel-jest');

module.exports = babelJest.createTransformer({
  configFile: path.resolve(__dirname, '.babelrc'),
});

jest.config.js

module.exports = {
  ...
  transform: {
    '^.+\\.jsx?$': './babel-jest'
  }
}

[EvHaus]

Thanks @Hypnosphi, that workaround worked in my case as well. I'll use that for now until a proper fix comes around.

[lehni]

I have created a fork of babel-jest to support such scenarios. Please let me know if this works for you: https://github.com/lehni/babel-jest-nested

There is also a pending PR to get this merged into babel-jest that I am hoping will get some attention: #6617

[meatwallace]

just to clarify, @lehni's fix works if you have a babel config in each nested folder w/ a package.json, whereas @Hypnosphi's workaround allows you to use your root babel config.

[TrySound]

Renaming to babel.config.js fixed the problem

[meatwallace]

can confirm - was caused by naively upgrading to latest babel beta w/o reading the changelog. issue should be closed.

[EvHaus]

Hmm, I wasn't able to find anything in the babel changelogs that says global Babel configurations must be in the form of a babel.config.js file. Everything seems to say .babelrc should still be supported. Additionally, babel.config.js will compile node_modules which may not be desired in this situation.

Is there no way to make this work using .babelrc files?

[SimenB]

See #6053 (comment) for an explanation

[bertho-zero]

For me a .babelrc or .babelrc.js containing only an extends property does not work, renaming the file in babel.config.js either.

.babelrc (which does not work):

{
  "extends": "@openagenda/babel-config"
}

.babelrc.js (which works):

module.exports = require( '@openagenda/babel-config' );

or

const babelConfig = require( '@openagenda/babel-config' );

module.exports = api => {
  const config = babelConfig( api );

  // other stuff here if needed

  return config;
};

[github-actions]

This issue has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.
Please note this issue tracker is not a help forum. We recommend using StackOverflow or our discord channel for questions.