From 98789e9da646e889632aaf14af4f39841c79ea10 Mon Sep 17 00:00:00 2001
From: jcdhlzq <jcdhlzq@163.com>
Date: Tue, 23 May 2023 04:45:59 -0700
Subject: [PATCH] fix: TextInput npe in #29452 on react native side (#37302)

Summary:
Fix the TextInput npe in https://github.com/facebook/react-native/issues/29452 on react native side because if it is just avoided on App side by  changing themes may cause side effects.

## Changelog:

- [ANDROID] [FIXED] - Fix TextInput NPE.

<!-- Help reviewers and the release process by writing your own changelog entry.

Pick one each for the category and type tags:

[ANDROID|GENERAL|IOS|INTERNAL] [BREAKING|ADDED|CHANGED|DEPRECATED|REMOVED|FIXED|SECURITY] - Message

For more details, see:
https://reactnative.dev/contributing/changelogs-in-pull-requests

Pull Request resolved: https://github.com/facebook/react-native/pull/37302

Test Plan:
Thanks to Fabriziobertoglio1987's wok, the problem in https://github.com/facebook/react-native/issues/29452 can be tested easily. This fixing works fine and causes no side effects.

The following video shows the test result. And the number 101 has been changed to 1001  in RNTester/TextInputKeyProp.js when testing.

https://user-images.githubusercontent.com/23273745/236796702-e61a6fa9-9935-4179-9c5f-e9370d543657.mp4

Reviewed By: javache

Differential Revision: D45688987

Pulled By: cipolleschi

fbshipit-source-id: 4e13c19c10ed53cfcead79e66ab2e232369317e0
---
 .../textinput/ReactTextInputShadowNode.java   | 11 +++++-
 .../src/main/res/shell/values/styles.xml      |  4 +++
 .../res/drawable/rn_edit_text_material.xml    | 36 -------------------
 .../app/src/main/res/values/styles.xml        |  1 -
 4 files changed, 14 insertions(+), 38 deletions(-)
 delete mode 100644 packages/rn-tester/android/app/src/main/res/drawable/rn_edit_text_material.xml

diff --git a/packages/react-native/ReactAndroid/src/main/java/com/facebook/react/views/textinput/ReactTextInputShadowNode.java b/packages/react-native/ReactAndroid/src/main/java/com/facebook/react/views/textinput/ReactTextInputShadowNode.java
index d53a7f9083aa60..75af518634c810 100644
--- a/packages/react-native/ReactAndroid/src/main/java/com/facebook/react/views/textinput/ReactTextInputShadowNode.java
+++ b/packages/react-native/ReactAndroid/src/main/java/com/facebook/react/views/textinput/ReactTextInputShadowNode.java
@@ -14,9 +14,11 @@
 import android.view.ViewGroup;
 import android.widget.EditText;
 import androidx.annotation.Nullable;
+import androidx.appcompat.view.ContextThemeWrapper;
 import androidx.core.view.ViewCompat;
 import com.facebook.common.logging.FLog;
 import com.facebook.infer.annotation.Assertions;
+import com.facebook.react.R;
 import com.facebook.react.bridge.ReadableMap;
 import com.facebook.react.common.ReactConstants;
 import com.facebook.react.common.annotations.VisibleForTesting;
@@ -263,6 +265,13 @@ public void setPadding(int spacingType, float padding) {
    * {@code EditText} this class uses to determine the expected size of the view.
    */
   protected EditText createInternalEditText() {
-    return new EditText(getThemedContext());
+    // By setting a style which has a background drawable, this EditText will have a different
+    // background drawable instance from that on the UI Thread, which maybe has a default background
+    // drawable instance.
+    // Otherwise, DrawableContainer is not a thread safe class, and it caused the npe in #29452.
+    ContextThemeWrapper context =
+        new ContextThemeWrapper(
+            getThemedContext(), R.style.Theme_ReactNative_TextInput_DefaultBackground);
+    return new EditText(context);
   }
 }
diff --git a/packages/react-native/ReactAndroid/src/main/res/shell/values/styles.xml b/packages/react-native/ReactAndroid/src/main/res/shell/values/styles.xml
index 1db9ac70f79a24..18deec8985939a 100644
--- a/packages/react-native/ReactAndroid/src/main/res/shell/values/styles.xml
+++ b/packages/react-native/ReactAndroid/src/main/res/shell/values/styles.xml
@@ -28,4 +28,8 @@
         <item name="android:datePickerMode">calendar</item>
     </style>
 
+    <style name="Theme.ReactNative.TextInput.DefaultBackground" parent="android:Widget.EditText">
+      <item name="android:editTextBackground">@drawable/abc_edit_text_material</item>
+    </style>
+
 </resources>
diff --git a/packages/rn-tester/android/app/src/main/res/drawable/rn_edit_text_material.xml b/packages/rn-tester/android/app/src/main/res/drawable/rn_edit_text_material.xml
deleted file mode 100644
index 73b37e4d9963e2..00000000000000
--- a/packages/rn-tester/android/app/src/main/res/drawable/rn_edit_text_material.xml
+++ /dev/null
@@ -1,36 +0,0 @@
-<?xml version="1.0" encoding="utf-8"?>
-<!-- Copyright (C) 2014 The Android Open Source Project
-
-     Licensed under the Apache License, Version 2.0 (the "License");
-     you may not use this file except in compliance with the License.
-     You may obtain a copy of the License at
-
-          http://www.apache.org/licenses/LICENSE-2.0
-
-     Unless required by applicable law or agreed to in writing, software
-     distributed under the License is distributed on an "AS IS" BASIS,
-     WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-     See the License for the specific language governing permissions and
-     limitations under the License.
--->
-<inset xmlns:android="http://schemas.android.com/apk/res/android"
-       android:insetLeft="@dimen/abc_edit_text_inset_horizontal_material"
-       android:insetRight="@dimen/abc_edit_text_inset_horizontal_material"
-       android:insetTop="@dimen/abc_edit_text_inset_top_material"
-       android:insetBottom="@dimen/abc_edit_text_inset_bottom_material">
-
-    <selector>
-        <!--
-          This file is a copy of abc_edit_text_material (https://bit.ly/3k8fX7I).
-          The item below with state_pressed="false" and state_focused="false" causes a NullPointerException.
-          NullPointerException:tempt to invoke virtual method 'android.graphics.drawable.Drawable android.graphics.drawable.Drawable$ConstantState.newDrawable(android.content.res.Resources)'
-
-          <item android:state_pressed="false" android:state_focused="false" android:drawable="@drawable/abc_textfield_default_mtrl_alpha"/>
-
-          For more info, see https://bit.ly/3CdLStv (react-native/pull/29452) and https://bit.ly/3nxOMoR.
-        -->
-        <item android:state_enabled="false" android:drawable="@drawable/abc_textfield_default_mtrl_alpha"/>
-        <item android:drawable="@drawable/abc_textfield_activated_mtrl_alpha"/>
-    </selector>
-
-</inset>
diff --git a/packages/rn-tester/android/app/src/main/res/values/styles.xml b/packages/rn-tester/android/app/src/main/res/values/styles.xml
index 7ba83a2ad5a2c9..24bc061368750c 100644
--- a/packages/rn-tester/android/app/src/main/res/values/styles.xml
+++ b/packages/rn-tester/android/app/src/main/res/values/styles.xml
@@ -3,7 +3,6 @@
     <!-- Base application theme. -->
     <style name="AppTheme" parent="Theme.AppCompat.DayNight.NoActionBar">
         <!-- Customize your theme here. -->
-        <item name="android:editTextBackground">@drawable/rn_edit_text_material</item>
     </style>
 
 </resources>