fix(iOS): fix issues with keyboard on autoFocus=true (#170)

Author: hannojg

packages/react-native/Libraries/AppDelegate/RCTDefaultReactNativeFactoryDelegate.mm

@@ -7,6 +7,7 @@
 
 #import "RCTDefaultReactNativeFactoryDelegate.h"
 #import <ReactCommon/RCTHost.h>
+#import <React/RCTViewController.h>
 #import "RCTAppSetupUtils.h"
 #import "RCTDependencyProvider.h"
 #if USE_THIRD_PARTY_JSC != 1
@@ -28,7 +29,7 @@ - (NSURL *_Nullable)sourceURLForBridge:(nonnull RCTBridge *)bridge
 
 - (UIViewController *)createRootViewController
 {
-  return [UIViewController new];
+  return [RCTViewController new];
 }
 
 - (RCTBridge *)createBridgeWithDelegate:(id<RCTBridgeDelegate>)delegate launchOptions:(NSDictionary *)launchOptions

packages/react-native/Libraries/AppDelegate/RCTReactNativeFactory.h

@@ -15,10 +15,15 @@
 #import "RCTUIConfiguratorProtocol.h"
 
 #if defined(__cplusplus) // Don't conform to protocols requiring C++ when it's not defined.
+#include <memory>
 #import <React/RCTComponentViewFactory.h>
 #import <ReactCommon/RCTHost.h>
 #import <ReactCommon/RCTTurboModuleManager.h>
 
+namespace facebook::react {
+class ReactNativeFeatureFlagsProvider;
+}
+
 #endif
 
 @class RCTBridge;
@@ -90,6 +95,12 @@ typedef NS_ENUM(NSInteger, RCTReleaseLevel) { Canary, Experimental, Stable };
 
 - (instancetype)initWithDelegate:(id<RCTReactNativeFactoryDelegate>)delegate releaseLevel:(RCTReleaseLevel)releaseLevel;
 
+#if defined(__cplusplus)
+/// Initializes React Native with the provided feature flag provider.
+- (instancetype)initWithDelegate:(id<RCTReactNativeFactoryDelegate>)delegate
+            featureFlagsProvider:(std::unique_ptr<facebook::react::ReactNativeFeatureFlagsProvider>)featureFlagsProvider;
+#endif
+
 - (void)startReactNativeWithModuleName:(NSString *)moduleName inWindow:(UIWindow *_Nullable)window;
 
 - (void)startReactNativeWithModuleName:(NSString *)moduleName

packages/react-native/Libraries/AppDelegate/RCTReactNativeFactory.mm

@@ -13,6 +13,7 @@
 #import <React/RCTUtils.h>
 #import <ReactCommon/RCTHost.h>
 #import <objc/runtime.h>
+#import <react/featureflags/ReactNativeFeatureFlags.h>
 #import <react/featureflags/ReactNativeFeatureFlagsOverridesOSSCanary.h>
 #import <react/featureflags/ReactNativeFeatureFlagsOverridesOSSExperimental.h>
 #import <react/featureflags/ReactNativeFeatureFlagsOverridesOSSStable.h>
@@ -51,23 +52,39 @@ - (instancetype)initWithDelegate:(id<RCTReactNativeFactoryDelegate>)delegate rel
   if (self = [super init]) {
     self.delegate = delegate;
     [self _setUpFeatureFlags:releaseLevel];
+    [self _setUpReactNativeFactory];
+  }
 
-    auto newArchEnabled = [self newArchEnabled];
-    auto fabricEnabled = [self fabricEnabled];
-
-    [RCTColorSpaceUtils applyDefaultColorSpace:[self defaultColorSpace]];
-    RCTEnableTurboModule([self turboModuleEnabled]);
-
-    self.rootViewFactory = [self createRCTRootViewFactory];
+  return self;
+}
 
-    if (newArchEnabled || fabricEnabled) {
-      [RCTComponentViewFactory currentComponentViewFactory].thirdPartyFabricComponentsProvider = self;
-    }
+- (instancetype)initWithDelegate:(id<RCTReactNativeFactoryDelegate>)delegate
+            featureFlagsProvider:(std::unique_ptr<ReactNativeFeatureFlagsProvider>)featureFlagsProvider
+{
+  if (self = [super init]) {
+    self.delegate = delegate;
+    [self _setUpFeatureFlagsWithProvider:std::move(featureFlagsProvider)];
+    [self _setUpReactNativeFactory];
   }
 
   return self;
 }
 
+- (void)_setUpReactNativeFactory
+{
+  auto newArchEnabled = [self newArchEnabled];
+  auto fabricEnabled = [self fabricEnabled];
+
+  [RCTColorSpaceUtils applyDefaultColorSpace:[self defaultColorSpace]];
+  RCTEnableTurboModule([self turboModuleEnabled]);
+
+  self.rootViewFactory = [self createRCTRootViewFactory];
+
+  if (newArchEnabled || fabricEnabled) {
+    [RCTComponentViewFactory currentComponentViewFactory].thirdPartyFabricComponentsProvider = self;
+  }
+}
+
 - (void)startReactNativeWithModuleName:(NSString *)moduleName inWindow:(UIWindow *_Nullable)window
 {
   [self startReactNativeWithModuleName:moduleName inWindow:window initialProperties:nil launchOptions:nil];
@@ -348,4 +365,21 @@ - (void)_setUpFeatureFlags:(RCTReleaseLevel)releaseLevel
   });
 }
 
+- (void)_setUpFeatureFlagsWithProvider:(std::unique_ptr<ReactNativeFeatureFlagsProvider>)featureFlagsProvider
+{
+  if (featureFlagsProvider == nullptr) {
+    [NSException
+         raise:@"RCTReactNativeFactory::_setUpFeatureFlagsWithProvider called with a null provider"
+        format:@"A ReactNativeFeatureFlagsProvider must be provided"];
+    return;
+  }
+
+  __block auto featureFlagsProviderBlock = std::move(featureFlagsProvider);
+
+  static dispatch_once_t setupFeatureFlagsToken;
+  dispatch_once(&setupFeatureFlagsToken, ^{
+    ReactNativeFeatureFlags::override(std::move(featureFlagsProviderBlock));
+  });
+}
+
 @end

packages/react-native/React/Fabric/Mounting/ComponentViews/TextInput/RCTTextInputComponentView.mm

@@ -17,6 +17,8 @@
 #import <React/RCTUITextField.h>
 #import <React/RCTUITextView.h>
 #import <React/RCTUtils.h>
+#import <React/UIView+React.h>
+#import <React/UIViewController+React.h>
 
 #import "RCTConversions.h"
 #import "RCTTextInputNativeCommands.h"
@@ -32,6 +34,7 @@
 
 @interface RCTTextInputComponentView () <
     RCTBackedTextInputDelegate,
+    RCTViewControllerAppearanceListener,
     RCTTextInputViewProtocol,
     UIDropInteractionDelegate>
 @end
@@ -66,6 +69,8 @@ @implementation RCTTextInputComponentView {
    */
   BOOL _comingFromJS;
   BOOL _didMoveToWindow;
+  BOOL _didAutoFocus;
+  __weak UIViewController *_viewController;
 
   /*
    * Newly initialized default typing attributes contain a no-op NSParagraphStyle and NSShadow. These cause inequality
@@ -91,6 +96,7 @@ - (instancetype)initWithFrame:(CGRect)frame
     _ignoreNextTextInputCall = NO;
     _comingFromJS = NO;
     _didMoveToWindow = NO;
+    _didAutoFocus = NO;
     _originalTypingAttributes = [_backedTextInputView.typingAttributes copy];
     _previousContentSize = CGSizeZero;
 
@@ -117,13 +123,18 @@ - (void)didMoveToWindow
 {
   [super didMoveToWindow];
 
+  bool enableNewAutoFocusImpl = ReactNativeFeatureFlags::enableIOSExperimentalAutoFocusImplementation();
+  if (enableNewAutoFocusImpl) {
+    [_viewController reactRemoveViewControllerAppearanceListener:self];
+    _viewController = self.window ? [self reactViewController] : nil;
+    [_viewController reactAddViewControllerAppearanceListener:self];
+  }
+
   if (self.window && !_didMoveToWindow) {
-    const auto &props = static_cast<const TextInputProps &>(*_props);
-    if (props.autoFocus) {
-      [_backedTextInputView becomeFirstResponder];
-      [self scrollCursorIntoView];
-    }
     _didMoveToWindow = YES;
+    if (!enableNewAutoFocusImpl) {
+      [self tryAutoFocus];
+    }
     [self initializeReturnKeyType];
   }
 
@@ -378,9 +389,29 @@ - (void)prepareForRecycle
   _lastStringStateWasUpdatedWith = nil;
   _ignoreNextTextInputCall = NO;
   _didMoveToWindow = NO;
+  _didAutoFocus = NO;
+  [_viewController reactRemoveViewControllerAppearanceListener:self];
+  _viewController = nil;
   [_backedTextInputView resignFirstResponder];
 }
 
+#pragma mark - Auto focus / RCTViewControllerAppearanceListener
+
+- (void)tryAutoFocus
+{
+  const auto &props = static_cast<const TextInputProps &>(*_props);
+  if (props.autoFocus && !_didAutoFocus) {
+    _didAutoFocus = YES;
+    [_backedTextInputView becomeFirstResponder];
+    [self scrollCursorIntoView];
+  }
+}
+
+- (void)reactViewControllerDidAppear:(UIViewController *)viewController animated:(BOOL)animated
+{
+  [self tryAutoFocus];
+}
+
 #pragma mark - RCTBackedTextInputDelegate
 
 - (BOOL)textInputShouldBeginEditing

packages/react-native/React/Views/RCTViewController.h

@@ -0,0 +1,17 @@
+/*
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+
+#import <UIKit/UIKit.h>
+
+NS_ASSUME_NONNULL_BEGIN
+
+@interface RCTViewController : UIViewController
+
+@end
+
+NS_ASSUME_NONNULL_END

packages/react-native/React/Views/RCTViewController.m

@@ -0,0 +1,29 @@
+//
+//  RCTViewController.m
+//  React-Core
+//
+//  Created by Hanno Goedecke on 27.04.26.
+//
+
+#import "RCTViewController.h"
+#import <React/UIViewController+React.h>
+
+@interface RCTViewController ()
+
+@end
+
+@implementation RCTViewController
+
+- (void)viewDidAppear:(BOOL)animated
+{
+  [super viewDidAppear:animated];
+  [self reactNotifyViewControllerDidAppear:animated];
+}
+
+- (void)viewDidDisappear:(BOOL)animated
+{
+  [super viewDidDisappear:animated];
+  [self reactNotifyViewControllerDidDisappear:animated];
+}
+
+@end

packages/react-native/React/Views/RCTWrapperViewController.h

@@ -5,11 +5,11 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-#import <UIKit/UIKit.h>
+#import <React/RCTViewController.h>
 
 @class RCTWrapperViewController;
 
-@interface RCTWrapperViewController : UIViewController
+@interface RCTWrapperViewController : RCTViewController
 
 - (instancetype)initWithContentView:(UIView *)contentView NS_DESIGNATED_INITIALIZER;
 

packages/react-native/React/Views/UIViewController+React.h

@@ -0,0 +1,36 @@
+/*
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+#import <UIKit/UIKit.h>
+
+NS_ASSUME_NONNULL_BEGIN
+
+@protocol RCTViewControllerAppearanceListener <NSObject>
+
+@optional
+- (void)reactViewControllerDidAppear:(UIViewController *)viewController animated:(BOOL)animated;
+- (void)reactViewControllerDidDisappear:(UIViewController *)viewController animated:(BOOL)animated;
+
+@end
+
+@interface UIViewController (React)
+
+@property (nonatomic, assign, readonly) BOOL reactViewControllerIsVisible;
+
+- (void)reactAddViewControllerAppearanceListener:(id<RCTViewControllerAppearanceListener>)listener;
+- (void)reactRemoveViewControllerAppearanceListener:(id<RCTViewControllerAppearanceListener>)listener;
+
+/**
+ * Call from `viewDidAppear:` / `viewDidDisappear:` in UIViewController subclasses
+ * that want to notify registered React Native appearance listeners.
+ */
+- (void)reactNotifyViewControllerDidAppear:(BOOL)animated;
+- (void)reactNotifyViewControllerDidDisappear:(BOOL)animated;
+
+@end
+
+NS_ASSUME_NONNULL_END