Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

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

Open
VincentLanglet opened this issue Feb 11, 2019 · 57 comments

Comments

@VincentLanglet
Copy link

@VincentLanglet VincentLanglet commented Feb 11, 2019

Environment

 System:
    OS: macOS 10.14.2
    CPU: x64 Intel(R) Core(TM) i7-8750H CPU @ 2.20GHz
  Binaries:
    Node: 11.6.0 - ~/.nvm/versions/node/v11.6.0/bin/node
    Yarn: 1.12.3 - ~/.nvm/versions/node/v11.6.0/bin/yarn
    npm: 6.5.0-next.0 - ~/.nvm/versions/node/v11.6.0/bin/npm
  Browsers:
    Chrome: 72.0.3626.96
    Firefox: 64.0
    Safari: 12.0.2
  npmPackages:
    react: ^16.8.1 => 16.8.1 
    react-dom: ^16.8.1 => 16.8.1 
    react-scripts: ^2.1.4 => 2.1.4 
  npmGlobalPackages:
    create-react-app: Not Found

Steps to Reproduce

Starting from my project with react-scripts: 2.1.3,

  • yarn
  • yarn test working
  • yarn add react-scripts@2.1.4
  • yarn test working
  • yarn-deduplicate what is this

Introducing these modifications in the yarn.lock

-"@babel/plugin-transform-destructuring@7.3.2":
+"@babel/plugin-transform-destructuring@7.3.2", "@babel/plugin-transform-destructuring@^7.0.0", "@babel/plugin-transform-destructuring@^7.2.0":
   version "7.3.2"
 
-"@babel/plugin-transform-destructuring@^7.0.0", "@babel/plugin-transform-destructuring@^7.2.0":
-  version "7.2.0"
-

-ajv@^6.1.0, ajv@^6.5.3, ajv@^6.5.5:
-  version "6.7.0"
-
-ajv@^6.9.1:
+ajv@^6.1.0, ajv@^6.5.3, ajv@^6.5.5, ajv@^6.9.1:
   version "6.9.1"

-autoprefixer@^9.3.1:
-  version "9.4.6"
-
-autoprefixer@^9.4.2:
+autoprefixer@^9.3.1, autoprefixer@^9.4.2:
   version "9.4.7"

-caniuse-lite@^1.0.0, caniuse-lite@^1.0.30000884, caniuse-lite@^1.0.30000929:
-  version "1.0.30000929"
-
-caniuse-lite@^1.0.30000918, caniuse-lite@^1.0.30000932:
+caniuse-lite@^1.0.0, caniuse-lite@^1.0.30000884, caniuse-lite@^1.0.30000918, caniuse-lite@^1.0.30000929, caniuse-lite@^1.0.30000932:
   version "1.0.30000936"

-core-js@2.6.4:
+core-js@2.6.4, core-js@^2.4.0, core-js@^2.4.1, core-js@^2.5.0, core-js@^2.5.7:
   version "2.6.4"
 
-core-js@^2.4.0, core-js@^2.4.1, core-js@^2.5.0, core-js@^2.5.7:
-  version "2.6.3"
-

-postcss@^7.0.0, postcss@^7.0.1, postcss@^7.0.13, postcss@^7.0.2, postcss@^7.0.5:
-  version "7.0.13"
-
-postcss@^7.0.14, postcss@^7.0.6:
+postcss@^7.0.0, postcss@^7.0.1, postcss@^7.0.14, postcss@^7.0.2, postcss@^7.0.5, postcss@^7.0.6:
   version "7.0.14"

-react-error-overlay@^5.1.0:
-  version "5.1.2"
-
-react-error-overlay@^5.1.3:
+react-error-overlay@^5.1.0, react-error-overlay@^5.1.3:
   version "5.1.3"

-resolve@1.10.0, resolve@^1.9.0:
+resolve@1.10.0, resolve@^1.1.6, resolve@^1.1.7, resolve@^1.2.0, resolve@^1.3.2, resolve@^1.5.0, resolve@^1.6.0, resolve@^1.8.1, resolve@^1.9.0:
   version "1.10.0"
 
-resolve@^1.1.6, resolve@^1.1.7, resolve@^1.2.0, resolve@^1.3.2, resolve@^1.5.0, resolve@^1.6.0, resolve@^1.8.1:
-  version "1.9.0"
-
  • yarn
  • yarn test not working anymore
 Test suite failed to run

    Cannot find module '/Users/.../node_modules/react-scripts/node_modules/@babel/runtime/helpers/interopRequireDefault' from 'setupTests.ts'

      1 | import { configure } from 'enzyme';
      2 | import Adapter from 'enzyme-adapter-react-16';
    > 3 | import 'jest-extended';
        |                              ^
      4 | import 'jest-localstorage-mock';
      5 | import { getSnapshotDiffSerializer, toMatchDiffSnapshot } from 'snapshot-diff';
      6 | 

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

If needed I'll try to make a reproductible demo. My actual project is for work (and not open-source...).

@VincentLanglet
Copy link
Author

@VincentLanglet VincentLanglet commented Feb 11, 2019

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

@Tenshock
Copy link

@Tenshock Tenshock commented Feb 11, 2019

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

@jeremyckahn
Copy link

@jeremyckahn jeremyckahn commented Feb 11, 2019

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:

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

@bugzpodder
Copy link

@bugzpodder bugzpodder commented Feb 11, 2019

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..

@jeremyckahn
Copy link

@jeremyckahn jeremyckahn commented Feb 11, 2019

@bugzpodder Do you know if there is a comparable solution for npm users?

@bugzpodder
Copy link

@bugzpodder bugzpodder commented Feb 11, 2019

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.

@jeremyckahn
Copy link

@jeremyckahn jeremyckahn commented Feb 11, 2019

@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)

@VincentLanglet
Copy link
Author

@VincentLanglet VincentLanglet commented Feb 12, 2019

I tried to make a minimal repo with this bug. But I really don't understand what happend.

cd my-project
yarn test

Produce the error

cd my-project
rm -rf node_modules
yarn
yarn test

Still the error

cp -R my-project copy
cd copy
yarn test

No error (WHAT THE F$$$)

rm -rf my-project
git clone my-project
yarn
yarn test

Still the error

cd my-project
cp node_modules/@babel/runtime node_modules/react-scripts/node_modules/@babel/runtime
yarn test

No error

@VincentLanglet
Copy link
Author

@VincentLanglet VincentLanglet commented Feb 12, 2019

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..

@bugzpodder How do you do this ?
(In my case, it's for "**/react-scripts/@babel/runtime"

@bkd705
Copy link

@bkd705 bkd705 commented Feb 12, 2019

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

@chranderson
Copy link

@chranderson chranderson commented Feb 12, 2019

I was getting the error after the update due to the moduleNameMapper argument in my test script.

react-scripts test --env=jsdom moduleNameMapper='{\"match-sorter\": \"<rootDir>/mocks/matchSorterMock.js\"}'

Once I removed moduleNameMapper, all my tests ran successfully (execpt for the ones using match-sorter mock)
react-scripts test --env=jsdom

@olessavluk
Copy link

@olessavluk olessavluk commented Feb 12, 2019

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

@mrmckeb
Copy link
Collaborator

@mrmckeb mrmckeb commented Feb 13, 2019

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

@lucamartini
Copy link

@lucamartini lucamartini commented Feb 13, 2019

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.

@mrmckeb
Copy link
Collaborator

@mrmckeb mrmckeb commented Feb 13, 2019

To be clear, is this affecting npm and Yarn users? I understand you're on npm, @jeremyckahn?

@lucamartini
Copy link

@lucamartini lucamartini commented Feb 13, 2019

From our side, we are on npm

@VincentLanglet
Copy link
Author

@VincentLanglet VincentLanglet commented Feb 13, 2019

@mrmckeb I'm using yarn

@mrmckeb
Copy link
Collaborator

@mrmckeb mrmckeb commented Feb 13, 2019

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

@tregusti
Copy link

@tregusti tregusti commented Feb 13, 2019

@mrmckeb
Copy link
Collaborator

@mrmckeb mrmckeb commented Feb 13, 2019

@tregusti, can you run npm ls babel-preset-react-app and share your results please?

@VincentLanglet
Copy link
Author

@VincentLanglet VincentLanglet commented Feb 13, 2019

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...

@jeremyckahn
Copy link

@jeremyckahn jeremyckahn commented Feb 13, 2019

I returned my project to the state it was when this issue was happening yesterday, removed node_modules, npm installed again, and the issue is gone. Very odd! This almost seems like some sort of issue with npm (as in, the service) itself.

My output for npm ls babel-preset-react-app:

$ npm ls babel-preset-react-app
my-project@1.0.3 /Users/jeremykahn/my-project
└─┬ react-scripts@2.1.5
  └── babel-preset-react-app@7.0.1 

My project is not using @storybook/react.

@bugzpodder
Copy link

@bugzpodder bugzpodder commented Feb 13, 2019

@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.

@Ciaran0
Copy link

@Ciaran0 Ciaran0 commented Feb 13, 2019

Hi, I got the same issue today when upgrading React-Testing-Library (not sure if that has anything to do with it). Not using storybook.

Heres my output from npm ls babel-preset-react-app

screen shot 2019-02-13 at 11 38 34

screen shot 2019-02-13 at 11 38 47

@bugzpodder
Copy link

@bugzpodder bugzpodder commented Feb 13, 2019

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

@mrmckeb
Copy link
Collaborator

@mrmckeb mrmckeb commented Feb 14, 2019

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.

@antzhdanov
Copy link

@antzhdanov antzhdanov commented Apr 25, 2019

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

@jeetsang
Copy link

@jeetsang jeetsang commented May 9, 2019

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

@blavejr
Copy link

@blavejr blavejr commented May 19, 2019

I had the same issue, fixed it by
Remove node_modules
Upgrade yarn with brew
yarn install

and it worked after that.

@shamilovtim
Copy link

@shamilovtim shamilovtim commented May 23, 2019

ran into this after installing node-sass using npm

i deleted node_modules and then did a yarn install and issue was resolved. seems this is related to using npm.

@meera
Copy link

@meera meera commented May 29, 2019

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

Thank you!
yarn test --clearCache
Worked!

@jcunanan05
Copy link

@jcunanan05 jcunanan05 commented Aug 10, 2019

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

worked for me

@obrejla
Copy link

@obrejla obrejla commented Aug 23, 2019

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.

@manchaary
Copy link

@manchaary manchaary commented Aug 30, 2019

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

@ryan-collingham
Copy link

@ryan-collingham ryan-collingham commented Sep 17, 2019

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.

@israelgonzalezb
Copy link

@israelgonzalezb israelgonzalezb commented Dec 6, 2019

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.

douglasnaphas added a commit to douglasnaphas/madliberationjs that referenced this issue Jan 8, 2020
I ran `npm audit fix`. Then the tests failed. So I had to do `npm i
babel-preset-react-app@7.0.0` based on [this
issue](facebook/create-react-app#6398).
@danielsogl
Copy link

@danielsogl danielsogl commented Jan 31, 2020

The problems shows up after upgrading react scripts to version 3.3.1

@mackattack3k
Copy link

@mackattack3k mackattack3k commented Jan 31, 2020

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.

@PenguinOfWar
Copy link

@PenguinOfWar PenguinOfWar commented Feb 7, 2020

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

@ryan-collingham
Copy link

@ryan-collingham ryan-collingham commented Feb 28, 2020

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.

@MuhammadHani10p
Copy link

@MuhammadHani10p MuhammadHani10p commented Apr 13, 2020

I incurred the same issue lateron I realized that yarn.lock is the main culprit.
I deleted yarn.lock and re-install modules (yarn install) and everything worked fine after that.

@annelhote
Copy link

@annelhote annelhote commented Mar 31, 2021

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 !

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests