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.

[iOS] selectTextOnFocus won't work after upgrading from 0.61 to 0.62

See original GitHub issue

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

Description

If you include a TextInput in a page and set the props autoFocus and selectTextOnFocus to be true then the text inside the input (provided the fact that there is a value for the input on mount) the text inside the input is not selected. This happens only in iOS. In Android it works correctly.

It works as expected in 0.61 version but for some reason after the upgrade to 0.62 it does not. The aformentioned props can be found here.

React Native version:

info Fetching system and libraries information...
System:
    OS: macOS 11.0.1
    CPU: (8) x64 Intel(R) Core(TM) i5-8257U CPU @ 1.40GHz
    Memory: 167.37 MB / 8.00 GB
    Shell: 5.8 - /bin/zsh
  Binaries:
    Node: 14.5.0 - /usr/local/bin/node
    Yarn: Not Found
    npm: 6.14.8 - /usr/local/bin/npm
    Watchman: 4.9.0 - /usr/local/bin/watchman
  Managers:
    CocoaPods: 1.9.3 - /usr/local/bin/pod
  SDKs:
    iOS SDK:
      Platforms: iOS 13.7, DriverKit 19.0, macOS 10.15, tvOS 13.4, watchOS 6.2
    Android SDK:
      API Levels: 28, 29, 30
      Build Tools: 28.0.3, 29.0.2, 29.0.3, 30.0.1
      System Images: android-29 | Intel x86 Atom_64, android-30 | Google APIs Intel x86 Atom
      Android NDK: Not Found
  IDEs:
    Android Studio: 4.0 AI-193.6911.18.40.6626763
    Xcode: 11.7/11E801a - /usr/bin/xcodebuild
  Languages:
    Java: 1.8.0_262 - /usr/bin/javac
    Python: 2.7.16 - /usr/bin/python
  npmPackages:
    @react-native-community/cli: Not Found
    react: 16.11.0 => 16.11.0 
    react-native: ^0.62.2 => 0.62.2 
    react-native-macos: Not Found
  npmGlobalPackages:
    *react-native*: Not Found

Steps To Reproduce

  1. Include a <TextInput autofocus selectTextOnFocus value="myValue" /> in a screen
  2. The text will not be selected (highlighted)

Expected Results

I expected the text to be selected inside the input on mount.

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

   <View>
      {Platform.OS === 'ios' && ( // FIXME: This is a hack to make `selectTextOnFocus` work, otherwise it won't. Probably because of the upgrade to 0.62.
        <TextInput style={{ display: 'none' }} autoFocus selectTextOnFocus />
      )}
      <TextInput
        style={styles.input}
        onChangeText={text => onChangeText(text)}
        value={value}
        placeholder={inputLabel}
        autoFocus
        selectTextOnFocus
      />
   </ View>

The first <TextInput /> has been added as a workaround. I noticed that this fixes the issue BUT it is really weird. The behavior is not the one expected.

Issue Analytics

  • State:open
  • Created 3 years ago
  • Reactions:3
  • Comments:9

github_iconTop GitHub Comments

2reactions
valeriikcommented, Oct 14, 2021

“react-native”: “0.63.2” - selectTextOnFocus does not work on Android or IOS

2reactions
grifotvcommented, Dec 22, 2020

Also noticed that when multiline is set, the selectTextOnFocus prop works as expected. Hence this PR https://github.com/facebook/react-native/pull/29847

Read more comments on GitHub >

github_iconTop Results From Across the Web

react native - App won't load after upgrading to RN 0.62
I have the same problem migrating from react native 0.61.5 => 0.63.2, upgrading the version of react-native-confirmation-code-field fixed the ...
Read more >
TextInput · React Native
A foundational component for inputting text into the app via a keyboard. Props provide configurability for several features, such as auto-correction, ...
Read more >
Just finished an upgrade from React Native 0.59 to 0.61. Here ...
If they do not then autoliking wont work and you will have to link them ... This native code can better integrate with...
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