TextInput multiline={true} not functioning as expected

[JPig]

Description

TextInput multiline set to true no longer does newline on enter press. just blurs the TextInput instead.

Reproduction

Just change from 0.41.2 to 0.42.0 using the default AutoExpandingTextInput Example from the TextInput Docs to see it happening

Additional Information

• React Native version: 0.42.0
• Platform: Android ( Possibly iOS havent tested )
• Operating System: MacOS

[jonasb]

I can reproduce it on Android. But not on iOS.

<TextInput multiline style={{ height: 100, backgroundColor: '#ccc' }} />

[teh-obeng]

It blurs on Sony's Swift Keyboard,
but it's working fine when I changed it to Google's GBoard

[Yadro]

+1

[LMDavid]

It blurs on Samsung Galaxy S6 keyboard.
Like @hermantotang said, it works fine with Google's GBoard or the default keyboard in the Android emulator.

[JPig]

Yeah it was happening to me on a Samsung s6

[zhangzhhz]

Google English keyboard works as in that Enter will give a new line. Google Japanese keyboard does not work. A chinese input method I have also does not work.

Android.

[studio3w]

Had the same problem with SwiftKey Keyboard. Following fixed it for me:
#12923

[cbjs]

+1

[goodhyun]

#12923 didn't fix our case. We tried to replace the entire ReactAndroid folder, but in vain.
We had to roll back to 0.41.2
Hope this is fixed in 0.43

[studio3w]

@goodhyun have you built ReactNative from source?
https://facebook.github.io/react-native/docs/android-building-from-source.html

[astapinski]

+1 on this, we need a fix for this for our app because it affects Samsung.

[codewithpassion]

I have the same issue while using Expo. The Expo SDK 15 brought RN 0.42 and broke my input field.
See #13159.

[goodhyun]

Sorry @studio3w I didn't know that I had to rebuild RN again from source.
Even 0.43.1 didn't solve this issue, and I rebuilt 0.43.1 with #12923 fix and it just worked like a charm.

This is a really annoying issue though.

[Yadro]

Doesn't work onContentSizeChange event in release 0.43.2. wtf

[faverex]

+1

[cjmling]

Having same issue. :'( same version , using expo , swiftkey

[xuyuanzhou]

+1

[Ehesp]

Can confirm onContentSizeChange also not working in 43.*

[BCGen]

Below is useful to me, use expo SDK 17, RN 0.44, wrote by Typescript.
for multiline={true} not add new line and onContentSizeChange issue

https://gist.github.com/BCGen/9ba9f7d96459fd063e42bd53f9839217

[RobTS]

+1 Same here for Sony Z5 Compact. Why isn't this fixed yet? I'm a SwiftKey user as well, it seems to affect only those. Native Sony Keyboard works like a charm.

[Ehesp]

I don't think it's just swift key, I'm using a bog standard emulator and have the issue.

[smallpath]

Same here, totally failed on my three android devices, any updating?

[IOriens]

Having same issue: pressed enter and got submit triggered not entering a newline.
It works with google English input method, but all Chinese input method failed.

Platform: android 7.1.1
Input Method: Google Chinese Input Method.
RN Version: 0.44.0

[kevinluvian]

any update on this issue?

[Thyiad]

Same problem

[danielemontecchi]

I've solved setting the blurOnSubmit props to false: https://facebook.github.io/react-native/docs/textinput.html#bluronsubmit

<TextInput
	multiline={true}
	numberOfLines={4}
	blurOnSubmit={false}
/>

By default, blurOnSubmit is set to true. So every time you press enter on the keyboard, the TextInput loses focus. If instead you set this property to false, this does not happen and, with enter, go to a new line 👍

[goodhyun]

0.48.0-rc.0 and 0.47.1 are not yet good.

[vendramini]

People, I did a search and I found other related issues opened here in github. Did someone solve this or got a better workaround than inserting newline on demand?

[holyxiaoxin]

Tried to Build ReactAndroid from source from: https://facebook.github.io/react-native/docs/android-building-from-source.html, with this patch: e694199.

Bug still persist on Samsung keyboard and Google Chinese keyboard. Don't think this will be resolved anytime soon since this has been dragging for months. Meanwhile using wrapper class from https://gist.github.com/catchin/47afe706256604959c13dc25e7bb9383, while waiting for patch.

[shergin]

@holyxiaoxin That's sad. Probably different keyboard has different problems. 😢
Could you please share exact keyboard app name (or app id) which does not work for you?

[shergin]

@vendramini That issue discuss iOS specific problem, this one discuss Android specific one.

[ceefour]

@shergin Bug reproduced on ASUS ZenUI keyboard, Android 7.0, Expo SDK 20 / RN 0.47 ... Please try installing this keyboard

[shergin]

@ceefour Thank you! I will try!

[poongnewga]

It still has errors on Samsung Galaxy S6 keyboard also S7 keyboard.
It works fine with Google's GBoard or the default keyboard in the Android emulator.

[ceefour]

Agree with @poongnewga , this seems to be a behavior of certain third-party keyboards (which are in common usage). I think it's independent of Android version or manufacturer, since with my Asus Zenfone 3, I see similar behavior as him, i.e. the bug only occurs when I use ZenUI keyboard, and disappears when I switch to GBoard.

[superandrew213]

@shergin can you point to commit where this was fixed?

[zhangzhhz]

Finally this is fixed in 0.48. Setting blurOnSubmit={false} does it.

Fixed new line and prioritise blurOnSubmit in multiline text input (e694199) - @kevinluvian

[ceefour]

@zhangzhhz While I appreciate if it's really "fixed", the docs say

blurOnSubmit?: bool #

If true, the text field will blur when submitted. The default value is true for single-line fields and false for multiline fields.

Why the need to set to it false when it should default to false in the first place!

[ericwooley]

Probably to maintain backward comparability

[shergin]

@ceefour Do you mean that in your opinion it should be always false by default or you mean that the current behavior does not respect the docs?

[ceefour]

@shergin it doesn't respect the docs, so either one should be changed to match the other. I prefer behavior stated in the docs. much less "unexpected surprise" that way. AFAIK React Native is the only framework where setting "blurOnSubmit=false" explicitly is required on multline text input. Same component in Ionic and Xamarin just works out of the box.

[codewithpassion]

I've tried it with Expo v20 and manually moving to react-native 0.48.1.
Still no luck with Swiftkey

[RSNara]

@codewithpassion, have you tried explicitly setting blurOnSubmit={false}?

[shergin]

@ceefour The adb6646 finally fixes issue with wrong default value on Android! 🎉

Thanks @RSNara!

[suvodeep-pyne]

Nope. Still seeing this on 0.49.0. Had to manually set blurOnSubmit={false} to get it to work.

[shergin]

@suvodeep-pyne Yep. Starting on 0.50.

[sturmenta]

I added this line and it worked correctly:
style={{minHeight: 150, height: 'auto'}}

<TextInput
	onChangeText={val => this.setState({ text: val})}
	value={this.state.text}
	multiline
	style={{minHeight: 150, height: 'auto'}}
/>

[athulmurali]

@sturmenta your solution worked for me!