react-native icon indicating copy to clipboard operation
react-native copied to clipboard

Top level bundle errors are not displayed

Open rickhanlonii opened this issue 2 years ago • 2 comments

Description

Overview

If there's an error when evaluating a module, the app crashes and the stack trace is not reported in the console:

Screen Shot 2022-09-08 at 10 01 17 AM

Expectation is that the app shows a LogBox with a code frame to the source of the issue, or at least a redbox with the error message and stack trace, and the console includes the stack trace so you can find the source of the problem.

Version

0.70

Output of npx react-native info

❯ npx react-native info info Fetching system and libraries information... System: OS: macOS 12.5 CPU: (10) arm64 Apple M1 Max Memory: 3.51 GB / 64.00 GB Shell: 5.8.1 - /bin/zsh Binaries: Node: 18.7.0 - ~/.nvm/versions/node/v18.7.0/bin/node Yarn: 1.22.19 - ~/.nvm/versions/node/v18.7.0/bin/yarn npm: 8.15.0 - ~/.nvm/versions/node/v18.7.0/bin/npm Watchman: 20220829 - /usr/local/bin/watchman Managers: CocoaPods: 1.11.3 - /usr/local/bin/pod SDKs: iOS SDK: Platforms: DriverKit 21.4, iOS 15.5, macOS 12.3, tvOS 15.4, watchOS 8.5 Android SDK: Not Found IDEs: Android Studio: 2021.2 AI-212.5712.43.2112.8815526 Xcode: 13.4/13F17a - /usr/bin/xcodebuild Languages: Java: 11.0.16.1 - /usr/bin/javac npmPackages: @react-native-community/cli: Not Found react: 18.0.0 => 18.0.0 react-native: 0.69.5 => 0.69.5 react-native-macos: Not Found npmGlobalPackages: *react-native*: Not Found

Steps to reproduce

  • Clone a new app
  • Render any component with propTypes:
import {ViewPropTypes} from 'react-native';

const MyView = () => {
  return <Text>Hello World</Text>;
};

MyView.propTypes = ViewPropTypes;

//...

// In the App.js componet:
<MyView>

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

Above

rickhanlonii avatar Sep 09 '22 15:09 rickhanlonii

I believe this is fixable with a tweak to react-native's InitializeCore module. There are side-effects in AppRegistry that never run if an error gets thrown very early in user code (at least the way the basic React Native template app is set up), thus preventing React Native from rendering LogBox for the error.

Specifically, by adding the line require('../ReactNative/AppRegistry'); here I was able to get an early error to consistently render a LogBox (with a valid secondary error saying that the app's root component wasn't registered).

image

image

motiz88 avatar Sep 09 '22 17:09 motiz88

This issue is stale because it has been open 180 days with no activity. Remove stale label or comment or this will be closed in 7 days.

github-actions[bot] avatar Mar 08 '23 18:03 github-actions[bot]

This issue was closed because it has been stalled for 7 days with no activity.

github-actions[bot] avatar Mar 16 '23 00:03 github-actions[bot]