Skip to content

React Native Layout Issue while using multiline in TextField #48203

Description

@MuhammadAuonOfficial

Description

I am encountering a crash in native code when typing into a TextField with the multiline property set to true. This issue occurs in a new screen I created while working on an Expo SDK 51 project using React Native 0.74. The TextField works flawlessly across other screens in the app, including those with multiline enabled. However, on this specific screen, the app crashes immediately when I start typing.

Below, I have provided the relevant code for the TextField component and the debugger log where the issue is triggered in Xcode.

Environment

Expo SDK: 51
React Native: 0.74
Platforms: iOS
Development Environment: macOS with Xcode

Error Code

void YogaLayoutableShadowNode::layout(LayoutContext layoutContext) { 
      ...
      // We must copy layout metrics from Yoga node only once (when the parent
      // node exclusively ownes the child node).
      react_native_assert(childYogaNode->getOwner() == &yogaNode_); <-- com.facebook.react.runtime.JavaScript (10): signal SIGABRT
      ...
}

My Code

<Input
      placeholder="Action Detail"
      multiline
      style={{
            height: 100,
      }}
      value={fields.actionDetail}
      onChangeText={(value) => handleChange('actionDetail', value)}
/>

Steps to reproduce

  1. Use the TextField component with multiline={true} on the new screen.
  2. Run the app on an iOS device or simulator.
  3. Start typing into the TextField.
  4. The app crashes immediately.

React Native Version

0.74.5

Affected Platforms

Runtime - iOS

Areas

Other (please specify)

Output of npx react-native info

System:
  OS: macOS 15.1.1
  CPU: (8) arm64 Apple M1
  Memory: 104.31 MB / 16.00 GB
  Shell:
    version: "5.9"
    path: /bin/zsh
Binaries:
  Node:
    version: 20.18.0
    path: /opt/homebrew/opt/node@20/bin/node
  Yarn: Not Found
  npm:
    version: 10.8.2
    path: /opt/homebrew/opt/node@20/bin/npm
  Watchman:
    version: 2024.10.21.00
    path: /opt/homebrew/bin/watchman
Managers:
  CocoaPods:
    version: 1.15.2
    path: /Users/muhammadauon/.rubies/ruby-3.3.5/bin/pod
SDKs:
  iOS SDK:
    Platforms:
      - DriverKit 24.0
      - iOS 18.0
      - macOS 15.0
      - tvOS 18.0
      - visionOS 2.0
      - watchOS 11.0
  Android SDK: Not Found
IDEs:
  Android Studio: 2024.2 AI-242.21829.142.2421.12409432
  Xcode:
    version: 16.0/16A242d
    path: /usr/bin/xcodebuild
Languages:
  Java:
    version: 17.0.12
    path: /usr/bin/javac
  Ruby:
    version: 3.3.5
    path: /Users/muhammadauon/.rubies/ruby-3.3.5/bin/ruby
npmPackages:
  "@react-native-community/cli": Not Found
  react:
    installed: 18.2.0
    wanted: 18.2.0
  react-native:
    installed: 0.74.5
    wanted: 0.74.5
  react-native-macos: Not Found
npmGlobalPackages:
  "*react-native*": Not Found
Android:
  hermesEnabled: true
  newArchEnabled: true
iOS:
  hermesEnabled: true
  newArchEnabled: true

Stacktrace or Logs

E1210 23:01:48.913069 1867591680 conversions.h:316] react_native_expect failure: value.hasType<std::string>()
E1210 23:01:50.273198 1867591680 YogaLayoutableShadowNode.cpp:688] react_native_assert failure: childYogaNode->getOwner() == &yogaNode_
Assertion failed: (childYogaNode->getOwner() == &yogaNode_), function layout, file YogaLayoutableShadowNode.cpp, line 688.

Reproducer

https://snack.expo.dev/NRyACbtulAltLwe0W0-Ul

Screenshots and Videos

No response

Metadata

Metadata

Assignees

No one assigned

    Labels

    Needs: AttentionIssues where the author has responded to feedback.Needs: ReproThis issue could be improved with a clear list of steps to reproduce the issue.Needs: Version InfoType: New ArchitectureIssues and PRs related to new architecture (Fabric/Turbo Modules)

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions