Calling synchronous methods on native modules is not supported in Chrome #26705

i7soft · 2019-10-03T11:14:25Z

Call the synchronized api, this appears:

React Native version:

React Native Environment Info:
System:
OS: macOS 10.14.6
CPU: (4) x64 Intel(R) Core(TM) i7-4578U CPU @ 3.00GHz
Memory: 19.07 MB / 16.00 GB
Shell: 5.3 - /bin/zsh
Binaries:
Node: 12.7.0 - /usr/local/bin/node
Yarn: 1.3.2 - /usr/local/bin/yarn
npm: 6.10.0 - /usr/local/bin/npm
SDKs:
iOS SDK:
Platforms: iOS 13.0, DriverKit 19.0, macOS 10.15, tvOS 13.0, watchOS 6.0
Android SDK:
API Levels: 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24, 25, 26, 27, 28, 29, 7, 8, 9
Build Tools: 22.0.1, 23.0.1, 28.0.0, 28.0.1, 28.0.2, 28.0.3, 29.0.0, 29.0.1, 29.0.2
System Images: android-28 | Google APIs Intel x86 Atom
IDEs:
Android Studio: 3.5 AI-191.8026.42.35.5791312
Xcode: 11.0/11A420a - /usr/bin/xcodebuild
npmPackages:
react: 16.8.3 => 16.8.3
react-native: 0.59.10 => 0.59.10
npmGlobalPackages:
react-native-cli: 2.0.1
react-native-create-library: 3.1.2

Steps To Reproduce

Describe what you expected to happen:

Snack, code example, screenshot, or link to a repository:

react-native-bot · 2019-10-03T11:15:40Z

It looks like you are using an older version of React Native. Please update to the latest release, v0.61 and verify if the issue still exists.

The "Resolution: Old Version" label will be removed automatically once you edit your original post with the results of running `react-native info` on a project using the latest release.

i7soft · 2019-10-03T11:56:04Z

@react-native-bot

I have updated to the latest version, but I still have this error.

info Fetching system and libraries information...
System:
    OS: macOS Mojave 10.14.6
    CPU: (4) x64 Intel(R) Core(TM) i7-4578U CPU @ 3.00GHz
    Memory: 30.93 MB / 16.00 GB
    Shell: 5.3 - /bin/zsh
  Binaries:
    Node: 12.7.0 - /usr/local/bin/node
    Yarn: 1.3.2 - /usr/local/bin/yarn
    npm: 6.10.0 - /usr/local/bin/npm
  SDKs:
    iOS SDK:
      Platforms: iOS 13.0, DriverKit 19.0, macOS 10.15, tvOS 13.0, watchOS 6.0
    Android SDK:
      API Levels: 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24, 25, 26, 27, 28, 29, 7, 8, 9
      Build Tools: 22.0.1, 23.0.1, 28.0.0, 28.0.1, 28.0.2, 28.0.3, 29.0.0, 29.0.1, 29.0.2
      System Images: android-28 | Google APIs Intel x86 Atom
      Android NDK: 20.0.5594570
  IDEs:
    Android Studio: 3.5 AI-191.8026.42.35.5791312
    Xcode: 11.0/11A420a - /usr/bin/xcodebuild
  npmPackages:
    react: 16.9.0 => 16.9.0 
    react-native: 0.61.2 => 0.61.2 
  npmGlobalPackages:
    react-native-cli: 2.0.1
    react-native-create-library: 3.1.2
    react-native-git-upgrade: 0.2.7

zhigang1992 · 2019-10-03T12:48:43Z

imho, it should this be in

react-native-device-info/react-native-device-info#776

i7soft · 2019-10-03T12:59:40Z

@zhigang1992 the error string is from:
/node_modules/react-native/Libraries/BatchedBridge/MessageQueue.js line 186:

if (__DEV__) {
      invariant(
        global.nativeCallSyncHook,
        'Calling synchronous methods on native ' +
          'modules is not supported in Chrome.\n\n Consider providing alternative ' +
          'methods to expose this method in debug mode, e.g. by exposing constants ' +
          'ahead-of-time.',
      );
    }

i7soft · 2019-10-03T13:11:02Z

It seems that the api with the sync mark has this error.
ios: RCT_EXPORT_BLOCKING_SYNCHRONOUS_METHOD
android: isBlockingSynchronousMethod=true

TheNoodleMoose · 2019-11-12T16:13:02Z

@i7soft Did you ever find a solution for this problem? Currently experiencing this right now, and not being able to use a debugger is rough.

update: Our problem ended up being related to a rollbar version upgrade, rollbar/rollbar-react-native#101

i7soft · 2019-11-13T13:04:38Z

@TheNoodleMoose no💔,i am waitting a solution

TheNoodleMoose · 2019-11-13T14:12:55Z

@i7soft Was react native the only thing you have updated? Ours was working after our React Native upgrade to the latest version, what broke it was a different package being upgraded. We used git bisect to find the culprit.

i7soft · 2019-11-14T12:35:57Z

@TheNoodleMoose i try this:

react-native init demo👈 the lastest version
2.add package "react-native-device-info" to the demo
3.add code to App.js:

import DeviceInfo from 'react-native-device-info';
console.log(DeviceInfo.isCameraPresentSync());👈 call a sync function

4.open debug mode
5.restart app,then show:

Invariant Violation: Calling synchronous methods on native modules is not supported in Chrome.

 Consider providing alternative methods to expose this method in debug mode, e.g. by exposing constants ahead-of-time.

TheNoodleMoose · 2019-11-14T18:58:50Z

@i7soft So since it seems to be the react-native-device-info package, I think they figured out the solution was to have a check for whether you: 1. Have a debugger or 2. Are in development mode. If either of those is present, then just mock the sync value. It's a shame but there was good reasoning behind it. Here is link discussing the solution: react-native-device-info/react-native-device-info#776 (comment)

i7soft · 2019-11-15T01:04:56Z

@TheNoodleMoose I use react-native-device-info just for example. In fact, I need to develop synchronous native features. I found that when debugging, I can't use the synchronous method. I don't know if it's my problem, or react native will improve this in the future.

cjddny · 2019-12-04T02:57:11Z

I also meet this problem, i can not find any method to debug when i use synchronous method

KarlHerler · 2020-03-30T09:14:56Z

Ran into this problem when upgrading to react native 0.62.0. Still present.

We are using react-native-device-info version 5.5.3. However it seems the issue was caused by the new Appearance.getColorScheme() code. I removed my calls to it and its working fine now.

nechmads · 2020-04-01T21:44:31Z

Same here. Removing calls to Appearance in version 0.62 solved it.
I reverted back to using expo/react-native-appearance package

Johan-dutoit · 2020-04-06T08:10:10Z

Can confirm that this happens with the Appearance API on the latest version (0.62)

kelset · 2020-04-06T08:49:17Z

hey folks, thanks for surfacing this issue - we are putting it in front of the team that worked on it so that they can help us understand how to get this fixed.

Summary: The appearance module uses sync native module methods which doesn't work with the chrome debugger. This broke in 0.62: #26705 This fix makes the appearance module return 'light' when using the chrome debugger. Changelog: [Fixed] Appearance `getColorScheme` no longer breaks the debugger Reviewed By: yungsters Differential Revision: D20879779 fbshipit-source-id: ad49c66226096433bc9f270e004ad4a6f54fa8c2

stale · 2020-09-20T03:48:06Z

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 a "Discussion" or add it to the "Backlog" and I will leave it open. Thank you for your contributions.

stale · 2020-10-04T03:35:36Z

Closing this issue after a prolonged period of inactivity. If this issue is still present in the latest release, please feel free to create a new issue with up-to-date information.

kaushikwavhal · 2021-01-04T14:04:22Z

Still facing this on v0.63.3, although temporarily commenting out all the sync methods works.

luskin · 2021-01-12T19:21:01Z

We are experiencing the same issue on 0.63.3

numandev1 · 2021-03-11T13:36:05Z

you can use this temporary solution https://stackoverflow.com/a/66583605/8079868

madroneropaulo · 2021-04-23T16:03:22Z

same here

stdavis · 2021-04-23T16:04:29Z

@kelset Did anything ever come from the team taking a look at this? I'm having the same issue attempting to debug with React Native Debugger.

numandev1 · 2021-04-23T16:08:50Z

@madroneropaulo @stdavis i made PR #31153 . but they closed PR by saying this is a feature. you have to patch react native like this https://stackoverflow.com/a/66583605/8079868

stdavis · 2021-04-23T16:23:43Z

@nomi9995 That patch from SO led to other errors for me.

madroneropaulo · 2021-04-23T21:54:25Z

@nomi9995 @stdavis I opened a new Issue, since I think the new one is related to the AuthRequest and not this one. expo/expo#12712

29er · 2021-06-16T23:43:22Z

why is this closed when it still occurs ?

numandev1 · 2021-06-17T05:22:04Z

@29er they will not handle this on chrome. you can see #31153. if you wanna run this on chrome then you can use patch https://stackoverflow.com/a/66583605/8079868

deepakaggarwal7 · 2021-09-11T11:11:40Z

I'm getting this warning in the default ReactNative demo on running the application in debug mode (No dependencies added).

},
 "dependencies": {
   "react": "17.0.2",
   "react-native": "0.65.1"
 },
 "devDependencies": {
   "@babel/core": "7.15.5",
   "@babel/runtime": "7.15.4",
   "@react-native-community/eslint-config": "2.0.0",
   "babel-jest": "26.6.3",
   "eslint": "7.14.0",
   "jest": "26.6.3",
   "metro-react-native-babel-preset": "0.66.0",
   "react-native-codegen": "^0.0.7",
   "react-test-renderer": "17.0.2"
 },

What's the fix? I don't want to edit the MessageQueue.js to suppress this.

Downgrading to 0.64 doesn't cause this issue.

betoharres · 2021-09-13T19:02:45Z

@deepakaggarwal7 I have the same exact issue; I tried multiple solutions but no luck.

betoharres · 2021-09-13T19:18:04Z

@deepakaggarwal7 just created a new issue related to this with detailed info, feel free to comment there if you need

zzeerak · 2021-09-14T11:21:10Z

+1, facing the same. Would be great if someone can help. Unable to debug the app on iOS and android.

alex-noel · 2021-09-16T11:07:17Z

experiencing exact same issue. It only happened after transition to react-native 0.65.1
worked totally fine before that.
Tried to apply different solutions, but they all lead to some other issues.

meshackjr · 2021-09-16T13:11:23Z

experiencing exact same issue. It only happened after transition to react-native 0.65.1
worked totally fine before that.
Tried to apply different solutions, but they all lead to some other issues.

1+ facing the same issue after just upgrading to 0.65.1

3KINGZ · 2021-09-19T05:32:15Z

same issue on 0.65.1

EHRdev · 2021-09-21T22:41:35Z

Same issue on 0.65.1 please help us

bhaktitud · 2021-09-22T06:30:26Z

I'm facing the same issue, it happens when debug mode is active, please help!

`NativeUIManager.getConstantsForViewManager('Text') threw an exception. Invariant Violation: Calling synchronous methods on native modules is not supported in Chrome.

betoharres · 2021-09-22T07:00:37Z

guys, please refer to this open issue:
#32197

it's better to report this on an open issue

i7soft added the Bug label Oct 3, 2019

react-native-bot added the Resolution: Old Version label Oct 3, 2019

hramos added Newer Patch Available and removed Resolution: Old Version labels Jan 18, 2020

alloy mentioned this issue Apr 6, 2020

v0.62.1 Discussion react-native-community/releases#184

Closed

1 task

hramos added DX Issues concerning how the developer experience can be improved. Debugging and removed Bug Newer Patch Available labels Apr 6, 2020

hramos mentioned this issue Apr 7, 2020

Document getColorScheme behavior while sync debugging facebook/react-native-website#1823

Merged

ctavan mentioned this issue Apr 9, 2020

React Native: crypto.getRandomValues() is not available when debugging with Chrome uuidjs/uuid#416

Closed

DomiR mentioned this issue Apr 20, 2020

fix(Android): uuid generation issue react-native-webview/react-native-webview#1334

Merged

4 tasks

tero-paananen mentioned this issue Aug 20, 2020

Windows vNext react-native-device-info/react-native-device-info#1059

Merged

djorkaeffalexandre mentioned this issue Sep 10, 2020

"Uh-oh" error occurs when enabling "debug mode"— database works! Nozbe/WatermelonDB#813

Closed

stale bot added the Stale There has been a lack of activity on this issue and it may be closed soon. label Sep 20, 2020

stale bot closed this as completed Oct 4, 2020

numandev1 mentioned this issue Mar 13, 2021

fix: Calling synchronous methods on native modules is not supported in Chrome #31153

Closed

stdavis mentioned this issue Apr 23, 2021

Use sync random method for auth-session expo/expo#10298

Merged

urugator mentioned this issue Sep 1, 2021

react native and mobx 6.x with TypeScript and Babel recommend options cause network request without any response mobxjs/mobx#3100

Closed

facebook locked as resolved and limited conversation to collaborators Oct 4, 2021

Calling synchronous methods on native modules is not supported in Chrome #26705

Calling synchronous methods on native modules is not supported in Chrome #26705

Comments

i7soft commented Oct 3, 2019

Steps To Reproduce

react-native-bot commented Oct 3, 2019

i7soft commented Oct 3, 2019

zhigang1992 commented Oct 3, 2019

i7soft commented Oct 3, 2019

i7soft commented Oct 3, 2019

TheNoodleMoose commented Nov 12, 2019 • edited Loading

i7soft commented Nov 13, 2019

TheNoodleMoose commented Nov 13, 2019

i7soft commented Nov 14, 2019

TheNoodleMoose commented Nov 14, 2019

i7soft commented Nov 15, 2019

cjddny commented Dec 4, 2019

KarlHerler commented Mar 30, 2020 • edited Loading

nechmads commented Apr 1, 2020

Johan-dutoit commented Apr 6, 2020

kelset commented Apr 6, 2020

stale bot commented Sep 20, 2020

stale bot commented Oct 4, 2020

kaushikwavhal commented Jan 4, 2021 • edited Loading

luskin commented Jan 12, 2021

numandev1 commented Mar 11, 2021

madroneropaulo commented Apr 23, 2021

stdavis commented Apr 23, 2021

numandev1 commented Apr 23, 2021

stdavis commented Apr 23, 2021

madroneropaulo commented Apr 23, 2021

29er commented Jun 16, 2021

numandev1 commented Jun 17, 2021

deepakaggarwal7 commented Sep 11, 2021 • edited Loading

betoharres commented Sep 13, 2021

betoharres commented Sep 13, 2021

zzeerak commented Sep 14, 2021

alex-noel commented Sep 16, 2021

meshackjr commented Sep 16, 2021

3KINGZ commented Sep 19, 2021

EHRdev commented Sep 21, 2021

bhaktitud commented Sep 22, 2021

betoharres commented Sep 22, 2021

TheNoodleMoose commented Nov 12, 2019 •

edited

Loading

KarlHerler commented Mar 30, 2020 •

edited

Loading

kaushikwavhal commented Jan 4, 2021 •

edited

Loading

deepakaggarwal7 commented Sep 11, 2021 •

edited

Loading