create-react-app: 2.1.4 Update cause "Cannot find module '/Users/.../node_modules/react-scripts/node_modules/@babel/runtime/helpers/interopRequireDefault' from 'setupTests.ts'"

For me, upgrading to 2.1.8 did not help. What did help though, is running tests with --clearCache:

$ yarn test --clearCache

Hope this helps. See https://jestjs.io/docs/en/cli.html#clearcache for details

I was able to work around this issue with:

npm i babel-preset-react-app@7.0.0

The latest version as of this writing is 7.0.1. It appears that something related to #6393 is causing this issue.

Relevant commits:

• https://github.com/facebook/create-react-app/commit/b02f181d0d98651bb5144acee276bb0f2db67c60#diff-5a51074922f8107dc611b7e125130e7e
• https://github.com/facebook/create-react-app/commit/b7e01584411a2b6f651d2891e81862997d40ebff#diff-5a51074922f8107dc611b7e125130e7e

FYI @ianschmitz. I’m not sure if this is related to your work, but your name popped up.

The problems shows up after upgrading react scripts to version 3.3.1

I hade the same issue but I’m not using yarn. So I did react-scripts test --clearCache once and then removed the flag.

Thanks, this worked for me after an upgrade from node 10.x to 12.x.

In my case, it was npm run test -- --clearCache then npm run test

We’re still actively investigating this, and trying to get a fix out as soon as possible. Hopefully everyone has been able to use the workarounds posted above in the meantime.

Chiming in that I’m running into this as well. Curious to see the fix. Thanks for the workaround in the interim, everyone!

The problems shows up after upgrading react scripts to version 3.3.1

I hade the same issue but I’m not using yarn. So I did react-scripts test --clearCache once and then removed the flag.

The problems shows up after upgrading react scripts to version 3.3.1

For me, upgrading to 2.1.8 did not help. What did help though, is running tests with --clearCache:

$ yarn test --clearCache

Hope this helps. See https://jestjs.io/docs/en/cli.html#clearcache for details

This worked for me not sure why

I don’t use storybook and have this problem as well:

$ npm ls babel-preset-react-app
saffron@0.1.0 /home/dalius/projects/saffron
└─┬ react-scripts@2.1.5
  └── babel-preset-react-app@7.0.1 

Fresh install has not solved the problem for me. I had to do npm i babel-preset-react-app@7.0.0 to run tests now.

Hi all, I’ve had this report from some colleagues too. I’m not sure what’s causing it, we’re looking into it.

I was able to work around this issue with:

npm i babel-preset-react-app@7.0.0

The latest version as of this writing is 7.0.1. It appears that something related to #6393 is causing this issue.

This worked for us on our debian machine! Jest was working when logged as root, but not as our service user.

Adding @babel/runtime to dependencies in our app worked for us. Hopefully this is just a temporary solution.

Work around for tests in CRA I used to make this work is runt the test script with transformIgnorePatterns in package.json

"test": "react-scripts test --transformIgnorePatterns '/node_modules/'"

Still broken for me with 2.1.8.

Before:

% npm ls babel-preset-react-app
web@0.1.0 /Users/...
├─┬ @storybook/react@5.0.0
│ └── babel-preset-react-app@7.0.1
└─┬ react-scripts@2.1.8
  └── babel-preset-react-app@7.0.2

(failing)

Steps to fix, inspired by comments above but the order matters.

First step: add the following to your packages.json:

  "resolutions": {
    "@types/react": "16.8.4",
    "babel-preset-react-app": "7.0.0"
  }

Second step:

% yarn add -D babel-preset-react-app@7.0.0

Then it should be good.

After:

% npm ls babel-preset-react-app
web@0.1.0 /Users/...
├─┬ @storybook/react@5.0.0
│ └── babel-preset-react-app@7.0.0  deduped
├── babel-preset-react-app@7.0.0
└─┬ react-scripts@2.1.8
  └── UNMET DEPENDENCY babel-preset-react-app@^7.0.2

npm ERR! missing: babel-preset-react-app@^7.0.2, required by react-scripts@2.1.8

@bugzpodder understood. I also can’t repro this on a fresh CRA install. I think this issue may be related to the testing toolchain, as my error output looks very similar to @VincentLanglet’s:

FAIL src/components/MyComponent/MyComponent.test.js
  ● Test suite failed to run

    Cannot find module '/Users/jeremykahn/[PROJECT]/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/interopRequireDefault' from 'setupTests.js'

      1 | import { configure } from 'enzyme';
      2 | import Adapter from 'enzyme-adapter-react-16';
    > 3 | import 'jest-enzyme';
        |                      ^
      4 | 
      5 | configure({ adapter: new Adapter() });
      6 | 

      at Resolver.resolveModule (node_modules/jest-resolve/build/index.js:221:17)
      at Object.<anonymous> (src/setupTests.js:3:30)

I have the same issue with the module babel-preset-react-app since I updated to react-script@2.1.4

the module babel-preset-react-app doesn’t have a node_modules/ folder anymore. I have to fix it the same way you fix your problem. I have to add manually the entire node_modules/@babel inside babel-preset-react-app

> tree project/node_modules/babel-preset-react-app
.
├── LICENSE
├── README.md
├── create.js
├── dependencies.js
├── dev.js
├── index.js
├── node_modules  // <= This one is missing since the react-scripts@2.1.4 update
├── package.json
├── prod.js
├── test.js
└── webpack-overrides.js

For me error gone after doing cp -R my-project copy or clonning project into directory with a different name. ¯\(ツ)/¯

I have to manually add @babel/runtime inside react-scripts/node-modules to fix this…

I’m seeing a similar error with react-scripts@3.0.1. Every Jest test fails to import Adapter from ‘enzyme-adapter-react-16’:

Cannot find module [...SNIP...]/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/interopRequireDefault' from 'setupTests.js'

      1 | import { configure } from 'enzyme';                                  
      2 | import Adapter from 'enzyme-adapter-react-16';                       
    > 3 |                              
        | ^                            
      4 | configure({ adapter: new Adapter() });                               

      at Resolver.resolveModule (node_modules/jest-runtime/node_modules/jest-resolve/build/index.js:230:17)                 
      at Object.<anonymous> (src/setupTests.js:3:30)

npm ls shows that only 9.0.1 version of babel-preset-react-app is installed:

$ npm ls babel-preset-react-app                                                       
testplan@0.2.0 [...SNIP...]
└─┬ react-scripts@3.0.1                
  └── babel-preset-react-app@9.0.1   

Installing babel-preset-react-app@7.0.0 as suggested above fixes the issue and all tests can run fine.

Deleting a lock file should not introduce breaking changes. It will only update your dependencies within the range specified in your package.json file, as well as your indirect dependencies.

Weird… I ran the following command:

$ rm -rf node_modules && rm -f package-lock.json && npm install && npm update

Maybe that helps.

@mrmckeb I only have one copy fo babel-preset-react-app I use yarn and don’t have @storybook installed anywhere.

=> Found “babel-preset-react-app@7.0.1” info Reasons this module exists

• “project#ui-client#react-scripts” depends on it
• Hoisted from “project#ui-client#react-scripts#babel-preset-react-app”

Downgrading to babel-preset-react-app@7.0.0 helps, but only because in node_modules/babel-preset-react-app/node_modules/@babel/runtime exists. Removing the node_modules inside babel-preset-react-app causes the same error.

Alternatively adding “nohoist”: [ “**/babel-preset-react-app/@babel/runtime” ] and sticking to babel-preset-react-app 7.0.1 works as well.

For me, upgrading to 2.1.8 did not help. What did help though, is running tests with --clearCache:

$ yarn test --clearCache

Hope this helps. See https://jestjs.io/docs/en/cli.html#clearcache for details

Thank you so much, it worked for me !

I’m seeing a similar error with react-scripts@3.0.1. Every Jest test fails to import Adapter from ‘enzyme-adapter-react-16’:

Cannot find module [...SNIP...]/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/interopRequireDefault' from 'setupTests.js'

      1 | import { configure } from 'enzyme';                                  
      2 | import Adapter from 'enzyme-adapter-react-16';                       
    > 3 |                              
        | ^                            
      4 | configure({ adapter: new Adapter() });                               

      at Resolver.resolveModule (node_modules/jest-runtime/node_modules/jest-resolve/build/index.js:230:17)                 
      at Object.<anonymous> (src/setupTests.js:3:30)

npm ls shows that only 9.0.1 version of babel-preset-react-app is installed:

$ npm ls babel-preset-react-app                                                       
testplan@0.2.0 [...SNIP...]
└─┬ react-scripts@3.0.1                
  └── babel-preset-react-app@9.0.1   

Installing babel-preset-react-app@7.0.0 as suggested above fixes the issue and all tests can run fine.

We are no longer seeing this issue after upgrading to react-scripts@3.4.0 and removing babel-preset-react-app@7.0.0 from devDependencies.

For me, upgrading to 2.1.8 did not help. What did help though, is running tests with --clearCache:

$ yarn test --clearCache

Hope this helps. See https://jestjs.io/docs/en/cli.html#clearcache for details

This worked for me. Delete node_modules and running yarn install did not fix the issue.

For me, upgrading to 2.1.8 did not help. What did help though, is running tests with --clearCache:

$ yarn test --clearCache

Hope this helps. See https://jestjs.io/docs/en/cli.html#clearcache for details

Thanks! It worked for me

-- @storybook/react@5.1.11
  -- babel-preset-react-app@9.0.1
-- react-scripts@3.1.1
  -- babel-preset-react-app@9.0.1

For me, upgrading to 2.1.8 did not help. What did help though, is running tests with --clearCache:

$ yarn test --clearCache

Hope this helps. See https://jestjs.io/docs/en/cli.html#clearcache for details

God bless ya! Works!

Nevertheless, the problem still exists in "react-scripts": "3.1.1",… It started to happen to me once I used yarn upgrade-interactive for some minor updates…

One note, when I run tests through cli, then they run properly. The problem occurred only when I run the tests through IntelliJ.

Thanks.

rm -f package-lock.json

It will update all the library of the project. Introducing a lot of breaking change. A lock file is not made to be deleted.

@Ciaran0 this is unrelated, please try react-scripts@2.1.5 to resolve.

FYI, I don’t know how but it works now and npm ls babel-preset-react-app returns

front@0.1.0 /Users/vincentl/Olfeo/front
├─┬ @storybook/react@4.1.11
│ └── babel-preset-react-app@6.1.0
└─┬ react-scripts@2.1.5
  └── babel-preset-react-app@7.0.1

Seems like something wrong between dependencies and yarn not doing always the same thing…

OK, one more question - is everyone here using @storybook/react? It looks like it might be because that package has a dependency on "babel-preset-react-app": "^6.1.0".

When I remove @storybook/react, the problem goes away. When I add it back, but use Yarn resolutions to force "babel-preset-react-app": "7.0.1", the problem is also gone.

Can anyone else confirm this?

If this is not the case, can you please run the below and post the results here?

npm ls babel-preset-react-app

Sorry I only use yarn on this project because of workspaces. I tried a fresh install of create-react-app but didn’t run into this issue.

I had a workaround where I told yarn not to hoist “**/babel-preset-react-app/@babel/runtime” It might be because previously two different versions of @babel/runtime were used so it was not hoisted when installed, but now that the versions match the package is hoisted to the top level node modules…