Problem with lineHeight in TextInput

[wiru123321]

Hi! 👋

I found some bug with TextInput. When i change the lineHeight props for my custom - three dots at the end of the TextInput when the text is too long disappears. react-native: "0.63.4"

[chrisglein]

This sounds very familiar. I've seen other TextInput + ellipses issues come through but I'm having a hard time finding this. You can help look through here. It'd be helpful if there was a Snack or at least copy-able version of your repro instead of a screenshot.

[github-actions[bot]]

:warning:	Missing Reproducible Example
:information_source:	It looks like your issue is missing a reproducible example. Please provide a Snack or a repository that demonstrates the issue you are reporting in a minimal, complete, and reproducible manner.

[github-actions[bot]]

:warning:	Missing Environment Information
:information_source:	Your issue may be missing information about your development environment. You can obtain the missing information by running react-native info in a console.

[github-actions[bot]]

:warning:	Missing Required Fields
:information_source:	It looks like your issue may be missing some necessary information. GitHub provides an example template whenever a new issue is created. Could you go back and make sure to fill out the template? You may edit this issue, or close it and open a new one.

[wiru123321]

My environment info: Here is simple example - test it on iOS because here is the problem: https://snack.expo.io/bL9-PEM1e

[SusulAdam]

Hi!

I have the same problem, i try implement custom font to the project with different line height to the textfield. Unfortunately three dots at the end of the Text Input when the text is too long disappears.

[wiru123321]

If u looking for fast but not perfect solution u can set lineHeight to undefined after changed font styles for custom, but i'm waiting for better solution.

[anwargul0x]

not only it affects trimming but it also doesn't show new input text after a certain character length or width of TextInput

[NandoMB]

https://github.com/facebook/react-native/pull/37465

[fabOnReact]

My PR did not yet fix this issue, but a similar solution can also fix this issue

As you see, adding lineHeight changed the width of the _UITextLayoutFragmentView. As the view changes width from 138 to 119, which is the reason the ellipsis does not show.