React-native: Cannot find module 'setupDevtools' from 'setup.js' in react-native/jest/setup.js version 0.56.0

[davidpricedev]

• [x] Search for existing issues: https://github.com/facebook/react-native/issues
• [x] Use the latest React Native release: https://github.com/facebook/react-native/releases
• [x] Review the documentation: https://facebook.github.io/react-native

Environment

node version 8.11.3 (and other windows systems have older yarn and node versions)

  React Native Environment Info:
    System:
      OS: Windows 10
      CPU: x64 Intel(R) Core(TM) i7-3770 CPU @ 3.40GHz
      Memory: 11.10 GB / 15.96 GB
    Binaries:
      Yarn: 1.9.2 - C:\Program Files (x86)\Yarn\bin\yarn.CMD
      npm: 5.6.0 - C:\Program Files\nodejs\npm.CMD
    IDEs:
      Android Studio: Version  3.1.0.0 AI-173.4720617

Description

Since upgrading to react-native 0.56.0, I can no longer run tests on windows. Every test file fails with the error below

FAIL startup/App.spec.js
● Test suite failed to run
Cannot find module 'setupDevtools' from 'setup.js'
at Resolver.resolveModule (node_modules/jest-resolve/build/index.js:221:17)
at Object. (node_modules/react-native/jest/setup.js:33:6)

Jest Config

I think everything below the setupFiles was stuff I added that made no effective difference.

{
    preset: 'react-native',
    collectCoverageFrom: [
        '**/*.{js}',
        '!**/node_modules/**',
        '!**/vendor/**',
        '!**/native-base-theme/**'
    ],
    testPathIgnorePatterns: [
        '/node_modules/'
    ],
    transform: {
        '^.+\\.js$': '<rootDir>/node_modules/react-native/jest/preprocessor.js'
    },
    transformIgnorePatterns: [
        '/node_modules/(?!native-base)/'
    ],
    setupFiles: [
        './testSetup.js'
    ],
    testRegex: "(/__tests__/.*|\\.(test|spec))\\.(ts|tsx|js)$",
    moduleDirectories: [
        'node_modules'
    ]
}

Package.json

{
  "devDependencies": {
    "@babel/core": "7.0.0-beta.47",
    "@babel/plugin-proposal-decorators": "7.0.0-beta.47",
    "@babel/plugin-transform-runtime": "7.0.0-beta.47",
    "@babel/runtime": "7.0.0-beta.47",
    "babel-eslint": "^8.0.1",
    "babel-jest": "^23.4.0",
    "babel-plugin-extensible-destructuring": "4.2.1",
    "babel-plugin-jest-hoist": "^23.2.0",
    "babel-plugin-transform-remove-console": "^6.8.5",
    "babel-preset-react-native": "^5.0.0",
    "enzyme": "^3.3.0",
    "enzyme-adapter-react-16": "^1.1.1",
    "eslint": "^4.10.0",
    "eslint-loader": "^1.9.0",
    "eslint-plugin-babel": "^4.1.2",
    "eslint-plugin-import": "^2.7.0",
    "eslint-plugin-jest": "^21.3.2",
    "eslint-plugin-prettier": "^2.3.1",
    "eslint-plugin-react": "^7.1.0",
    "flow": "^0.2.3",
    "flow-bin": "^0.75.0",
    "jest": "23.4.1",
    "madge": "^3.0.1",
    "patch-package": "^5.1.1",
    "postinstall-prepare": "^1.0.1",
    "prettier-eslint-cli": "^4.6.1",
    "react-dom": "^16.1.1",
    "react-test-renderer": "16.4.1",
    "semver-regex": "^1.0.0",
    "shelljs": "^0.7.8"
  },
  "dependencies": {
    "axios": "^0.17.1",
    "base-64": "^0.1.0",
    "base64-js": "^1.3.0",
    "bcryptjs": "^2.4.3",
    "buffer": "^5.0.8",
    "core-js": "2.5.2",
    "events": "^1.1.1",
    "extensible-runtime": "^4.1.0",
    "he": "^1.1.1",
    "lodash": "^4.17.4",
    "moment": "^2.19.1",
    "moment-timezone": "^0.5.17",
    "prettier": "^1.9.1",
    "prop-types": "^15.6.0",
    "react": "16.4.1",
    "react-native": "0.56.0",
    "react-navigation": "^1.0.0-beta.19",
    "redux": "^3.7.2",
    "redux-saga": "^0.16.0",
    "urijs": "^1.19.0",
    "util": "^0.10.3"
  },
  "resolutions": {
    "core-js": "2.5.2"
  }
}

What I've already tried

• I tried a bunch of things from a few semi-related issues: Jest #3822, stryker-mutator #717, StackOverflow A, B, C
• Tried upgrading to the latest yarn, and node.
• Tried many changes to my jest config based on the suggestions above
• Tried throwing away my yarn.lock file so it would grab the latest version of everything subject to package.json
• The repo below and snippets above are vastly stripped down from the original versions that I started with
• Tried installing [email protected] as a dev dependency since yarn complains about it being a missing peer dependency

Things that affect the error:

If I remove the transform section of the jest config then the setup.js error goes away, but the "Plugin 0" error occurs (on macOs too):

Plugin 0 specified in "/Users/me/dev/myApp/node_modules/babel-preset-react-native/index.js" provided an invalid property of "default" (While processing preset: "...")

If I add the following to my jest config, the error changes to the error below

    rootDir: '.',
    roots: [
        '<rootDir>'
    ],

FAIL startup/App.spec.js
● Test suite failed to run
Reference Error babelHelpers is not defined

1 | import App from './App';
| ^
2 |
3 | describe('App', () => {
4 | it('Will render', () => {
at Object. (startup/App.spec.js:1:52)

Reproducible Demo

See: this repo for a reproducible (on windows only) example.

[FibreFoX]

This is even reproducable when using react-native init sampleproject. My reproducable way:

react-native init sampleproject
cd sampleproject
react-native eject

Creating the file App.test.js in the sampleproject-folder having this content:

import React from 'react';
import App from './App';

import renderer from 'react-test-renderer';

it('renders without crashing', () => {
  const rendered = renderer.create(<App />).toJSON();
  expect(rendered).toMatchSnapshot();
});

Running yarn test now breaks:

PS C:\tmp\sampleproject> yarn test
yarn run v1.7.0
$ jest
 FAIL  ./App.test.js
  ● Test suite failed to run

    Cannot find module 'setupDevtools' from 'setup.js'

      at Resolver.resolveModule (node_modules/jest-resolve/build/index.js:221:17)
      at Object.<anonymous> (node_modules/react-native/jest/setup.js:33:6)

Test Suites: 1 failed, 1 total
Tests:       0 total
Snapshots:   0 total
Time:        0.663s
Ran all test suites.
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

Even the provided hints/workarounds from https://github.com/facebook/react-native/issues/19859#issuecomment-407748189 did not work for me. This makes me not being able to use react-native 0.56 at all!

EDIT: the same code works flawless on latest MacOS (High Sierra) and on latest Debian Stretch. This seems to be a platform-specific bug !!!

[FibreFoX]

@davidpricedev can you confirm, that your project works on MacOS (without the transform-modification), but always fails on Windows ? Did you try any Linux-system? I assume there is a path-bug where backslashes are used wrong while sanitizing, I'm now searching for such things.

EDIT: did not found anything .... maybe this is a bug in Jest itself? Maybe it's another incompatibility with the new babel.config.js instead of .babelrc? it is very depressing!

[davidpricedev]

My project works as-is on a macos (without removing the transform section). Adding the roots/rootDir sections doesn't seem to matter for the mac.
I haven't tried a linux system yet.

[shyaniv7]

We are seeing the exact same issue after upgrading from 0.55.4 to 0.56.0

● Test suite failed to run

    Cannot find module 'setupDevtools' from 'setup.js'

[kelset]

Looks to me like a duplicate of https://github.com/facebook/react-native/issues/19859

[FibreFoX]

@kelset might be, but it is very strange that this issue is only on Windows systems, but working on MacOS/Linux. The other issue was happening on MacOS so it seemed to be a different bug.

[kelset]

Have you tried following my last comment in that issue and test again?

Related to it being Windows only we are still fixing/releasing commits related to Windows miss-behaviours so could also be related to that.

[FibreFoX]

@kelset yes, tried the last comment of that issue, did not work (and the author of this issue seems to have this done too).

Can you link these other windows-specific issues/pull-requests here? Would help making this more visually present.

[davidpricedev]

To address the various suggestions in that last comment of #19859 :

• I have tried all three options for babel configuration - .babelrc, .babelrc.js, and babel.config.js none seem to affect the issue.
• I'm using the transform setting (out of react-native) on macOs successfully
• I tried copying the preprocessor file, but haven't done any customizations yet. Unsurprisingly, it has no effect on the issue.
  
  
  
  • I do use one extra babel plugin (namely extensible destructuring), but I was able to get that to work on macOs without customizing the preprocessor. FibreFoX is seeing the same issue without that plugin, so it seems that should have no bearing on the problem.
  
  
  • In terms of customizing the preprocessor, since I don't need to do so for mac, and it seems the errors are unrelated to the preprocessor, I'm not sure what changes I could make there to address the issue.
  
  

[shyaniv7]

I tried all the suggestions above and nothing seems to work.
we are using the jest-expo preset for jest and keep getting the same error

Cannot find module 'setupDevtools' from 'setup.js' in react-native/jest/setup.js 

Update:
This would explain why jest-expo did not work on rn 0.56
https://blog.expo.io/expo-sdk-v29-0-0-is-now-available-f001d77fadf

regardless even with the react-native preset i cannot get it to work

[kelset]

hey folks, thanks for the feedback:

• @FibreFoX here's the issue that "collects them all" https://github.com/facebook/react-native/issues/20353 (we plan on releasing the first rc of 0.57 today, in the meantime could you test if master works for you?)
• @shyaniv7 yes exactly, you can't use that config because expo is still on babel6 so it's hard to ensure that the config works for babel7

[FibreFoX]

@kelset thanks for the linked issue, looking forward to check my project against 0.57RC

Having unchanged react-native init RNmasterbranch (and having react-native eject) without that additional transformation-part seems to work again :) at least when calling yarn test everything works out for me.

Any short conclusion what the main culprit was?

[kelset]

Uhm I'm confused now:

1. react-native init RNmasterbranch just creates a standard 0.56 project - did you change afterwards the package.json to point to master?
2. You ran react-native eject on that fresh 0.56 project?
3. > Any short conclusion what the main culprit was?

I'm not sure it's related to why for you it's working now, but master basically now resolves correctly the Windows' path's format while bundling.

[FibreFoX]

@kelset oh sorry, yes, forgot mentioning that version-changing inside the package.json-file, being quite short on time made me skip that detail.

The Why is important for me, as I need to considering the stability of these changes, and a bit of curiosity, thats all.

[kelset]

Uhm ok I'm still confused, why did you run eject?

And

The Why is important for me, as I need to considering the stability of these changes, and a bit of curiosity, thats all.

I guess I phrased my last comment wrongly, but the "why" = "the main culprit" = "master basically now resolves correctly the Windows' path's format while bundling" ( = "before master on windows was having issue with path resolving"). Does this make more sense? 🤔

[FibreFoX]

That eject-part is to re-create as near as possible to our own project (I'm quite new to React/RN, so I am not aware of all parts of it, but reproducing this as near as possible was the best approach for me here) . Thanks for the clarification about that resolving-issue :) thats what I needed to know.

[kelset]

That eject-part is to re-create as near as possible to our own project

Was your project created via create-react-native-app? Because I'm concerned that running eject in a non-CRNA project could lead to weird side effects... or do nothing 😅

[shyaniv7]

@kelset I am running on a mac, there is still an issue with RN 0.56 babel 7 configuration and jest where jest ignores thetransformIgnorePatterns config so non of the dependencies that need to be transformed are being transformed

[FibreFoX]

@shyaniv7 this thread is about Windows :) maybe the current master-branch is working out for you too?

[shyaniv7]

@FibreFoX my bad I subscribed to all the threads with this error message from jest. I will test master but unfortunately we cannot go to production with an RC version and 0.56 fixed a major memory leak issue on android for us, so now we are stuck waiting

[dolsem]

I don't think this is a Windows-specific issue, I'm getting the same error under Linux. I also use jest-expo.

[FibreFoX]

@dolsem This worked on Linux and MacOS, therefor this indeed is/was windows-specific, as this seems to work with current master-branch, we just have to wait for the 0.57RC release to have this being verified. Can you try using current master-branch to see if this solves your problem too? Maybe your bug is a different one.

[kelset]

@dolsem are I explained above, using jest-expo is unsafe since expo is still on babel6.

@shyaniv7 I understand your feeling about

we cannot go to production with an RC version and 0.56 fixed a major memory leak issue on android for us, so now we are stuck waiting

but remember that you can always fork and cherry pick commits that may fix it for you.

Overall, we are not releasing a new 0.57 rc because we are stuck trying to fix an issue - you can follow along here.

[davidpricedev]

I can confirm the master branch of react-native has the issue resolved. I've also narrowed down the exact commit that fixed things - namely 3ac86c3.

Lately, I've been using patch-package to patch things that need fixing - especially when the fixes are small and patches are easy to comprehend. You can see that patch in action in the latest commit in my repro repo.

[pocesar]

failing for me on windows, using the latest everything (node 10.12, babel 7, RN 0.57.4, jest 23.6, on windows 10 64 bits), funny thing is that only jest tests fail, the code itself work inside the android emulator 😕
but why hardcode path separators when there's path.join and path.normalize? or if feeling frisky, use path.sep manually

[Nightsd01]

Any update to this issue?

[Iyoss]

I noticed that I'm getting this error when using a "cacheDirectory" parameter with "transform" into jest config.

{
  "name": "testApp",
  "version": "0.0.1",
  "private": true,
  "scripts": {
    "start": "node node_modules/react-native/local-cli/cli.js start",
    "test": "jest"
  },
  "dependencies": {
    "react": "16.6.3",
    "react-native": "0.57.8"
  },
  "devDependencies": {
    "babel-jest": "23.6.0",
    "jest": "23.6.0",
    "metro-react-native-babel-preset": "0.51.1",
    "react-test-renderer": "16.6.3"
  },
  "jest": {
    "preset": "react-native",
    "transform": { "^.+\\.js$": "<rootDir>/node_modules/react-native/jest/preprocessor.js" },
    "cacheDirectory": "<rootDir>/coverage/main/cache"
  }
}

React Native Environment Info:
    System:
      OS: Linux 4.15 elementary OS 0.4.1 Loki
      CPU: (8) x64 Intel(R) Core(TM) i7-4790 CPU @ 3.60GHz
      Memory: 2.53 GB / 15.57 GB
      Shell: 4.3.48 - /bin/bash
    Binaries:
      Node: 8.10.0 - ~/.nvm/versions/node/v8.10.0/bin/node
      Yarn: 1.12.3 - /usr/bin/yarn
      npm: 5.6.0 - ~/.nvm/versions/node/v8.10.0/bin/npm
      Watchman: 4.7.0 - /usr/local/bin/watchman
    SDKs:
      Android SDK:
        API Levels: 23, 25, 26, 27
        Build Tools: 25.0.2, 26.0.2, 26.0.3, 27.0.3, 28.0.0
        System Images: android-19 | Google APIs Intel x86 Atom, android-22 | Intel x86 Atom, android-23 | Google APIs Intel x86 Atom, android-24 | Google APIs Intel x86 Atom, android-26 | Google APIs Intel x86 Atom, android-26 | Google Play Intel x86 Atom, android-28 | Google APIs Intel x86 Atom
    npmPackages:
      react: 16.6.3 => 16.6.3 
      react-native: 0.57.8 => 0.57.8

[ajsmth]

For me the issue was watchman -- running the tests with the --no-watchman flag worked.

In my case, .watchmanconfig was ignoring node_modules

[pmemids]

I tried with different version of react native but not able to resolve this issue. It is not a Jest issue . It is related to react-native. Please help if anyone have a solution. I am getting same issue in react-native version 0.55.4 also.

[quietbits]

I am too getting the same error. My setup is with TypeScript, but I don't think it affects this. And I haven't been able to find a working solution online. Any help would be much appreciated.
System: MacOS
React Native: 0.57.8
Jest: 23.6.0

[diljeetk]

i am too getting the same error with versions :
reactNative: 0.58.6
jest: 22.4.3
MacOS
npm: 6.4.1
node: 10.15.1

Error Details:
Test suite failed to run

Cannot find module 'setupDevtools' from 'setup.js'

  at Resolver.resolveModule (node_modules/jest-resolve/build/index.js:169:17)
  at Object.<anonymous> (node_modules/react-native/jest/setup.js:3:6)

[Iyoss]

I was able to resolve it with: "watchman watch-del-all && rm -rf $TMPDIR/react-* && rm -rf $TMPDIR/metro-* && rm -rf $TMPDIR/haste-* && yarn cache clean && jest --clearCache"

[rickhanlonii]

If you see this issue it's due to this line in the react-native jest setup file:

jest.mock('setupDevtools');

The error is because for some reason Jest cannot see the setupDevtools module. To fix, verify that this file is actually in the project, and if it is then your haste/metro cache must be invalid and can't see it

To fix you can run @lyoss's command to reset all the caches

[bartekus]

FYI if you are working with a monorepo that has a mix of react-native and react-native-web then you might need to add "nohoist": ["**/react-native", "**/react-native/**"] to the main package.json(at the root of the monorepo)

[NicoleEtLui]

FYI here we fixed this issues in a monorepo and no hoisting with that kind of config for jest.config.js

````javascript
// packages/app/jest.config.js

const path = require('path')

module.exports = {
rootDir: path.join(__dirname, '../..'),
preset: "react-native",
moduleFileExtensions: ["ts", "tsx", "js", "jsx", "json", "node"],
transformIgnorePatterns: ["node_modules/(?!static-container)/"],
setupFiles: ["./node_modules/react-native-gesture-handler/jestSetup.js"],
testMatch: ["*/packages/app/__tests__/-test.tsx"]
};
````

working with:

• "react-native": "0.59.8",
• "react-native-web": "^0.11.2"

[adrian-moisa]

Several bugfixes were needed, and I managed to get the tests running:

• Eliminates unknown "export" token: "Unexpected token export, when import not compiled libraries"

"transformIgnorePatterns": [
    "node_modules/?!(react-router)"
],

• Removed jsdom - no longer emulating browser environment for react native. "TypeError: Cannot set property '_eventListeners' of undefined” with jest"
• Updated: testPathIgnorePatterns to ignore all folders except "src" so we can remove roots: ["src"] which causes: "Cannot find module 'setupDevtools' from 'setup.js'"