Fix broken focus behavior for TextInput in older Android versions (< 9) (#51964)

Author: joevilches

packages/react-native/ReactAndroid/src/main/java/com/facebook/react/internal/featureflags/ReactNativeFeatureFlags.kt

@@ -4,7 +4,7 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  *
- * @generated SignedSource<<b263bdcbc1258f7d5c56e69732ba9076>>
+ * @generated SignedSource<<fa641112b3a8888ba2b24cf8829e9382>>
  */
 
 /**
@@ -250,12 +250,6 @@ public object ReactNativeFeatureFlags {
  @JvmStatic
  public fun useAlwaysAvailableJSErrorHandling(): Boolean = accessor.useAlwaysAvailableJSErrorHandling()
 
- /**
- * If true, focusing in ReactEditText will mainly use stock Android requestFocus() behavior. If false it will use legacy custom focus behavior.
- */
- @JvmStatic
- public fun useEditTextStockAndroidFocusBehavior(): Boolean = accessor.useEditTextStockAndroidFocusBehavior()
-
  /**
  * Should this application enable the Fabric Interop Layer for Android? If yes, the application will behave so that it can accept non-Fabric components and render them on Fabric. This toggle is controlling extra logic such as custom event dispatching that are needed for the Fabric Interop Layer to work correctly.
  */

packages/react-native/ReactAndroid/src/main/java/com/facebook/react/internal/featureflags/ReactNativeFeatureFlagsCxxAccessor.kt

@@ -4,7 +4,7 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  *
- * @generated SignedSource<<0496ecf3d1e5d8a2e6d4d594aca806d0>>
+ * @generated SignedSource<<9ecb711480b7d6c22bac380c28d035bc>>
  */
 
 /**
@@ -57,7 +57,6 @@ internal class ReactNativeFeatureFlagsCxxAccessor : ReactNativeFeatureFlagsAcces
  private var traceTurboModulePromiseRejectionsOnAndroidCache: Boolean? = null
  private var updateRuntimeShadowNodeReferencesOnCommitCache: Boolean? = null
  private var useAlwaysAvailableJSErrorHandlingCache: Boolean? = null
- private var useEditTextStockAndroidFocusBehaviorCache: Boolean? = null
  private var useFabricInteropCache: Boolean? = null
  private var useNativeViewConfigsInBridgelessModeCache: Boolean? = null
  private var useOptimizedEventBatchingOnAndroidCache: Boolean? = null
@@ -399,15 +398,6 @@ internal class ReactNativeFeatureFlagsCxxAccessor : ReactNativeFeatureFlagsAcces
  return cached
  }
 
- override fun useEditTextStockAndroidFocusBehavior(): Boolean {
- var cached = useEditTextStockAndroidFocusBehaviorCache
- if (cached == null) {
- cached = ReactNativeFeatureFlagsCxxInterop.useEditTextStockAndroidFocusBehavior()
- useEditTextStockAndroidFocusBehaviorCache = cached
- }
- return cached
- }
-
  override fun useFabricInterop(): Boolean {
  var cached = useFabricInteropCache
  if (cached == null) {

packages/react-native/ReactAndroid/src/main/java/com/facebook/react/internal/featureflags/ReactNativeFeatureFlagsCxxInterop.kt

@@ -4,7 +4,7 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  *
- * @generated SignedSource<<c4f3b0cee8b9b4b9cebb589801e1dd15>>
+ * @generated SignedSource<<2151e5ec5d04924e742f37b527dc23b9>>
  */
 
 /**
@@ -102,8 +102,6 @@ public object ReactNativeFeatureFlagsCxxInterop {
 
  @DoNotStrip @JvmStatic public external fun useAlwaysAvailableJSErrorHandling(): Boolean
 
- @DoNotStrip @JvmStatic public external fun useEditTextStockAndroidFocusBehavior(): Boolean
-
  @DoNotStrip @JvmStatic public external fun useFabricInterop(): Boolean
 
  @DoNotStrip @JvmStatic public external fun useNativeViewConfigsInBridgelessMode(): Boolean

packages/react-native/ReactAndroid/src/main/java/com/facebook/react/internal/featureflags/ReactNativeFeatureFlagsDefaults.kt

@@ -4,7 +4,7 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  *
- * @generated SignedSource<<a8900217ae0385947b619c8fa0834942>>
+ * @generated SignedSource<<56f86a3a0c0bbf453cf45a0db541ef54>>
  */
 
 /**
@@ -97,8 +97,6 @@ public open class ReactNativeFeatureFlagsDefaults : ReactNativeFeatureFlagsProvi
 
  override fun useAlwaysAvailableJSErrorHandling(): Boolean = false
 
- override fun useEditTextStockAndroidFocusBehavior(): Boolean = true
-
  override fun useFabricInterop(): Boolean = false
 
  override fun useNativeViewConfigsInBridgelessMode(): Boolean = false

packages/react-native/ReactAndroid/src/main/java/com/facebook/react/internal/featureflags/ReactNativeFeatureFlagsLocalAccessor.kt

@@ -4,7 +4,7 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  *
- * @generated SignedSource<<8f5180a0ef154c083ac38d28e650ee11>>
+ * @generated SignedSource<<5b016fd6298477856116736e37c37c6f>>
  */
 
 /**
@@ -61,7 +61,6 @@ internal class ReactNativeFeatureFlagsLocalAccessor : ReactNativeFeatureFlagsAcc
  private var traceTurboModulePromiseRejectionsOnAndroidCache: Boolean? = null
  private var updateRuntimeShadowNodeReferencesOnCommitCache: Boolean? = null
  private var useAlwaysAvailableJSErrorHandlingCache: Boolean? = null
- private var useEditTextStockAndroidFocusBehaviorCache: Boolean? = null
  private var useFabricInteropCache: Boolean? = null
  private var useNativeViewConfigsInBridgelessModeCache: Boolean? = null
  private var useOptimizedEventBatchingOnAndroidCache: Boolean? = null
@@ -440,16 +439,6 @@ internal class ReactNativeFeatureFlagsLocalAccessor : ReactNativeFeatureFlagsAcc
  return cached
  }
 
- override fun useEditTextStockAndroidFocusBehavior(): Boolean {
- var cached = useEditTextStockAndroidFocusBehaviorCache
- if (cached == null) {
- cached = currentProvider.useEditTextStockAndroidFocusBehavior()
- accessedFeatureFlags.add("useEditTextStockAndroidFocusBehavior")
- useEditTextStockAndroidFocusBehaviorCache = cached
- }
- return cached
- }
-
  override fun useFabricInterop(): Boolean {
  var cached = useFabricInteropCache
  if (cached == null) {

packages/react-native/ReactAndroid/src/main/java/com/facebook/react/internal/featureflags/ReactNativeFeatureFlagsProvider.kt

@@ -4,7 +4,7 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  *
- * @generated SignedSource<<33571f99b1f78fbc62cecfca5f8351fa>>
+ * @generated SignedSource<<b4d6157922f6182dd588d5ae5b54ead9>>
  */
 
 /**
@@ -97,8 +97,6 @@ public interface ReactNativeFeatureFlagsProvider {
 
  @DoNotStrip public fun useAlwaysAvailableJSErrorHandling(): Boolean
 
- @DoNotStrip public fun useEditTextStockAndroidFocusBehavior(): Boolean
-
  @DoNotStrip public fun useFabricInterop(): Boolean
 
  @DoNotStrip public fun useNativeViewConfigsInBridgelessMode(): Boolean

packages/react-native/ReactAndroid/src/main/java/com/facebook/react/views/textinput/ReactEditText.java

@@ -36,6 +36,7 @@
 import android.view.MenuItem;
 import android.view.MotionEvent;
 import android.view.View;
+import android.view.ViewGroup;
 import android.view.accessibility.AccessibilityNodeInfo;
 import android.view.inputmethod.EditorInfo;
 import android.view.inputmethod.InputConnection;
@@ -146,9 +147,6 @@ public class ReactEditText extends AppCompatEditText {
 
  public ReactEditText(Context context) {
  super(context);
- if (!ReactNativeFeatureFlags.useEditTextStockAndroidFocusBehavior()) {
- setFocusableInTouchMode(false);
- }
 
  mInputMethodManager =
  (InputMethodManager)
@@ -191,9 +189,7 @@ public boolean performAccessibilityAction(View host, int action, Bundle args) {
  // selection on accessibility click to undo that.
  setSelection(length);
  }
- return ReactNativeFeatureFlags.useEditTextStockAndroidFocusBehavior()
- ? requestFocusProgramatically()
- : requestFocusInternal();
+ return requestFocusProgramatically();
  }
  return super.performAccessibilityAction(host, action, args);
  }
@@ -341,29 +337,28 @@ public boolean onTextContextMenuItem(int id) {
  return super.onTextContextMenuItem(id);
  }
 
- @Override
- public void clearFocus() {
- boolean useStockFocusBehavior = ReactNativeFeatureFlags.useEditTextStockAndroidFocusBehavior();
- if (!useStockFocusBehavior) {
- setFocusableInTouchMode(false);
+ public void clearFocusAndMaybeRefocus() {
+ if (Build.VERSION.SDK_INT > Build.VERSION_CODES.P || !isInTouchMode()) {
+ super.clearFocus();
+ } else {
+ // Avoid refocusing to a new view on old versions of Android by default
+ // by preventing `requestFocus()` on the rootView from moving focus to any child.
+ // https://cs.android.com/android/_/android/platform/frameworks/base/+/bdc66cb5a0ef513f4306edf9156cc978b08e06e4
+ ViewGroup rootViewGroup = (ViewGroup)getRootView();
+ int oldDescendantFocusability = rootViewGroup.getDescendantFocusability();
+ rootViewGroup.setDescendantFocusability(ViewGroup.FOCUS_BLOCK_DESCENDANTS);
+ super.clearFocus();
+ rootViewGroup.setDescendantFocusability(oldDescendantFocusability);
  }
- super.clearFocus();
+
  hideSoftKeyboard();
  }
 
- @Override
- public boolean requestFocus(int direction, Rect previouslyFocusedRect) {
- // This is a no-op so that when the OS calls requestFocus(), nothing will happen. ReactEditText
- // is a controlled component, which means its focus is controlled by JS, with two exceptions:
- // autofocus when it's attached to the window, and responding to accessibility events. In both
- // of these cases, we call requestFocusInternal() directly.
- return ReactNativeFeatureFlags.useEditTextStockAndroidFocusBehavior()
- ? super.requestFocus(direction, previouslyFocusedRect)
- : isFocused();
+ /* package */ void clearFocusFromJS() {
+ clearFocusAndMaybeRefocus();
  }
 
  private boolean requestFocusInternal() {
- setFocusableInTouchMode(true);
  // We must explicitly call this method on the super class; if we call requestFocus() without
  // any arguments, it will call into the overridden requestFocus(int, Rect) above, which no-ops.
  boolean focused = super.requestFocus(View.FOCUS_DOWN, null);
@@ -656,15 +651,7 @@ public void maybeUpdateTypeface() {
 
  // VisibleForTesting from {@link TextInputEventsTestCase}.
  public void requestFocusFromJS() {
- if (ReactNativeFeatureFlags.useEditTextStockAndroidFocusBehavior()) {
- requestFocusProgramatically();
- } else {
- requestFocusInternal();
- }
- }
-
- /* package */ void clearFocusFromJS() {
- clearFocus();
+ requestFocusProgramatically();
  }
 
  // VisibleForTesting from {@link TextInputEventsTestCase}.
@@ -1107,11 +1094,7 @@ public void onAttachedToWindow() {
  }
 
  if (mAutoFocus && !mDidAttachToWindow) {
- if (ReactNativeFeatureFlags.useEditTextStockAndroidFocusBehavior()) {
- requestFocusProgramatically();
- } else {
- requestFocusInternal();
- }
+ requestFocusProgramatically();
  }
 
  mDidAttachToWindow = true;

packages/react-native/ReactAndroid/src/main/java/com/facebook/react/views/textinput/ReactTextInputManager.java

@@ -1164,7 +1164,7 @@ protected void addEventEmitters(
  }
 
  if (shouldBlur) {
- editText.clearFocus();
+ editText.clearFocusAndMaybeRefocus();
  }
 
  // Prevent default behavior except when we want it to insert a newline.

packages/react-native/ReactAndroid/src/main/jni/react/featureflags/JReactNativeFeatureFlagsCxxInterop.cpp

@@ -4,7 +4,7 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  *
- * @generated SignedSource<<83b23039ed9fff5109ff3b532648baac>>
+ * @generated SignedSource<<cf0734c38bab916ecaf361bc557b8802>>
  */
 
 /**
@@ -261,12 +261,6 @@ class ReactNativeFeatureFlagsProviderHolder
  return method(javaProvider_);
  }
 
- bool useEditTextStockAndroidFocusBehavior() override {
- static const auto method =
- getReactNativeFeatureFlagsProviderJavaClass()->getMethod<jboolean()>("useEditTextStockAndroidFocusBehavior");
- return method(javaProvider_);
- }
-
  bool useFabricInterop() override {
  static const auto method =
  getReactNativeFeatureFlagsProviderJavaClass()->getMethod<jboolean()>("useFabricInterop");
@@ -498,11 +492,6 @@ bool JReactNativeFeatureFlagsCxxInterop::useAlwaysAvailableJSErrorHandling(
  return ReactNativeFeatureFlags::useAlwaysAvailableJSErrorHandling();
 }
 
-bool JReactNativeFeatureFlagsCxxInterop::useEditTextStockAndroidFocusBehavior(
- facebook::jni::alias_ref<JReactNativeFeatureFlagsCxxInterop> /*unused*/) {
- return ReactNativeFeatureFlags::useEditTextStockAndroidFocusBehavior();
-}
-
 bool JReactNativeFeatureFlagsCxxInterop::useFabricInterop(
  facebook::jni::alias_ref<JReactNativeFeatureFlagsCxxInterop> /*unused*/) {
  return ReactNativeFeatureFlags::useFabricInterop();
@@ -680,9 +669,6 @@ void JReactNativeFeatureFlagsCxxInterop::registerNatives() {
  makeNativeMethod(
  "useAlwaysAvailableJSErrorHandling",
  JReactNativeFeatureFlagsCxxInterop::useAlwaysAvailableJSErrorHandling),
- makeNativeMethod(
- "useEditTextStockAndroidFocusBehavior",
- JReactNativeFeatureFlagsCxxInterop::useEditTextStockAndroidFocusBehavior),
  makeNativeMethod(
  "useFabricInterop",
  JReactNativeFeatureFlagsCxxInterop::useFabricInterop),

packages/react-native/ReactAndroid/src/main/jni/react/featureflags/JReactNativeFeatureFlagsCxxInterop.h

@@ -4,7 +4,7 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  *
- * @generated SignedSource<<efb0288fd19fb35e4582522c835301b4>>
+ * @generated SignedSource<<f295d109e9a81ce2d2040a5fc89e9ada>>
  */
 
 /**
@@ -141,9 +141,6 @@ class JReactNativeFeatureFlagsCxxInterop
  static bool useAlwaysAvailableJSErrorHandling(
  facebook::jni::alias_ref<JReactNativeFeatureFlagsCxxInterop>);
 
- static bool useEditTextStockAndroidFocusBehavior(
- facebook::jni::alias_ref<JReactNativeFeatureFlagsCxxInterop>);
-
  static bool useFabricInterop(
  facebook::jni::alias_ref<JReactNativeFeatureFlagsCxxInterop>);