React-native: debugger-ui not shown console.log

[khanghyxda]

In tab console shown this error and debugger-ui can't see console to debug

debugger-ui:92 Uncaught TypeError: Cannot set property 'volume' of null
at Object.render (debugger-ui:92)
at Object.setState (debugger-ui:46)
at WebSocket.ws.onopen (debugger-ui:150)
render @ debugger-ui:92
setState @ debugger-ui:46
ws.onopen @ debugger-ui:150
debugger-ui:92 Uncaught TypeError: Cannot set property 'volume' of null
at Object.render (debugger-ui:92)
at Object.setState (debugger-ui:46)
at WebSocket.ws.onclose (debugger-ui:187)`

[pirosoft]

i have the same problem! did you solve it?

[treytrahin]

Refreshing the simulator ⌘R seems to work, at least some of the time. It would be nice if the error was more specific, though.

[tested01]

+1

[khanghyxda]

Hi
I solved it.
After this error, I tried to install canary chrome to debug, but I still have this error, I tried using Visual Code and installed Extension React Native Tool to debug. After debugging on Visual Code, I installed React Developer Tools and then suddenly the chrome canary did not get this error again. You try this way.

1. Install chrome canary
2. Install React Developer Tools

npm install -g react-devtools
react-devtools

1. Reset computer
   Good luck.

[pull-bot]

@facebook-github-bot no-template

[facebook-github-bot]

Hey, thanks for reporting this issue! It looks like your description is missing some necessary information, or the list of reproduction steps is not complete. Can you please add all the details specified in the Issue Template? This is necessary for people to be able to understand and reproduce the issue being reported. I am going to close this, but feel free to open a new issue with the additional information provided. Thanks! See "What to Expect from Maintainers" to learn more.

[sinner]

I'm having the same problem. Moreover, this error is making me not able to print information to debug through the console.log method. Here more details about the error:

Uncaught TypeError: Cannot set property 'volume' of null
at Object.render (debugger-ui:92) 92: silence.volume = 0.1;
at Object.setState (debugger-ui:46)
at WebSocket.ws.onopen (debugger-ui:150)
debugger-ui:1

Error in event handler for (unknown): TypeError: Cannot read property 'userId' of undefined
at chrome-extension://lifbcibllhkdhoafpjfnlhfpfgnpldfl/contentscript.js:1:841

[pedrommuller]

@sinner I have the same exact issue, and my app doesn't load on the emulator, any ideas?

Uncaught TypeError: Cannot set property 'volume' of null
at Object.render (debugger-ui:92)
at Object.setState (debugger-ui:46)
at WebSocket.ws.onopen (debugger-ui:150)
render @ debugger-ui:92
setState @ debugger-ui:46
ws.onopen @ debugger-ui:150

[RossKinsella]

Getting this issue also

[cadz]

I just starting to learn react-native and i thought there is problem with my redux-logger implementation. Almost pulling my hair out of this. any solution yet?

if its any help. i didn't got this error on Mac OS X 10.11.6 & chrome Version 61.0.3163.100 (Official Build) (64-bit).
But on Linux 4.4.0-97-generic #120-Ubuntu x86_64 & chrome Version 61.0.3163.100 (Official Build) (64-bit) got this error.
on both system, console.log are not showing on the debugger-ui's console.

Installed react-devtools, there is also nothing on react-devtools's console.

[cadz]

ok, i think i finally able to get this to work.
on the react-native app, press ctrl+M (or Command + M on mac, or "adb shell input keyevent 82" via shell) to open developer menu. and choose "Debug JS Remotely" .
only after this the logging on debugger-ui will work.

you might want to close all opened debugger-ui windows/tabs. choosing debug js remotely will open a new tab.

[magneticz]

I had same issue for two days, which severely hurt my work progress. At the end, i tried to disable all my extensions on chrome and it worked. After that, I started enabling them one by one, but it kept working fine, so i couldn't single out one extension that was causing it. I suspect it was either adblocker or react/redux-dev-tools.

[RajeshwariGandmal]

Same issue...has anyone found a way out?

[mymai91]

@RajeshwariGandmal press Command and M and then reload http://localhost:8081/debugger-ui/

[lironzluf]

It didn't load for me, opened the debugger-ui and saw this error.
The solution was to close the iPhone simulator, reopen it as standalone (not by run-ios command) and then click on the app, then it should work.
Reattaching the debugger-ui with Command + D -> Debug JS remotely

[Graham42]

I've opened an issue for this that follows the template so bots wont close it. If you are still experiencing this please go :+1: it
https://github.com/facebook/react-native/issues/17941

[afilp]

@sinner Did you find any solution to this? I tried everything, upgraded all packages and still cannot work on the project (I am on Windows 10, if this is a problem). I also get this Uncaught TypeError: Cannot set property 'volume' of null problem.

[kyriakos]

I also get the volume of null problem, but weirdly doesn't happen every time. To be more specific, the first time I make a change in the source code and it builds it works without a problem. If I hit CTRL-R it reloads giving the error message.

[adipascu]

I fixed this by disabling the "Adblock Plus" Chrome extension.

[mustafaskyer]

same issue :-
only in android , with genymotion
i remove all extensions , not working also React Native Debugger
gives me
App Crash => [ unfortunately App has stopped ]
any help please ,
thanks in advance

[mikeyamato]

The solution is a combination of what @cadz and @lironzluf posted.

For Mac OS...
With the iPhone simulator open type ⌘ + D to bring up the in-app developer menu. Next click Debug JS Remotely.

Note: if you're running Android Studio on a Mac type ⌘ + M instead.

For Windows OS I'm guessing the solution to be similar. With your Android simulator open type Control + M then click Debug JS Remotely.