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.