Showing blank white screen on android emulator with no error in metro after upgrading from 0.67.1 to 0.73.6

[DeepakCodeWaves]

Environment

System: OS: Windows 10 10.0.19045 CPU: (6) x64 Intel(R) Core(TM) i5-8400 CPU @ 2.80GHz Memory: 2.53 GB / 15.66 GB Binaries: Node: version: 20.11.1 path: C:\Program Files\nodejs\node.EXE Yarn: version: 1.22.19 path: ~\AppData\Roaming\npm\yarn.CMD npm: version: 10.2.4 path: C:\Program Files\nodejs\npm.CMD Watchman: Not Found SDKs: Android SDK: API Levels:

• "23"
• "30"
• "31"
• "33"
• "34" Build Tools:
• 28.0.1
• 30.0.2
• 30.0.3
• 31.0.0
• 33.0.0
• 33.0.1
• 34.0.0 System Images:
• android-30 | Google APIs Intel x86 Atom
• android-33 | Google Play Intel x86_64 Atom
• android-34 | Google APIs Intel x86_64 Atom
• android-34 | Google Play Intel x86_64 Atom Android NDK: Not Found Windows SDK: Not Found IDEs: Android Studio: AI-232.10300.40.2321.11567975 Visual Studio:
  • 17.8.34330.188 (Visual Studio Community 2022) Languages: Java: 17.0.10 Ruby: Not Found npmPackages: "@react-native-community/cli": Not Found react: installed: 18.2.0 wanted: 18.2.0 react-native: installed: 0.73.6 wanted: 0.73.6 react-native-windows: Not Found npmGlobalPackages: "react-native": Not Found Android: hermesEnabled: true newArchEnabled: false iOS: hermesEnabled: Not found newArchEnabled: Not found

Things I’ve done to figure out my issue

• [ ] I used upgrade-helper to do my upgrade. I created a new app with
• [ ] the latest version which is 0.73.6 , then installed all the packages in there latest version which is in earlier 0.67.1 version app from older version , then run the app which was running fine , then I pasted the dependency object from new app to older app and deleted the node modules and package.lock and reinstall all the packages in there new version , then I make changes in the android folder of the new app from the old app , copy pasted the dependencies code . After which I run the app , it is running successfully but not showing anything on emulator , all white blank screen , no error in metro , shared screenshots as well. This is package.json of the now

{ "name": "myapp", "version": "0.0.1", "private": true, "scripts": { "android": "react-native run-android", "ios": "react-native run-ios", "start": "react-native start", "test": "jest", "lint": "eslint . --ext .js,.jsx,.ts,.tsx" }, "dependencies": { "@mapbox/geo-viewport": "^0.5.0", "@microsoft/signalr": "^8.0.0", "@react-native-async-storage/async-storage": "^1.23.1", "@react-native-community/push-notification-ios": "^1.11.0", "@react-native-firebase/app": "^19.1.0", "@react-native-firebase/messaging": "^19.1.1", "@react-native-masked-view/masked-view": "^0.3.1", "@react-navigation/bottom-tabs": "^6.5.20", "@react-navigation/native": "^6.1.17", "@react-navigation/stack": "^6.3.29", "@types/react-native-push-notification": "^8.1.4", "fetch-intercept": "^2.4.0", "metro-react-native-babel-preset": "^0.77.0", "react": "18.2.0", "react-devtools": "^5.0.2", "react-native": "0.73.6", "react-native-biometrics": "^3.0.1", "react-native-country-codes-picker": "^2.3.5", "react-native-country-picker-modal": "^2.0.0", "react-native-device-info": "^10.13.1", "react-native-eject": "^0.2.0", "react-native-geolocation-service": "^5.3.1", "react-native-gesture-handler": "^2.15.0", "react-native-get-location": "^4.0.1", "react-native-global-props": "^1.1.5", "react-native-i18n": "^2.0.15", "react-native-interactable": "^2.0.1", "react-native-keyguard": "^0.1.4", "react-native-linear-gradient": "^2.8.3", "react-native-map-clustering": "^3.4.2", "react-native-maps": "^1.11.3", "react-native-notifications": "^5.1.0", "react-native-push-notification": "^8.1.1", "react-native-reanimated": "^3.8.1", "react-native-safe-area-context": "^4.9.0", "react-native-screens": "^3.30.1", "react-native-select-dropdown": "^4.0.0", "react-native-status-bar-height": "^2.6.0", "react-native-system-setting": "^1.7.6", "react-native-touch-id": "^4.4.1", "react-native-vector-icons": "^10.0.3", "react-native-webview": "^13.8.2" }, "devDependencies": { "@babel/core": "^7.20.0", "@babel/preset-env": "^7.20.0", "@babel/runtime": "^7.20.0", "@react-native/babel-preset": "0.73.21", "@react-native/eslint-config": "0.73.2", "@react-native/metro-config": "0.73.5", "@react-native/typescript-config": "0.73.1", "@types/react": "^18.2.6", "@types/react-test-renderer": "^18.0.0", "babel-jest": "^29.6.3", "eslint": "^8.19.0", "jest": "^29.6.3", "prettier": "2.8.8", "react-test-renderer": "18.2.0", "typescript": "5.0.4" }, "engines": { "node": ">=18" } }

Upgrading version

Upgraded from 0.67.1 to 0.73.6

Description

Reproducible demo

[gkasireddy202]

I am facing this issue on iOS.I upgraded the react-native from 0.68.7 to 0.73.2

[karol-circlek]

npmGlobalPackages: "react-native": Not Found why not found ? Im asking because right now I have 1400 errors related to missing react-native package on my monorepo project. Im updating RN from 0.71.11 to 0.73.6

[melnikovkolya]

Hi,

I get the same issue, in a 'different' flavour.

If I click once to navigate to the next screen - I get a blank screen, and I can go back by swiping right at the left edge of the screen.

If I click twice quickly, the next screen appears, but looks as if dim/faded. If on that screen I swipe back once, the normal (expected) look of the screen aapears.

In addition, the initial screen looks dim/faded always.