Create-react-app: Error in jest watch when using yarn for dependency installation

[aztecrex]

If you are reporting a bug, please fill in below. Otherwise feel free to remove this template entirely.

Can you reproduce the problem with latest npm?

Can you still reproduce it?

Yes.

Description

npm test, yarnpkg test, yarn test all fail when dependencies are installed with
yarn install. They all work fine when dependencies are installed with npm install.

In CI mode (not watched), tests run fine after installing deps with yarn. Research indicates others are having similar problems with tools like Watchman which leads me to believe that something is different in how Jest is performing the watch depending on how it is installed. There is also a
sense that this has to do with OSX Sierra.

Expected behavior

Tests run

Actual behavior

Crash. See stack trace beow.

Environment

Run these commands in the project folder and fill in their results:

1. npm ls react-scripts: [email protected]
2. node -v: v7.4.0
3. npm -v: 4.1.2

Then, specify:

1. Operating system: Darwin trefoil 16.3.0 Darwin Kernel Version 16.3.0: Thu Nov 17 20:23:58 PST 2016; root:xnu-3789.31.2~1/RELEASE_X86_64 x86_64

2. Browser and version: Not a browser isssue

Reproducible Demo

Easy: this happens from a fresh create-react-app when Yarn (freshly brewed today)
is installed. yarnpkg test will fail. Now delete _node_modules_ and run
npm install now npm test works fine. delete _node_modues_ and run
yarn install, bad behavior returns.

Push to GitHub and paste the link here.

https://github.com/aztecrex/demo-create-react-app-yarn-problem

Full stack trace:

2017-01-30 18:58 node[77220] (FSEvents.framework) FSEventStreamStart: register_with_server: ERROR: f2d_register_rpc() => (null) (-22)
2017-01-30 18:58 node[77220] (FSEvents.framework) FSEventStreamStart: register_with_server: ERROR: f2d_register_rpc() => (null) (-22)
2017-01-30 18:58 node[77220] (FSEvents.framework) FSEventStreamStart: register_with_server: ERROR: f2d_register_rpc() => (null) (-22)
2017-01-30 18:58 node[77220] (FSEvents.framework) FSEventStreamStart: register_with_server: ERROR: f2d_register_rpc() => (null) (-22)
2017-01-30 18:58 node[77220] (FSEvents.framework) FSEventStreamStart: register_with_server: ERROR: f2d_register_rpc() => (null) (-22)
2017-01-30 18:58 node[77220] (FSEvents.framework) FSEventStreamStart: register_with_server: ERROR: f2d_register_rpc() => (null) (-22)
2017-01-30 18:58 node[77220] (FSEvents.framework) FSEventStreamStart: register_with_server: ERROR: f2d_register_rpc() => (null) (-22)
2017-01-30 18:58 node[77220] (FSEvents.framework) FSEventStreamStart: register_with_server: ERROR: f2d_register_rpc() => (null) (-22)
2017-01-30 18:58 node[77220] (FSEvents.framework) FSEventStreamStart: register_with_server: ERROR: f2d_register_rpc() => (null) (-22)
events.js:160
      throw er; // Unhandled 'error' event
      ^

Error: Error watching file for changes: EMFILE
    at exports._errnoException (util.js:1022:11)
    at FSEvent.FSWatcher._handle.onchange (fs.js:1283:11)
error Command failed with exit code 1.

[gaearon]

Can you check if node_modules/fsevents exists after installing with either Yarn or npm?

[robertlyall]

I'm having the same problem with version 1.0.3.

fsevents existed in my node_modules directory after installing with npm install, yarn install and yarnpkg install, however I could only run tests after installing with npm.

[gaearon]

Which version of Yarn are you using?

[robertlyall]

I'm using Yarn version 0.19.1.

[gaearon]

Could this be a regression? Would you mind installing 0.18 and trying again?

[robertlyall]

Experiencing the same problem with 0.18.0, 0.18.1 and 0.20.0.

It may be worth noting that I'm using Yarn installed globally via NPM. I can try again using Homebrew if you'd like?

[aztecrex]

The one giving me trouble is 0.19.1 installed via Homebrew. That was my first version so can't brew switch

[gaearon]

Can you figure out what the difference between installs produced by Yarn and npm is? Is some package or binary missing?

[robertlyall]

I'm not sure what's the best way to do that. Do you have any suggestions?

I ran npm ls after yarn install and saw the following error:

npm ERR! extraneous: [email protected] /path/to/project/node_modules/node-pre-gyp

npm start does not show the same error. I don't know whether this error is important or not.

[hongrich]

Is this the same as https://github.com/facebookincubator/create-react-app/issues/871? Maybe try installing watchman?

[aztecrex]

i just pushed the repo with both node_modules and a diff, https://github.com/aztecrex/demo-create-react-app-yarn-problem. Interesting, here is the result of du -sh *

 60K    README.md
 11M    node_modules.diff
127M    node_modules.npm
531M    node_modules.yarn
4.0K    package.json
 32K    public
 24K    src

(node_modules_diff is just the text output of diff -r node_modules.*)

[aztecrex]

@hongrich i had tried that yesterday. I just tried it again: install watchman, delete node_modules, yarn install. I get many warnings before jest gives me the watch UI, for example:

jest-haste-map: duplicate manual mock found:
  Module name: fetchWithRetries
  Duplicate Mock path: /Users/aztecrex/Working/demo-create-react-app-yarn-problem/node_modules.npm/fbjs/lib/__mocks__/fetchWithRetries.js
This warning is caused by two manual mock files with the same file name.
Jest will use the mock file found in:
/Users/aztecrex/Working/demo-create-react-app-yarn-problem/node_modules.npm/fbjs/lib/__mocks__/fetchWithRetries.js
 Please delete one of the following two files:
 /Users/aztecrex/Working/demo-create-react-app-yarn-problem/node_modules.yarn/fbjs/lib/__mocks__/fetchWithRetries.js
/Users/aztecrex/Working/demo-create-react-app-yarn-problem/node_modules.npm/fbjs/lib/__mocks__/fetchWithRetries.js

When i press a, It runs and fails a bunch of tests I don't have (this is just a newly-created CRA so it should have just one), for example,

  ● main export › should export propName from root

    ENOENT: no such file or directory, stat '/Users/aztecrex/Working/demo-create-react-app-yarn-problem/propName.js'

      at Object.fs.statSync (fs.js:907:18)
      at Object.it (node_modules.npm/jsx-ast-utils/__tests__/src/index-test.js:

After I uninstall watchman, the behavior goes back to the one described in this report.

[gaearon]

I get many warnings before jest gives me the watch UI, for example

This is because of those node_modules.npm and node_modules.yarn folders which conflict. I wonder if there’s a way to disable Haste completely in open source with some config option, cc @cpojer? It’s not really useful to CRA users.

[aztecrex]

Removed those dirs and the "install watchman" workaround fixes the problem. Uninstalling watchman causes it to re-occur.

@hongrich glad I tried it again

[cpojer]

@gaearon yeah we are making some changes that should improve this situation.

[gaearon]

Going to close since this is out of our control.
If you have issues with Yarn please report them, and use npm while they are being fixed.

[tsironis]

I fixed the issue upgrading yarn to v0.20.1 and then brew install watchman. Apparently, there is a problem watching file changes in macOS Sierra.

[gaearon]

Apparently, there is a problem watching file changes in macOS Sierra.

If your tests hang, that's not the problem described in this issue. For that problem, please see here.

[tsironis]

Sorry my bad! I didn't describe this correctly, I meant FSWatcher is not longer available in macOS Sierra so watchman is required.

[bholtbholt]

I hit this issue today on macOS High Sierra using Yarn. Deleting my node_modules and rerunning yarn fixed it for me.