React-native: RemoteJs Debug Enabling crashs after Upgrade to v0.50.1 .

[saeedtabrizi]

Is this a bug report?

Yes

Have you read the Contributing Guidelines?

Yes

Environment

Environment:
OS: Linux 4.13
Node: 9.0.0
Yarn: 0.27
npm: 5.5.1
Watchman: Not Found
Xcode: N/A
Android Studio: 3.0 AI-171.4408382

Packages: (wanted => installed)
react: ^16.0.0 => 16.0.0
react-native: ^0.50.1 => 0.50.1

Steps to Reproduce

1. Upgrade via running react-native-git-upgrade .
2. run react-native run-android
3. enable remotejs debug mode in device
4. crash when loading and prompt in my console SyntaxError: Unexpected token < message.

also i have use clear cache commands and reinstall npm modules.

Expected Behavior

Just normally load js in debug mode .
I Think something goes wrong in js bundler for enabling debugging mode .
Except the enabling remote js debugging mode everything works OK even the hot reloading and i can see the changes normally .

Actual Behavior

Shows white screen and a timeout message after the seconds that show the js file not loaded because there is a critical error happened .

[richardgirges]

Seeing the same exact error/stack trace on 0.50.1 when running run-ios w/ remote debugging.

[hjbramos]

My app stop after double RR =/

Message: Unfortunatley app_name has stopped.

Node: v8.9.0
Android Studio: 3.0
JDK: 1.8.0_152
Python: 2.7.14
SO: Windows 10 1703
gradle: 2.2.3​
react-native-cli: 2.0.1
react-native: 0.50.1
AVD: Nexus 5 API 23 Android 6.0 x86_64 4GB

EDIT: It looks like it's the AVD version. Debug works fine on AVD API 27.

[kesha-antonov]

+1 First run ok. Then reload code. Crash

*** Terminating app due to uncaught exception 'NSInternalInconsistencyException', reason: 'bridge is not set. This is probably because you've explicitly synthesized the bridge in RCTKeyboardObserver, even though it's inherited from RCTEventEmitter.'
*** First throw call stack:
(
    0   CoreFoundation                      0x0000000110d031cb __exceptionPreprocess + 171
    1   libobjc.A.dylib                     0x000000010f751f41 objc_exception_throw + 48
    2   CoreFoundation                      0x0000000110d08362 +[NSException raise:format:arguments:] + 98
    3   Foundation                          0x000000010be12523 -[NSAssertionHandler handleFailureInFunction:file:lineNumber:description:] + 165
    4   AppName                               0x0000000109780bf8 -[RCTEventEmitter sendEventWithName:body:] + 408
    5   AppName                               0x00000001097c6b84 -[RCTKeyboardObserver keyboardWillChangeFrame:] + 116
    6   CoreFoundation                      0x0000000110c9f07c __CFNOTIFICATIONCENTER_IS_CALLING_OUT_TO_AN_OBSERVER__ + 12
    7   CoreFoundation                      0x0000000110c9ef7a _CFXRegistrationPost + 442
    8   CoreFoundation                      0x0000000110c9ecc2 ___CFXNotificationPost_block_invoke + 50
    9   CoreFoundation                      0x0000000110c60a32 -[_CFXNotificationRegistrar find:object:observer:enumerator:] + 1826
    10  CoreFoundation                      0x0000000110c5fbac _CFXNotificationPost + 652
    11  Foundation                          0x000000010bd19842 -[NSNotificationCenter postNotificationName:object:userInfo:] + 66
    12  UIKit                               0x000000010d9d2138 -[UIInputWindowController postStartNotifications:withInfo:] + 225
    13  UIKit                               0x000000010d9d4574 __77-[UIInputWindowController moveFromPlacement:toPlacement:starting:completion:]_block_invoke.1000 + 396
    14  UIKit                               0x000000010ce5c9ec +[UIView(UIViewAnimationWithBlocks) _setupAnimationWithDuration:delay:view:options:factory:animations:start:animationStateGenerator:completion:] + 560
    15  UIKit                               0x000000010ce5ce3f +[UIView(UIViewAnimationWithBlocks) _animateWithDuration:delay:options:animations:start:completion:] + 116
    16  UIKit                               0x000000010d9d3f81 -[UIInputWindowController moveFromPlacement:toPlacement:starting:completion:] + 1558
    17  UIKit                               0x000000010d9dc15f -[UIInputWindowController setInputViewSet:] + 859
    18  UIKit                               0x000000010d9d35c2 -[UIInputWindowController performOperations:withAnimationStyle:] + 50
    19  UIKit                               0x000000010d57cae4 -[UIPeripheralHost(UIKitInternal) setInputViews:animationStyle:] + 1147
    20  UIKit                               0x000000010cfc6781 -[UIResponder(UIResponderInputViewAdditions) reloadInputViews] + 81
    21  UIKit                               0x000000010cfc28ae -[UIResponder becomeFirstResponder] + 891
    22  UIKit                               0x000000010ce52327 -[UIView(Hierarchy) becomeFirstResponder] + 145
    23  UIKit                               0x000000010cfc2bb6 -[UIResponder resignFirstResponder] + 238
    24  UIKit                               0x000000010da94b4b -[UITextField resignFirstResponder] + 135
    25  UIKit                               0x000000010ce39a00 -[UIView setUserInteractionEnabled:] + 315
    26  AppName                               0x00000001097ac3c3 -[RCTRootContentView invalidate] + 83
    27  AppName                               0x000000010980235f __26-[RCTUIManager invalidate]_block_invoke + 559
    28  AppName                               0x00000001097d211d __RCTExecuteOnMainQueue_block_invoke + 29
    29  libdispatch.dylib                   0x0000000113ae53f7 _dispatch_call_block_and_release + 12
    30  libdispatch.dylib                   0x0000000113ae643c _dispatch_client_callout + 8
    31  libdispatch.dylib                   0x0000000113af16f0 _dispatch_main_queue_callback_4CF + 628
    32  CoreFoundation                      0x0000000110cc5ef9 __CFRUNLOOP_IS_SERVICING_THE_MAIN_DISPATCH_QUEUE__ + 9
    33  CoreFoundation                      0x0000000110c8a662 __CFRunLoopRun + 2402
    34  CoreFoundation                      0x0000000110c89a89 CFRunLoopRunSpecific + 409
    35  GraphicsServices                    0x000000011550e9c6 GSEventRunModal + 62
    36  UIKit                               0x000000010cd9ad30 UIApplicationMain + 159
    37  AppName                               0x00000001091303cf main + 111
    38  libdyld.dylib                       0x0000000113b62d81 start + 1
    39  ???                                 0x0000000000000001 0x0 + 1
)
libc++abi.dylib: terminating with uncaught exception of type NSException
(lldb) 

[dahjelle]

Oddly, I can't reproduce this consistently. I've seen it on iOS once and a co-worker was unable to get past the error message SyntaxError: Unexpected token < in the Chrome debugger on Android. I tried reproducing on Android emulator but couldn't.

Reverting to a previous version of React Native for now…

[aubreywahl]

I'm also seeing the SyntaxError: Unexpected token < in a fresh RN project on my iOS simulator when I try to remote debug.

[saeedtabrizi]

@aubreywahl , It seems as a high priority bug definition .

[sibelius]

this is happening to me as well

[dsah]

Facing same issue

[Guodadada]

"react-native run-ios", this is happening to me as well

[hannescalibrate]

Having the same problem

[Guodadada]

@saeedtabrizi Is the problem solved?

[saeedtabrizi]

Hi @Guodadada , The short asnwer is NO .
There is no any change or release to test it again .

Update :
The short asnwer is YES .
I can confirm when i upgrade my project via react-native-git-upgrade to react-native0.50.3the problem solved completely and debugger works normally.
Thanks .

[Blapi]

Is this still happening to some guys? I upgraded my react-native version yesterday to 0.50.0 but the debugger was not working. Today, I did what @saeedtabrizi said (react-native-git-upgrade 0.50.3) but still, it's not working and I'm having a timeout message on my device and this message in my console :

localhost/:183 Uncaught SyntaxError: Unexpected token ...

  if (object.method === 'prepareJSRuntime') {
    shutdownJSRuntime();
    console.clear();
    createJSRuntime();
    ws.send(JSON.stringify({replyID: object.id}));
    Page.setState({status: {type: 'connected', id: object.id}});
  } else if (object.method === '$disconnected') {
    shutdownJSRuntime();
    Page.setState({status: {type: 'disconnected'}});
  } else if (object.method === 'executeApplicationScript') {
    worker.postMessage({
      ...object, // line 183
      url: await getBlobUrl(object.url),
    });
  } else {
    // Otherwise, pass through to the worker.
    worker.postMessage(object);
  }

Any help on this please? I can still use logcat but debugger is more helpful

[saeedtabrizi]

@Blapi , Did you clean or reset the cache .
Just remove node_module folder and install again ?

[Blapi]

Yes I did, still not working..

[Blapi]

Using Chromium instead of Chrome did the trick, thanks for the answer @saeedtabrizi !

[sospedra]

Still happening in 0.50.3
Which basically makes it impossible to upgrade because we cannot work without Debugging mode

[Blapi]

@sospedra I was in the same situation as you, working without debugging was hard and I was using logcat for Android.. Then I tried to use Chromium instead of Chrome and my problem was solved, give it a try?

[sospedra]

@Blapi we move to 0.49.5 instead, ty anyway

[Daley]

reload the chrome tab/restart chrome is ok now

[itsmebins]

Dear all,

I fixed it by below steps

1. go to this file node_modules/react-native/local-cli/server/util/debugger-ui/index.html
   and find below code

worker.postMessage({
...object,
url: await getBlobUrl(object.url),
});

1. then replace with below code ...

worker.postMessage(
Object.assign({}, object, {
url: await getBlobUrl(object.url),
}
));

1. Enjoy remote-debugging :)

[jose920405]

This error is happening to me in

"react-native": "0.51.0",

react-native info

Environment:
  OS: macOS Sierra 10.12.6
  Node: 8.9.1
  Yarn: 0.24.6
  npm: 5.5.1
  Watchman: 4.7.0
  Xcode: Xcode 8.3.2 Build version 8E2002
  Android Studio: 2.3 AI-162.4069837

Packages: (wanted => installed)
  react: 16.0.0 => 16.0.0
  react-native: 0.51.0 => 0.51.0

[andfs]

any solution?

[rafaelgrilli92]

I had the latest version (0.53) and I downgraded to 0.51 (because with the 0.52 I got a different error) and the debug is working now.

_Edit: For whom the 0.51 isn't working as well, try the 0.50 or 0.49._

After the downgrade I ran:
$ react-native upgrade
$ react-native link

Building a React Native app is more about fixing issues than developing...

[andfs]

@rafaelgrilli92 "Building a React Native app is more about fixing issues than developing..." SAD, BUT TRUE

Android debugger isn't working for me. I´m with 0.53 and debugging only in ios

[afilp]

@andfs I have the same problem but I need to work on Android. Did you find any solution?

[ThaJay]

always a few broken versions before there is a good one again with this project.
The following versions have no remote debugging for me (timeout): 55, 54, 53
Ubuntu 17, Android.
react-native 0.52.3 works

[andfs]

What I'm doing is an ugly workaround. I start my debugger in ios simulator. Then I close it and start my android. And works!

[igorsantos07]

If you ever arrive here from a timeout from Genymotion emulator, check if the address in your tab is correct: here the emulator was generating a tab on 10.0.3.2, which is the internal IP for the Android VM; you should actually access the debugger UI at localhost:8081.

[vineeth-pradhan]

@andfs What I'm doing is an ugly workaround. I start my debugger in ios simulator. Then I close it and start my android. And works!

Strangely, that works. I think it's something to do with the boot-up in the AVD emulator versus the iOS simulator. Notice that the emulator launches with an actual debugger IP on the browser but the simulator does a "localhost:8081". I'm still unclear what exactly is happening around here but this is as far as I could investigate to get my boat sailing

[victorileaf]

@itsmebins
worked for 0.56.1..

I changed the code likewise and reload and connected to debugger .. connected.

PS: I also tried changing the code back to original .. but still was able connect/disconnect the debugger

[meetnick]

@victorileaf
How did you managed to fix it? Which code you've changed?

[victorileaf]

@niccolatorres Refer answer by @itsmebins commented on 21 Dec 2017

[JulienMalige]

@igorsantos07 is right. Just a tip:

Before enabling remote debugging on your emulator, open http://localhost:8081/debugger-ui in chrome. Then enable remote debugging and go back to the chrome page where you should see your console logs.

https://stackoverflow.com/questions/40898934/unable-to-connect-with-remote-debugger