React-native: React Native Packager sometimes crashes with WebSocket "ERROR not opened"

[ndbroadbent]

Description

When developing an app and reloading the iOS simulator, occasionally the react native packager will crash, and I have to restart it.

Here is the output from my console:

Bundling `index.ios.js`
  No module changed.
Bundling `index.ios.js`
  No module changed.
Bundling `index.ios.js`
  No module changed.
 ERROR  not opened
Error: not opened
    at WebSocket.send (/Users/ndbroadbent/code/myapp/node_modules/ws/lib/WebSocket.js:219:16)
    at Server.packagerServer.setHMRFileChangeListener [as _hmrFileChangeListener] (/Users/ndbroadbent/code/myapp/node_modules/react-native/local-cli/server/util/attachHMRServer.js:149:21)
    at Server.onFileChange (/Users/ndbroadbent/code/myapp/node_modules/react-native/packager/react-packager/src/Server/index.js:406:12)
    at Server.processFileChange (/Users/ndbroadbent/code/myapp/node_modules/react-native/packager/react-packager/src/Server/index.js:236:40)
    at Array.forEach (native)
    at HasteMap.dependencyGraph.getWatcher.on (/Users/ndbroadbent/code/myapp/node_modules/react-native/packager/react-packager/src/Server/index.js:261:40)
    at emitOne (events.js:101:20)
    at HasteMap.emit (events.js:188:7)
    at Timeout.emitChange [as _repeat] (/Users/ndbroadbent/code/myapp/node_modules/jest-haste-map/build/index.js:558:14)
    at Timeout.wrapper [as _onTimeout] (timers.js:425:11)

See http://facebook.github.io/react-native/docs/troubleshooting.html
for common problems and solutions.

Reproduction Steps and Sample Code

This happens when I press CMD+R to reload the iOS simulator, but it only happens once every few hours. Sometimes just once a day.

Solution

Catch the error, and just ignore it instead of crashing.

Workaround

I've just been running: while true; do react-native start; done

Additional Information

• React Native version: 0.41.2
• Platform: iOS
• Development Operating System: MacOS
• Dev tools: XCode 8.2.1, iOS 8.4 Simulator.

[bucketclan]

Happening for react-native - 0.40.0 too.

[yukkeechang]

I get this error when trying to use the react-native-element module :( just the Error: not opened and all the error messages after that. Does anyone know why that happens?

[Tasemu]

+1 driving me crazy

[18601673727]

+1, 0.46.4 also

[jd20]

+1, 0.48.3 on 10.12.6 with Xcode 9.0 (9A235). Seems recent, possibly caused by having certain dependencies. I'm not seeing the packager crash, but when pressing Cmd+R I will usually get 1-4 of these errors in a row, with the screen rapidly flashing. Let me know if there's any other info I can provide to help!

[mobinni]

0.48.4 as well

[M-Jas]

@jd20 We ran into a similar issue along with other issue(signing, linker, ...) with xcode 9. We got around this by reinstalling xcode 8.3.3. Like Magic the issue went away. So unless you/anyone really needs xcode 9 I would suggest reverting until apple works some of the kinks out.

Update: My solution worked my teams case so it might not work for everyone. It's seems that this is a common issue with multiple answers. If mine does not work I do apologize!

[jimji1005]

Started to happen to me at 0.49.3

packager does not crash but does have error

[ada-lovecraft]

Attempted @M-Jas's solution. Still getting this error.

[M-Jas]

@8-uh Are you dealing with any overall app state?

[shuaibird]

My Xcode version is 9.1.0 and I'v got the same issue. Still don't fix it.

[jose920405]

+1

My error code 1005

[comur]

+1 on simulator and device too

[manosim]

Switching from Node 6 to Node 7 fixed this issue for me.

Current Setup:

XCode 9.1
RN 0.50.1
Node 7.10.1

[RyanMitchellWilson]

Still getting this.
Here is my setup:

XCode: 8.3.3
RN 0.50.3
Node 7.5.0

It doesn't seem to be causing problems but it does print out a new error in my packager every time I reload the app.

[a3diti]

i thought the websockets required an error handle but the problem was fixed just by cleaning cache
npm start -- --reset-cache

[beeirl]

+1 same here. Any updates on this?

[mschipperheyn]

I see this on 0.49.5 as well. In my case, the app crash occurs when you try to send a message to a websocket that has already closed, but the app thinks it's still open. I think that is basically what is happening. I see the same error as @ndbroadbent

[sperrow]

Also seeing this error

[nstr]

Hi, guys. Are you sure that you do not forget add zIndex?

with zIndex everything works fine.

[shuaibird]

zIndex only works for iOS, not for android

A javascript pirate.

On Dec 20, 2017, 9:12 PM +0800, Nick Nesterov [e-mail], wrote:

Hi, guys. Are you sure that you do not forget add zIndex?
with zIndex everything works fine.
—
You are receiving this because you commented.
Reply to this email directly, view it on GitHub, or mute the thread.

[PrimeTimeTran]

Also getting this error.

brew: 1.4.1
npm: 5.5.1
node: v8.9.3
react-native-cli: 2.0.1
react-native: 0.51.0
Xcode 8.2.1
Build version 8C1002

Tried to provide as much information as I can because I just picked up RN again after about a year away(had to update everything)

[duytq1303]

+1 me too

[dennis-tra]

+1 me too

[truongTK]

+1 me too

[guiherzog]

+1 me too.

[hezhii]

+1 me too.

[nkov]

For me, it doesn't crash, but hot reload and even manual reload stops working until I restart the packager.

[derekbrown]

Is this being looked at by anyone?

Long, ongoing issue with multiple me-toos (may as well include my own) and very little response in terms of solutions.

Has anyone found anything that works across dev environments?

Doesn't seem to be a node or xcode issue, per attempts above.

[Trevoke]

Don't worry everyone, they're aware of the issue, it's in the code.

    try {
      dest.send(message);
    } catch (e) {
      console.warn(e);
      // Sometimes this call throws 'not opened'
    }
  }

https://github.com/facebook/react-native/blob/0cd69e8a02d254577fac9ccd3ff8a1727a024cc8/local-cli/server/util/webSocketProxy.js#L29

[idrakimuhamad]

yes i notice that when this error starts popping out, my hot reload aren't working anymore and I have to literally stop the packager, and rebuild again. Else I will always be shown the same app before the changes. To some extend, I have to delete the app in the simulator and run again.

[flavio-dev]

I am also interested to know when a solution will be out there. Everything was working fine until very recently while trying to implement with react native navigation (I don't know if that is related).

Environment:
OS: macOS High Sierra 10.13.2
Node: 9.3.0
Yarn: 1.3.2
npm: 5.5.1
Watchman: 4.9.0
Xcode: Xcode 9.2 Build version 9C40b
Android Studio: 3.0 AI-171.4443003

Packages: (wanted => installed)
react: 16.2.0 => 16.2.0
react-native: 0.52.0 => 0.52.0

[jd20]

@idrakimuhamad Do you have remote debugging enabled when the hot reloads stop working? I had similar freezes, when remote debugging had been on for a while, and I usually work around them by turning debugging off, quitting Chrome, and re-enabling remote debugging. Faster than stopping packager and rebuilding the app.

[idrakimuhamad]

Yes. It usually happened when the debugger was open. Somehow it trigger the action when I’m saving my code but it didn’t rebuilt it using the recent code. When the debugger switched off, it works again.

[ivorscott]

Turn the debugger off. then npm start -- --reset-cache

[MaxInMoon]

In my case it happened after I had babel import aliases in .babelrc

{
  "presets": ["react-native"],
  "plugins": [
    ["module-resolver", {
      "root": ["./src"],
      "alias": {
        "@App": "./src/App.js"
      }
    }]
  ]
}

if i remove it, the problem disappear.

_in my case the problem doesn't affect the code update when hot/manual reloading, it just gives me a error in the terminal._

@ivorscott suggestion didn't resolve the error for me.

[stale[bot]]

Hey there, it looks like there has been no activity on this issue recently. Has the issue been fixed, or does it still require the community's attention? This issue may be closed if no further activity occurs. You may also label this issue as "For Discussion" or "Good first issue" and I will leave it open. Thank you for your contributions.

[avirefundit]

I've made an upgrade from 0.52 to 0.55 and the packager started to print this error with ws. Anyway, I'm using WebSocket for my app to connect the server and it works fine. Nothing happen except printing the error to the packager.

[brayanL]

the error will carry on?.

[btravel]

+1 Does anyone have the similar chrome rendering artifacts (see #19988) with this web socket error as me?

[webika]

+1 having the issue with the socket

[Alec321]

+1 having this issue

[andycloke]

+1

[TisnKu]

+1 on 0.39.2

[TeruyaHaroldo]

+1

[athongintel]

+1

[BaderSerhan]

+1 Me too! It is very irritating because even after I reset the packager's cache it is still happening. The app is freezing and I cannot press anything until I close it and open it again.
Stopping remote JS Debugging didn't help.

[mcatmos]

+1

[luco]

+1 on this. Is really annoying.

[ikhide]

npm start -- --reset-cache

worked for me

[AlexeyZich]

npm start -- --reset-cache not work for me.
For me: Before start app and develop on device or simulator, I just remove this app and install again. Yes, problem does not solution, but I can continue developing app. Sorry for my English😄

[hramos]

The packager has its own repro, can you folks open the issue over there? http://github.com/facebook/metro

[leethree]

is there an issue opened on Metro? can anyone post a link?

[fvsegarra]

Any updates on this? None of the above worked for me either

[callyb]

+1