Repository navigation
[iOS][TextInput] onSelectionChange is not called in single line mode #21515
Description
Environment
React Native Environment Info:
System:
OS: macOS High Sierra 10.13.6
CPU: x64 Intel(R) Core(TM) i5-2435M CPU @ 2.40GHz
Memory: 101.08 MB / 10.00 GB
Shell: 3.2.57 - /bin/bash
Binaries:
Node: 8.11.1 - /usr/local/bin/node
Yarn: 1.5.1 - /usr/local/bin/yarn
npm: 6.4.0 - /usr/local/bin/npm
SDKs:
iOS SDK:
Platforms: iOS 11.4, macOS 10.13, tvOS 11.4, watchOS 4.3
IDEs:
Xcode: 9.4/9F1027a - /usr/bin/xcodebuild
npmPackages:
@types/react: ^16.4.14 => 16.4.14
@types/react-native: ^0.57.0 => 0.57.0
react: 16.5.0 => 16.5.0
react-native: 0.57.1 => 0.57.1
npmGlobalPackages:
react-native-cli: 2.0.1
Description
onSelectionChange method of TextInput does not return proper value when you use TextInput in single mode (not set multiline = {true}).
Reproducible Demo
// App.js
import React, {Component} from 'react';
import {Platform, StyleSheet, Text, View, TextInput} from 'react-native';
type Props = {};
export default class App extends Component<Props> {
constructor(props) {
super(props)
this.state = {
selection: {start: 0, end: 0},
text: 'This is a sample text',
}
}
render() {
return (
<View style={styles.container}>
<Text>{this.state.selection.start}, {this.state.selection.end}</Text>
<TextInput
style={{ width: 300, borderColor: 'gray', borderWidth: 1 }}
onSelectionChange={({ nativeEvent: { selection } }) => {
this.setState({ selection })
}}
onChangeText={(text) => this.setState({ text })}
value={this.state.text}
/>
</View>
);
}
}Run the code, if you select the part of text in TextInput, you need to see the number of start and end of selection, but you don't see anything unless you start to type, or cut the selected part, if the text is change the selection numbers appear.
After select the part of text, the result is like following image:
But if you add multiline = {true} it works properly.
Activity
[-]onSelectionChange does not work properly in TextInput single line mode[/-][+][v0.57] onSelectionChange does not work properly in TextInput single line mode[/+]react-native-bot commentedon Oct 5, 2018
Can you run
react-native infoand edit your issue to include these results under the Environment section?If you believe this information is irrelevant to the reported issue, you may write
[skip envinfo]under Environment to let us know.stale commentedon Jan 4, 2019
Hey there, it looks like there has been no activity on this issue recently. Has the issue been fixed, or does it still require the community's attention? This issue may be closed if no further activity occurs. You may also label this issue as "For Discussion" or "Good first issue" and I will leave it open. Thank you for your contributions.
LordParsley commentedon Jan 7, 2019
I have also experienced this issue on RN
0.57.3.proof666 commentedon Jan 10, 2019
I have also experienced this issue on RN 0.57.5
React Native Environment Info:
System:
OS: macOS 10.14.1
CPU: (8) x64 Intel(R) Core(TM) i7-4770HQ CPU @ 2.20GHz
Memory: 350.36 MB / 16.00 GB
Shell: 3.2.57 - /bin/bash
Binaries:
Node: 11.2.0 - /usr/local/bin/node
Yarn: 1.9.4 - /usr/local/bin/yarn
npm: 6.4.1 - /usr/local/bin/npm
Watchman: 4.9.0 - /usr/local/bin/watchman
SDKs:
iOS SDK:
Platforms: iOS 12.1, macOS 10.14, tvOS 12.1, watchOS 5.1
Android SDK:
API Levels: 23, 24, 25, 26, 27
Build Tools: 23.0.1, 23.0.3, 25.0.3, 26.0.1, 26.0.2, 27.0.3, 28.0.2
System Images: android-27 | Google Play Intel x86 Atom
IDEs:
Android Studio: 3.0 AI-171.4443003
Xcode: 10.1/10B61 - /usr/bin/xcodebuild
npmPackages:
react: 16.6.1 => 16.6.1
react-native: 0.57.5 => 0.57.5
npmGlobalPackages:
create-react-native-app: 1.0.0
react-native-cli: 2.0.1
react-native-git-upgrade: 0.2.7
alloy commentedon Mar 19, 2019
Can confirm this is still an issue issue on 0.59.1.
[-][v0.57] onSelectionChange does not work properly in TextInput single line mode[/-][+][TextInput] onSelectionChange is not called in single line mode[/+][-][TextInput] onSelectionChange is not called in single line mode[/-][+][iOS][TextInput] onSelectionChange is not called in single line mode[/+]liamse commentedon Mar 21, 2019
Dear @alloy, unfortunately I can confirm this is still an issue.
I run exactly same code with following react-native environment info and the
onSelectionChangeis not called in single line mode but it properly works in multiline mode.React Native Environment Info:
System:
OS: macOS High Sierra 10.13.6
CPU: (4) x64 Intel(R) Core(TM) i5-2435M CPU @ 2.40GHz
Memory: 624.06 MB / 10.00 GB
Shell: 3.2.57 - /bin/bash
Binaries:
Node: 8.11.1 - /usr/local/bin/node
Yarn: 1.5.1 - /usr/local/bin/yarn
npm: 6.4.0 - /usr/local/bin/npm
SDKs:
iOS SDK:
Platforms: iOS 12.1, macOS 10.14, tvOS 12.1, watchOS 5.1
IDEs:
Xcode: 10.1/10B61 - /usr/bin/xcodebuild
npmPackages:
react: 16.8.3 => 16.8.3
react-native: 0.59.1 => 0.59.1
npmGlobalPackages:
react-native-cli: 2.0.1
react-native: 0.52.0
zhongwuzw commentedon May 15, 2019
Fixing in #24840.
stale commentedon Aug 13, 2019
Hey there, it looks like there has been no activity on this issue recently. Has the issue been fixed, or does it still require the community's attention? This issue may be closed if no further activity occurs. You may also label this issue as a "Discussion" or add it to the "Backlog" and I will leave it open. Thank you for your contributions.
zhongwuzw commentedon Aug 13, 2019
Fixed in c38f167.