[Android v0.65.1] Fresh install gives NativeUIManager.getConstantsForViewManager('Text') error while debugging

[betoharres]

Description

Trying to create a new project with the the latest stable version of both RN and RN CLI throws this error when Debug mode is enabled:

NativeUIManager.getConstantsForViewManager('Text') threw an exception. 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. 
App@http://10.0.2.2:8081/App.bundle?platform=android&app=com.testa&modulesOnly=true&dev=true&minify=false&runModule=true&shallow=true:18:54
RCTView
View
RCTView
View
AppContainer@http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.testa&modulesOnly=false&runModule=true:75604:36
RootComponentWithMeaningfulName@http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.testa&modulesOnly=false&runModule=true:82460:24

Even if you just render a single View component with a Text inside WITH styling, it will throw the error. IF you remove the style prop from the Text component then the error is gone.

React Native version:

16:08:49 ~/code/testa $ react-native info
info Fetching system and libraries information...
System:
    OS: Linux 5.10 Arch Linux
    CPU: (16) x64 Intel(R) Core(TM) i9-9900 CPU @ 3.10GHz
    Memory: 341.81 MB / 15.55 GB
    Shell: 5.8 - /usr/bin/zsh
  Binaries:
    Node: 16.7.0 - /usr/bin/node
    Yarn: 1.22.11 - /usr/bin/yarn
    npm: 7.20.6 - /usr/bin/npm
    Watchman: 4.9.0 - /home/linuxbrew/.linuxbrew/bin/watchman
  SDKs:
    Android SDK:
      API Levels: 16, 28, 29, 30
      Build Tools: 28.0.3, 29.0.2, 30.0.2, 30.0.3, 31.0.0
      System Images: android-28 | Google APIs Intel x86 Atom
      Android NDK: Not Found
  IDEs:
    Android Studio: 4.1 AI-201.8743.12.41.7199119
  Languages:
    Java: 1.8.0_292 - /usr/bin/javac
  npmPackages:
    @react-native-community/cli: Not Found
    react: 17.0.2 => 17.0.2
    react-native: 0.65.1 => 0.65.1
  npmGlobalPackages:
    *react-native*: Not Found
16:08:57 ~/code/testa $

Steps To Reproduce

1. run react-native init testa
2. start the app(run yarn start and yarn android
3. Enable debug mode

Expected Results

Not throw any error

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

import React from 'react';
import {Text, View} from 'react-native';

const App = () => {
  return (
    <View>
      <Text style={{backgroundColor: 'red'}}>Hello</Text>
    </View>
  );
};

export default App;

[betoharres]

Downgrading to 0.64 also fixes the issue

[kkkorez]

the same is happening to me after upgrading to 0.65.1

[27leaves]

Same error after upgrading to 0.65.1 (from 0.63.3)

[tnghia944]

same issue with rn v0.65.1

[Mi36]

Is there any solution other than downgrade?

[imranetalibi]

The same here with v0.65.1

[EHRdev]

Same Issue With RN 0.65.1 :(

[karasolga]

Same error after upgrading to 0.65.1 (from 0.64.2). Any updates on how to solve it?

[rafwell]

+1 RN 0.65.1

[condorman]

+1 RN 0.65.1

[logcas]

+1 RN 0.65.1

[roots-ai]

@mikehardy @fkgozali @nomi9995

[ali-sao]

"react-native": "0.65.1", +1

[rafwell]

Guys, can you try this work around. That's fixed the issue for me, but keep in mind, that's must be a 'temporary fix', who are here since march, release after release, unfortunately.

https://stackoverflow.com/questions/61067004/invariant-violation-calling-synchronous-methods-on-native-modules-is-not-suppor/66583605#66583605

[fkgozali]

We believe https://github.com/facebook/react-native/pull/31164 fixed this, and will be in the v0.66 release (it is already in v0.66.0-rc.4)

[numandev1]

Guys, can you try this work around. That's fixed the issue for me, but keep in mind, that's must be a 'temporary fix', who are here since march, release after release, unfortunately.

https://stackoverflow.com/questions/61067004/invariant-violation-calling-synchronous-methods-on-native-modules-is-not-suppor/66583605#66583605

yes, I did this work around and posted this workaround on StackOverflow and made a PR https://github.com/facebook/react-native/pull/31153 but as @TheSavior said This would unexpectedly alter the behavior of an app between dev and prod For remote debugging, we open up Chrome running the app in a web worker. this requires async communication, which will not work for Turbo Modules. I will workaround async communication in the turbo module which is not yet supported. if this will possible in the future then we can proper fix

[sezginriggs]

same issue with rn v0.65.1

[mikehardy]

@sezginriggs I believe it was fixed for react-native 0.66 (will likely release any day now, rc4 from last week appears to be final)

https://github.com/facebook/react-native/commit/49b3b31d8e706338dac4ced1b372424d7d1d133f

That's the commit that fixed it, it was in 0.66.0-rc.1 and should be released shortly.

[mikehardy]

@shinken008 +1 comments are useless in practice and just add notifications noise to people trying to solve root causes. Please do not post them. Use a reaction (thumbs-up) in the future, thank you

[majugurci]

Can confirm, with react-native@0.66.0 this isn't an issue anymore.

[nahidmbstu]

Found this on react-native@0.66.0

[mikehardy]

That's a very surprising result @nahidmbstu - triple-check everything's clean (npx react-native-clean-project) and the update was successful. I definitely reproduced before 0.66.0-rc.1, I definitely do not reproduce after 0.66.0-rc.1

[pierroo]

I can confirm I am also facing this issue on react native 0.66 unfortunately; has there been any progress on this since?

[mikehardy]

This issue was definitively closed, with no successful reproductions after 0.66.0-rc.1 You have either a new issue (at which point, a clean reproduction of it starting with template init would help) or there is something subtly wrong/cached in your build

[pierroo]

It is definitely an issue, however it seems to be related to react native reanimated v2 (https://docs.swmansion.com/react-native-reanimated/docs/#known-problems-and-limitations) So I understand this might not be the right place for it; although it might help some other people passing by.

[mikehardy]

That really sounds like a separate thing, this used to occur without reanimated. Same error may occur from multiple causes, the cause identified by this issue has been fixed

[1awaleed]

i am still seeing this issue on react native version 0.68.1 but this is not a clean install. @mikehardy Is there any way to know if the problem is from react-native itself or else where? I will also try a clean install

[mikehardy]

The way to know it's not from react-native is to try it on a clean install yes. This is the script I use for react-native release testing (and to qualify it for react-native-firebase to make sure I won't have support problems there) https://github.com/mikehardy/rnfbdemo/blob/main/make-demo.sh - it's the script I use along with the react-native-firebase e2e tests (which use javascript debugging interface) to say with certainty: it's fixed. I used to reproduce it. The PR was merged and released. I do not reproduce it. It's fixed.

[witalobenicio]

I'm on react-native 0.66.1 and I'm getting this error when trying to get size of topBar from react-native-navigation