TextInput: autofill yellow highlight overflows when the field is not long enought

[manuelgarciacr]

Please provide all the information requested. Issues that do not follow this format are likely to stall.

Description

TextInput: autofill yellow highlight overflows when the field is not long enought and do not cover all the field. Sending attached github link and screenshots. In long fields with autocomplete like email the issue can be particularly recurring.

React Native version:

System: OS: Windows 10 10.0.19041 CPU: (8) x64 Intel(R) Core(TM) i7-4810MQ CPU @ 2.80GHz Memory: 5.46 GB / 15.91 GB Binaries: Node: 14.7.0 - C:\Program Files\nodejs\node.EXE Yarn: 1.22.10 - C:\Program Files\nodejs\yarn.CMD npm: 7.11.1 - C:\Program Files\nodejs\npm.CMD Watchman: Not Found SDKs: Android SDK: API Levels: 27, 28, 29, 30 Build Tools: 28.0.3, 29.0.2, 30.0.2 System Images: android-23 | Google APIs Intel x86 Atom, android-28 | Google Play Intel x86 Atom, android-29 | Google Play Intel x86 Atom
Android NDK: Not Found Windows SDK: Not Found IDEs: Android Studio: Version 4.2.0.0 AI-202.7660.26.42.7351085 Visual Studio: Not Found Languages: Java: Not Found Python: Not Found npmPackages: @react-native-community/cli: Not Found react: 16.13.1 => 16.13.1 react-native: https://github.com/expo/react-native/archive/sdk-41.0.0.tar.gz => 0.63.2 react-native-windows: Not Found npmGlobalPackages: react-native: Not Found

Steps To Reproduce

1. Create a tsx with a relatively narrow width TextInput with autofill property:

import { View, TextInput } from 'react-native'; <View style={{width: 200, backgroundColor: "white"}}> <TextInput autoCompleteType="email"></TextInput> </View>

2. Run and fill the field with a text longer than the field using the autocomplete keyboard feature

Expected Results

Yellow highlighting must cover all text and cannot overflow the beginning of the field. Or custom highlight property.

Snack, code example, screenshot, or link to a repository:

https://github.com/manuelgarciacr/textinput-bug.git

[github-actions[bot]]

This issue is stale because it has been open 180 days with no activity. Remove stale label or comment or this will be closed in 7 days.

[github-actions[bot]]

This issue was closed because it has been stalled for 7 days with no activity.