question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

TextInput caret is not visible with the property keyboardType="email-address"

See original GitHub issue

Description

the cursor is not visible, the field expects an email format. this happens in: Android 8.1.0 Redmi 5 Plus Model: MEG7 Android 10 Redmi Note 9S Model: M2003J6A1G Android 10 OnePlus 7 Pro Model: GM1910

Version

0.64.2

Output of react-native info

Android 8.1.0 Redmi 5 Plus Modelo: MEG7
Android 10 Redmi Note 9S Modelo: M2003J6A1G Android 10 OnePlus 7 Pro Modelo: GM1910

Steps to reproduce

SCAN QR and open expo

I found a “work around” adding by default the property caretHidden = {false}.

Remove or set the “caretHidden” property to true.

Then de issue can be show.

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

https://snack.expo.dev/@gastonrd7/textinput-keyboardtype-email-address

Issue Analytics

  • State:open
  • Created 2 years ago
  • Reactions:2
  • Comments:6

github_iconTop GitHub Comments

9reactions
gastonrd7commented, Jan 3, 2022

Sorry for the source code. I changed it and I share a link with simpler code. I found a “work around” adding by default the property caretHidden = {false}. Although this property is false, for the specified OS and the specified mobile device, passing it the caret is displayed. This is a work around since we shouldn’t pass it to it if it is false by default.

5reactions
AlexTarancommented, May 2, 2022

Having the same issue. For me the problem reproduced on Lenovo tb 8505f and Xiaomi Redmi 9A (Android 10). But setting caretHidden = {false} doesn’t even help.

Read more comments on GitHub >

github_iconTop Results From Across the Web

Caret won't show on TextInput on Android : r/reactnative - Reddit
My searches led me to the "caretHidden" property that even if I set ... positioned elements so try not showing them or if...
Read more >
React Native - Setting TextInput cursor position - Stack Overflow
As @this.lau_ says there is a controlled property called selection which accepts an object with keys start and end. Example:
Read more >
caret-color - CSS: Cascading Style Sheets - MDN Web Docs
The caret-color CSS property sets the color of the insertion caret, the visible marker where the next character typed will be inserted.
Read more >
Using Carets - Win32 apps - Microsoft Learn
Processing Keyboard Input. Creating and Displaying a Caret. Upon receiving the keyboard focus, the window should create and display the caret.
Read more >
caret-shape - CSS-Tricks
The caret-shape property in CSS changes the shape of the text cursor inside editable ... which is currently in Working Draft status.
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found