upgrade-support
upgrade-support copied to clipboard
Unable to see the network inspector in the React-native debugger tool
Environment
System: OS: macOS 15.3 CPU: (12) x64 Intel(R) Core(TM) i7-8750H CPU @ 2.20GHz Memory: 35.26 MB / 16.00 GB Shell: version: "5.9" path: /bin/zsh Binaries: Node: version: 21.7.3 path: /usr/local/bin/node Yarn: Not Found npm: version: 10.5.0 path: /usr/local/bin/npm Watchman: version: 2023.03.13.00 path: /usr/local/bin/watchman Managers: CocoaPods: version: 1.14.3 path: /Users/gopi/.rvm/gems/ruby-2.7.6/bin/pod SDKs: iOS SDK: Platforms: - DriverKit 24.2 - iOS 18.2 - macOS 15.2 - tvOS 18.2 - visionOS 2.2 - watchOS 11.2 Android SDK: API Levels: - "23" - "27" - "32" - "33" - "34" - "35" Build Tools: - 29.0.2 - 30.0.3 - 33.0.1 - 34.0.0 - 35.0.0 System Images: - android-32 | Google APIs Intel x86 Atom_64 - android-32 | Google Play Intel x86 Atom_64 - android-33 | Google APIs Intel x86 Atom_64 - android-33 | Google Play Intel x86 Atom_64 Android NDK: Not Found IDEs: Android Studio: 2024.2 AI-242.23726.103.2422.13103373 Xcode: version: 16.2/16C5032a path: /usr/bin/xcodebuild Languages: Java: version: 18.0.2.1 path: /Library/Java/JavaVirtualMachines/jdk-18.0.2.1.jdk/Contents/Home/bin/javac Ruby: version: 2.7.6 path: /Users/gopi/.rvm/rubies/ruby-2.7.6/bin/ruby npmPackages: "@react-native-community/cli": installed: 15.0.1 wanted: 15.0.1 react: installed: 19.0.0 wanted: 19.0.0 react-native: installed: 0.78.0 wanted: 0.78.0 react-native-macos: Not Found npmGlobalPackages: "react-native": Not Found Android: hermesEnabled: Not found newArchEnabled: Not found iOS: hermesEnabled: Not found newArchEnabled: false
Things I’ve done to figure out my issue
- [x] I used upgrade-helper to do my upgrade.
I recently upgraded my project from 0.73.11 to 0.78.0. I ran my app in debug mode in the iOS simulator(18.2). I see the metro bundle ran in my system. I pressed the j keyword to open the developer tools. The React-Native dev tools window is opened in my system but I cannot see the network inspector in the dev tool window. I used the flipper to debug and network inspector for my app in react-native:0.73.11
Upgrading version
0.78.0
Description
Reproducible demo
react-native run-ios --simulator "iPhone 16 Pro"
There is currently no way to inspect network traffic from RN with the new architecture. The Expo DevTools can do the work, however if you're ejected from Expo then the best you can do is copy and paste the code below into your App.tsx file before the component function declaration
const originalFetch = global.fetch;
global.fetch = async (...args) => {
console.log('Fetching:', args);
return originalFetch(...args);
};
if (global.HermesInternal?.enablePromiseRejectionTracker) {
HermesInternal.enablePromiseRejectionTracker();
}
This will console.log the outgoing network requests, it's abysmal to say the least but it beats nothing.