React-native: Debug JS Remotely crashes 0.52.0

[Graham42]

Is this a bug report?

Yes

Have you read the Contributing Guidelines?

Partly

Environment

Environment:
OS: Linux 4.4
Node: 8.9.4
Yarn: 1.3.2
npm: 5.6.0
Watchman: Not Found
Xcode: N/A
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

Steps to Reproduce

1. Create a project following the Getting Started guide (Quick start tab)
2. Switch to the _Building Projects with Native Code_ tab of the guide, and follow the steps there to create an Android Virtual Device
3. Start the Android Virtual Device
4. Run npm run android in the fresh project
5. Once the app has loaded in the Android emulator, press Ctrl+M to bring up the dev tools menu
6. Select "Debug JS Remotely"
7. In the Chrome browser that opens, open the web console Ctrl+Shift+I
8. Enable _Pause on exceptions_
9. Reload the Chrome page
10. Error will occur here

Expected Behavior

The debugger to not crash

Actual Behavior

The debugger crashed.

Stacktrace:

(index):94 Uncaught TypeError: Cannot set property 'volume' of null
    at Object.render ((index):94)
    at Object.setState ((index):48)
    at WebSocket.ws.onopen ((index):152)

Reproducible Demo

No project code changes are need to reproduce this. Just run

npx create-react-native-app TestProject

Note: npx is available if you have the at least [email protected] installed

[KunwarSingh]

any updates on this issue, I'm facing this as well

[react-native-bot]

Thanks for posting this! It looks like you may not be using the latest version of React Native, v0.53.0, released on January 2018. Can you make sure this issue can still be reproduced in the latest version?

I am going to close this, but please feel free to open a new issue if you are able to confirm that this is still a problem in v0.53.0 or newer.

_{How to Contribute • What to Expect from Maintainers}

[Meligy]

I'm having the same issue with react-native [email protected]

Can we please reopen this issue?

[megelismi]

I'm also facing this issue with react-native [email protected]

[KunwarSingh]

Its working now on 0.53.0
Just turn off all your google chrome extensions and restart it. Then debug-mode works like charm.

[afilp]

I am also having the issue in 0.53.0. Sometimes it works sometimes not. Disabling all extensions should not be the solution (not even tried this), because we will not be able to work on chrome with many other websites during development.

[Pastromhaug]

I'm having the same issue on 0.53.0 on Android

[afilp]

Can this issue be reopened please? Why do bots close it?

It is obvious that when using Android Studio to "Debug app" then we get the Uncaught TypeError: Cannot set property 'volume' of null problem.

[jaredgalanis]

For me adding export default to this line:

export default class App extends Component {

In App.js is what got rid of the issue.

[afilp]

Thanks but I already have this export default in class.

[dhrubesh]

Can anyone help me on this?

[ldco2016]

I am also getting this issue in the http://localhost:8081/debugger-ui/.

Turning react extension off and on did not work.

Please help.

[speculees]

Any updates on this?
{... "private": true, "devDependencies": { "babel-preset-react-native-stage-0": "^1.0.1", "jest": "^23.1.0", "jest-react-native": "^18.0.0", "react-test-renderer": "16.3.1" }, "scripts": { "start": "react-native start", "android": "react-native run-android", "ios": "react-native run-ios", "test": "jest" }, "jest": { "preset": "react-native" }, "dependencies": { "react": "16.3.1", "react-native": "~0.55.2", "react-native-maps": "^0.21.0" }... }

[Graham42]

React native folks generally don't check closed issues, @speculees ,recommend you open a new issue with the latest version

[iwenchao]

昨天我也遇到了这个问题,enable debug remotely crash. 不过我发现chrome 出现cached bundle. 所以清除了缓存.然后重新进入就好了 . 花了4个小时,有点心痛