Runtime error after upgrade to React Native 0.61 - "TypeError: hmrClient.send is not a function"

[huntie]

I am in the process of updating an existing project from react-native 0.60.4 to 0.61.2. The app is successfully packaged and installs on my local iOS Simulator. The Metro Bundler successfully serves the app to the device. My observations are as follows:

• Upon running, a red screen error headlined TypeError: hmrClient.send is not a function. is displayed on every launch, regardless of whether Fast Refresh is enabled or disabled.
• This red screen message can be dismissed, and underneath I have a functional, navigable application.
• No Fast Refresh functionality works when enabled, most likely tied directly to this.

React Native version:

yarn run v1.19.1
$ /Users/alex/Development/<project>/node_modules/.bin/react-native info
info Fetching system and libraries information...
System:
    OS: macOS 10.15
    CPU: (4) x64 Intel(R) Core(TM) i7-7660U CPU @ 2.50GHz
    Memory: 141.59 MB / 16.00 GB
    Shell: 3.0.2 - /usr/local/bin/fish
  Binaries:
    Node: 10.16.3 - /var/folders/t_/q6_rnx915r38lst_z95l6swh0000gn/T/yarn--1571762447670-0.2398560026433516/node
    Yarn: 1.19.1 - /var/folders/t_/q6_rnx915r38lst_z95l6swh0000gn/T/yarn--1571762447670-0.2398560026433516/yarn
    npm: 6.11.3 - ~/.config/nvm/10.16.3/bin/npm
    Watchman: 4.9.0 - /usr/local/bin/watchman
  SDKs:
    iOS SDK:
      Platforms: iOS 13.0, DriverKit 19.0, macOS 10.15, tvOS 13.0, watchOS 6.0
    Android SDK:
      API Levels: 28, 29
      Build Tools: 28.0.3, 29.0.2
      System Images: android-29 | Google APIs Intel x86 Atom
  IDEs:
    Android Studio: 3.5 AI-191.8026.42.35.5900203
    Xcode: 11.0/11A420a - /usr/bin/xcodebuild
  npmPackages:
    react: 16.9.0 => 16.9.0 
    react-native: 0.61.2 => 0.61.2
Done in 7.47s.

Error output

TypeError: hmrClient.send is not a function. (In 'hmrClient.send(JSON.stringify({
        type: 'log-opt-in'
      }))', 'hmrClient.send' is undefined)

enable
    HMRClient.js:70:19
setup
    HMRClient.js:241:6
callFunctionReturnFlushedQueue
    [native code]:0

Other notes

Interestingly, this isn't caught by this preceding invariant statement in the enable or disable members of HMRClient. I suspect it's related to some misalignment within HMRClient.js or any corresponding native code.

react-native/Libraries/Utilities/HMRClient.js

Lines 67 to 72 in 10f55e7

	invariant(hmrClient, 'Expected HMRClient.setup() call at startup.');
	const LoadingView = require('./LoadingView');
	// We use this for internal logging only.
	// It doesn't affect the logic.
	hmrClient.send(JSON.stringify({type: 'log-opt-in'}));

[AlexUzan]

What fixed it for me was to update metro, metro-core and metro-react-native-babel-preset to 0.56
In the end I chose to remove metro and metro-core because it seems they are no longer needed, but just updating them should do the trick

[erwamartin]

I just upgraded to React Native 0.61.4 and I'm getting this issue.
And I also upgraded metro-react-native-babel-preset to 0.56 and tried 0.57 but it doesn't solve my issue.
I confirm that I can just dismiss the error and everything work but Fast Refresh doesn't seem to be working.

[fdobre]

I am getting this too after an upgrade from 0.59.10 to 0.61.4. I don't have metro and metro-core and metro-react-native-babel-preset is already set to 0.56 but still getting the error. Has anybody found a fix for this?

[sibelius]

@AlexUzan what exactly packages do you upgrade to 0.56 ?

[huntie]

Thanks all! Got back to this today and can confirm that for me this was caused by a project-level dependency on metro-config@^0.55.0. Since this is a caret range match which treats 0.56.0 as incompatible, this meant that I still had 0.55.0 installed local to the project. I then have a Yarn Workspaces setup which meant this version was selected by the Metro Bundler. Closing the issue as this is therefore a project configuration problem and not a bug in React Native.

[Doenja]

I had the same issue with a React Native app, initialised without the use of expo. 'hrmClient.send is not a function' displayed every time I build/refreshed my app and fast refresh was not working.

This fixed my problem:
yarn add metro@0.56.0

from: https://www.gitmemory.com/issue/react-native-community/releases/140/530142204

[IbrahimSulai]

I had the same issue with a React Native app, initialised without the use of expo. 'hrmClient.send is not a function' displayed every time I build/refreshed my app and fast refresh was not working.

This fixed my problem:
yarn add metro@0.56.0

from: https://www.gitmemory.com/issue/react-native-community/releases/140/530142204

This worked for me...Thanks a lot 👍

[marinamuse]

I had the same issue. For me the fix was to delete the react-native-paper package (it was causing the issue) and yarn add metro@0.56.0 thanks to @Doenja