wix / wix/react-native-ui-lib

Attempt to invoke virtual method 'void com.facebook.react.uimanager.UlManagerModule.onBatchComplete()' on a null object reference

Open
#3,594 15 comments 25 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

bug waiting-for-response
Dominant language
TypeScript
Stars
7.2k
Forks
748
Avg merge
2d 18h
Merged PRs (30d)
1

Description

Description

Android crashes due to NullPointerException in RuntimeUtils.java when using the keyboard input features. The issue stems from the React Native UI Lib package's dependency structure for Android, where patches need to be applied to both react-native-ui-lib AND uilib-native packages.

Related to
  • Components
  • Demo
  • Docs
  • Typings
Steps to reproduce
  1. Use react-native-ui-lib in a React Native application
  2. Implement components that use keyboard-related features
  3. Run on Android
  4. App crashes with NullPointerException in RuntimeUtils.java during keyboard interaction
  5. Apply patch to react-native-ui-lib but crashes continue
Expected behavior

The app should handle keyboard interactions properly without crashing.

Actual behavior

The app crashes with errors like:

Fatal Exception: java.lang.NullPointerException
Attempt to invoke virtual method 'void com.facebook.react.uimanager.UIManagerModule.onBatchComplete()' on a null object reference
       at com.wix.reactnativeuilib.keyboardinput.utils.RuntimeUtils$1.run(RuntimeUtils.java:13)

More Info

Root Cause Analysis

The root cause of this issue is a non-obvious relationship between react-native-ui-lib and uilib-native packages.

When building the Android app, the react-native-ui-lib package doesn't use its own native Android code. Instead, it points to the uilib-native package's Android code, as configured in react-native-ui-lib/react-native.config.js:

// node_modules/react-native-ui-lib/react-native.config.js
module.exports = {
  dependency: {
    platforms: {
      android: {
        sourceDir: "../uilib-native/android/",
        // Other config...
      },
    },
  },
};

This means that patching only react-native-ui-lib doesn't affect the Android build, since it's actually using code from uilib-native.

Code snippet
Original problematic code in uilib-native:
// node_modules/uilib-native/android/src/main/java/com/wix/reactnativeuilib/keyboardinput/utils/RuntimeUtils.java
package com.wix.reactnativeuilib.keyboardinput.utils;

import com.facebook.react.uimanager.UIManagerModule;
import com.wix.reactnativeuilib.keyboardinput.ReactContextHolder;

public class RuntimeUtils {
    private static final Runnable sUIUpdateClosure = new Runnable() {
        @Override
        public void run() {
            ReactContextHolder.getContext().getNativeModule(UIManagerModule.class).onBatchComplete();
        }
    };

    public static void runOnUIThread(Runnable runnable) {
        if (ReactContextHolder.getContext() != null) {
            ReactContextHolder.getContext().runOnUiQueueThread(runnable);
        }
    }

    public static void dispatchUIUpdates(final Runnable userRunnable) {
        runOnUIThread(new Runnable() {
            @Override
            public void run() {
                userRunnable.run();
                if (ReactContextHolder.getContext() != null) {
                    ReactContextHolder.getContext().runOnNativeModulesQueueThread(sUIUpdateClosure);
                }
            }
        });
    }
}
Fixed version with proper null checks:
package com.wix.reactnativeuilib.keyboardinput.utils;

import android.util.Log;
import com.facebook.react.bridge.ReactContext;
import com.facebook.react.uimanager.UIManagerModule;
import com.wix.reactnativeuilib.keyboardinput.ReactContextHolder;

public class RuntimeUtils {
    private static final Runnable sUIUpdateClosure = new Runnable() {
        @Override
        public void run() {
            try {
                ReactContext context = ReactContextHolder.getContext();
                if (context != null) {
                    UIManagerModule uiManager = context.getNativeModule(UIManagerModule.class);
                    if (uiManager != null) {
                        uiManager.onBatchComplete();
                    }
                }
            } catch (Exception e) {
                e.printStackTrace();
            }
        }
    };

    public static void runOnUIThread(Runnable runnable) {
        try {
            if (ReactContextHolder.getContext() != null) {
                ReactContextHolder.getContext().runOnUiQueueThread(runnable);
            }
        } catch (Exception e) {
            e.printStackTrace();
        }
    }

    public static void dispatchUIUpdates(final Runnable userRunnable) {
        if (ReactContextHolder.getContext() == null) {
            return; // Skip if context is null
        }

        try {
            runOnUIThread(new Runnable() {
                @Override
                public void run() {
                    try {
                        // Re-check context before running user code
                        if (ReactContextHolder.getContext() != null) {
                            userRunnable.run();

                            // Get a fresh context reference before queue operation
                            ReactContext context = ReactContextHolder.getContext();
                            if (context != null) {
                                context.runOnNativeModulesQueueThread(sUIUpdateClosure);
                            }
                        }
                    } catch (Exception e) {
                        e.printStackTrace();
                    }
                }
            });
        } catch (Exception e) {
            e.printStackTrace();
        }
    }
}
Solution

To fix this issue, you need to patch both packages using patch-package:

  1. First, patch react-native-ui-lib
  2. Then, patch uilib-native
  3. Apply both patches using patch-package in your postinstall script

Example patches are provided in the code snippets above.

Verification

To verify that patches are correctly applied:

  1. Check that both package source files contain your patches
  2. Add Log statements in the patched code (like Log.d("TAG", "message"))
  3. Monitor the Android logs during app execution to confirm the patched code is running
Screenshots/Video

N/A

Environment
  • React Native version: 0.76.x
  • React Native UI Lib version: 7.38.1
  • uilib-native version: 4.5.1 (indirectly used by react-native-ui-lib)
Affected platforms
  • Android
  • iOS
  • Web

Reference: https://github.com/facebook/react-native/issues/47662

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start by inspecting react-native-ui-lib/react-native.config.js and RuntimeUtils.java under uilib-native/android/src/main/java/com/wix/reactnativeuilib/keyboardinput/utils/. Reproduce the Android keyboard interaction with the listed React Native and package versions, then verify both package sources are updated and the crash no longer occurs when UIManagerModule is unavailable.

Written by the indexing model from the issue text.

Assessment

Tech stack
android, java, react-native
Domain
mobile
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Clearly specified
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.