react-native: NullPointerException when showing Android Modal

Description

We are getting a NullPointerException sometimes upon trying to show a modal (see “Reproduction” section for details).

Stack Trace:

java.lang.NullPointerException: Attempt to invoke virtual method 'void com.facebook.react.uimanager.ReactShadowNode.setStyleWidth(float)' on a null object reference
	at com.facebook.react.uimanager.UIImplementation.updateNodeSize(UIImplementation.java:151)
	at com.facebook.react.uimanager.UIManagerModule.updateNodeSize(UIManagerModule.java:213)
	at com.facebook.react.views.modal.ReactModalHostView$DialogRootViewGroup$1.run(ReactModalHostView.java:301)
	at android.os.Handler.handleCallback(Handler.java:739)
	at android.os.Handler.dispatchMessage(Handler.java:95)
	at com.facebook.react.bridge.queue.MessageQueueThreadHandler.dispatchMessage(MessageQueueThreadHandler.java:31)
	at android.os.Looper.loop(Looper.java:148)
	at com.facebook.react.bridge.queue.MessageQueueThreadImpl$3.run(MessageQueueThreadImpl.java:196)
	at java.lang.Thread.run(Thread.java:818)

It sounds like this commit may be related, and may have fixed a similar issue: https://github.com/facebook/react-native/commit/922cd6ddfc2414d274a53a5a6259ad50cb232782 From that commit message:

In some cases, the size of the content view changes before we add views to the Modal. That means that the size of that view will not be set through the onSizeChanged method. This can result in some apps apparently freezing, since the dialog is created, but there are no actual views in it.

The part about “dialog is created, but there are no actual views in it” makes me feel it’s related, because the NullPointerException happens here: https://github.com/facebook/react-native/blob/v0.36.0/ReactAndroid/src/main/java/com/facebook/react/views/modal/ReactModalHostView.java#L301-L302 So apparently getChildAt(0).getId() returns an ID that is unavailable by the time setStyleWidth is called.

Reproduction

Unfortunately, it’s a tough case to reproduce. Even in our app it only happens about half the time. We have one modal show first, and when the user clicks “OK” on that one, we show another “saving” modal, then when saving is complete we remove the modal. It seems in between the user clicking “OK” and the “saving” modal displaying, we get a crash (about half the time).

Additional Information

• React Native version: v0.36.0
• Platform: Android (tested on Nexus 5)
• Operating System: Android (Tried genymotion, but can only reproduce on a real device)