Skip to content

RCTTextInputComponentView doesn't recycle the inputAccessoryView relationship #52824

@ArturKalach

Description

@ArturKalach

Description

TextInput (RCTTextInputComponentView) doesn't recycle the inputAccessoryView properly, which leads to layout issues, especially with Modals.

Using a TextInput with an AccessoryView and then opening a Modal that contains another TextInput (recycling the previous TextInputs) can cause extra space, equal to the size of the AccessoryView, to appear in the modal when using TextInput with KeyboardAvoidingView.

Steps to reproduce

  1. Render more than eight TextInput components on the screen, each with an AccessoryView.
  2. Unmount the TextInput components using conditional rendering.
  3. Open a Modal that contains a KeyboardAvoidingView and a TextInput.
  4. Focus on the TextInput inside the Modal.

React Native Version

0.80.1

Affected Platforms

Runtime - iOS

Areas

Fabric - The New Renderer

Output of npx @react-native-community/cli info

info Fetching system and libraries information...
System:
  OS: macOS 15.5
  CPU: (8) arm64 Apple M1 Pro
  Memory: 252.58 MB / 16.00 GB
  Shell:
    version: "5.9"
    path: /bin/zsh
Binaries:
  Node:
    version: 20.19.0
    path: ~/.nvm/versions/node/v20.19.0/bin/node
  Yarn:
    version: 1.22.22
    path: ~/.nvm/versions/node/v20.19.0/bin/yarn
  npm:
    version: 10.8.2
    path: ~/.nvm/versions/node/v20.19.0/bin/npm
  Watchman:
    version: 2025.03.10.00
    path: /opt/homebrew/bin/watchman
Managers:
  CocoaPods:
    version: 1.16.2
    path: /opt/homebrew/bin/pod
SDKs:
  iOS SDK:
    Platforms:
      - DriverKit 24.2
      - iOS 18.2
      - macOS 15.2
      - tvOS 18.2
      - visionOS 2.2
      - watchOS 11.2
  Android SDK: Not Found
IDEs:
  Android Studio: 2024.3 AI-243.24978.46.2431.13208083
  Xcode:
    version: 16.2/16C5032a
    path: /usr/bin/xcodebuild
Languages:
  Java:
    version: 17.0.14
    path: /usr/bin/javac
  Ruby:
    version: 2.6.10
    path: /usr/bin/ruby
npmPackages:
  "@react-native-community/cli":
    installed: 19.0.0
    wanted: 19.0.0
  react:
    installed: 19.1.0
    wanted: 19.1.0
  react-native:
    installed: 0.80.1
    wanted: 0.80.1
  react-native-macos: Not Found
npmGlobalPackages:
  "*react-native*": Not Found
Android:
  hermesEnabled: true
  newArchEnabled: false
iOS:
  hermesEnabled: true
  newArchEnabled: true

Stacktrace or Logs

There are no crashes, only unexpected behavior.

MANDATORY Reproducer

https://snack.expo.dev/@arturkalach/privileged-blue-soda

Screenshots and Videos

iOS Simulator:
https://github.com/user-attachments/assets/bb35c6b8-b173-4c44-947f-e7b717b19f48

Snack Expo:
https://github.com/user-attachments/assets/4f402ce3-d6c3-414b-a806-6d9a710624f3

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions