attempt to invoke interface method 'java.lang.string com.facebook.react.bridge.catalystinstance.getSourceURL()' on null object reference

Question

I am new in react and react-native. I follow a tutorial from this link klik here

but there are problem for views and I wanna debug it. the problem is app force close and return some view error and force close again. The error is :

attempt to invoke interface method 'java.lang.string com.facebook.react.bridge.catalystinstance.getSourceURL()' on null object reference .........

package.json:

{
  "name": "FoodDeliveryLite",
  "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 ."
  },
  "dependencies": {
    "@ptomasroos/react-native-multi-slider": "^2.2.2",
    "@react-native-community/masked-view": "^0.1.11",
    "@react-navigation/drawer": "^5.12.9",
    "@react-navigation/native": "^5.9.8",
    "@react-navigation/stack": "^5.14.9",
    "native-base": "^3.2.1",
    "react": "17.0.1",
    "react-devtools": "^4.20.2",
    "react-native": "0.64.2",
    "react-native-gesture-handler": "^1.10.3",
    "react-native-linear-gradient": "^2.5.6",
    "react-native-reanimated": "^2.2.3",
    "react-native-safe-area-context": "^3.3.2",
    "react-native-screens": "^3.8.0",
    "react-redux": "^7.2.6",
    "redux": "^4.1.1",
    "redux-thunk": "^2.4.0"
  },
  "devDependencies": {
    "@babel/core": "^7.12.9",
    "@babel/runtime": "^7.12.5",
    "@react-native-community/eslint-config": "^2.0.0",
    "babel-jest": "^26.6.3",
    "eslint": "7.14.0",
    "jest": "^26.6.3",
    "metro-react-native-babel-preset": "^0.64.0",
    "react-test-renderer": "17.0.1"
  },
  "jest": {
    "preset": "react-native"
  }
}

Using emulator

Name: Pixel_3a_API_30
CPU/ABI: Google Play Intel Atom (x86)
Path: C:\Users\person\.android\avd\Pixel_3a_API_30.avd
Target: google_apis_playstore [Google Play] (API level 30)
Skin: pixel_3a
SD Card: 512M
fastboot.chosenSnapshotFile: 
runtime.network.speed: full
hw.accelerometer: yes
hw.device.name: pixel_3a
hw.lcd.width: 1080
hw.initialOrientation: Portrait
image.androidVersion.api: 30
tag.id: google_apis_playstore
hw.mainKeys: no
hw.camera.front: emulated
avd.ini.displayname: Pixel 3a API 30
hw.gpu.mode: auto
hw.ramSize: 1536
PlayStore.enabled: true
fastboot.forceColdBoot: no
hw.cpu.ncore: 4
hw.keyboard: yes
hw.sensors.proximity: yes
hw.dPad: no
hw.lcd.height: 2220
vm.heapSize: 256
skin.dynamic: yes
hw.device.manufacturer: Google
hw.gps: yes
hw.audioInput: yes
image.sysdir.1: system-images\android-30\google_apis_playstore\x86\
showDeviceFrame: yes
hw.camera.back: virtualscene
AvdId: Pixel_3a_API_30
hw.lcd.density: 440
hw.arc: false
hw.device.hash2: MD5:0e6953ebf01bdc6b33a2f54746629c50
fastboot.forceChosenSnapshotBoot: no
fastboot.forceFastBoot: yes
hw.trackBall: no
hw.battery: yes
hw.sdCard: yes
tag.display: Google Play
runtime.network.latency: none
disk.dataPartition.size: 6442450944
hw.sensors.orientation: yes
avd.ini.encoding: UTF-8
hw.gpu.enabled: yes

The relevant file to debug js remotely: AndroidManifest.xml

<manifest xmlns:android="http://schemas.android.com/apk/res/android"
  package="com.fooddeliverylite">

    <uses-permission android:name="android.permission.INTERNET" />

    <application
      android:name=".MainApplication"
      android:label="@string/app_name"
      android:icon="@mipmap/ic_launcher"
      android:roundIcon="@mipmap/ic_launcher_round"
      android:allowBackup="false"
      android:theme="@style/AppTheme"
      android:usesCleartextTraffic="true">
      <activity
        android:name=".MainActivity"
        android:label="@string/app_name"
        android:configChanges="keyboard|keyboardHidden|orientation|screenSize|uiMode"
        android:launchMode="singleTask"
        android:windowSoftInputMode="adjustResize">
        <intent-filter>
            <action android:name="android.intent.action.MAIN" />
            <category android:name="android.intent.category.LAUNCHER" />
        </intent-filter>
      </activity>
    </application>
</manifest>

Environment:

• windows OS home

And I have done doing like

1. ctrl + M -> choose change bundle location -> input localhost:8081 or {ip_local}:8081
2. using tools react-native-debugger

but still force close apps

How do I resolve this ???

Thanks

Answer 1

It seems that you are using react-native-reanimated in your project and it is mentioned in their documentation that remote debugging is no longer possible for react-native-reanimated.

Refer : React Native Reanimated Known problems and limitations

You can use Flipper for debugging your JS code : Debugging React Native apps with Flipper