Incosistent behavior on setting selection using TextInput setNativeProps

This issue has been created since 2022-09-15.

Description

I want to move the cursor to the end of the input when it gets focus, so I use setNativeProps:

<TextInput
  value={text}
  onChangeText={setText}
  onFocus={() => {
    textInputRef.current?.setNativeProps({
      selection: {
        start: text.length,
        end: text.length,
      },
    });
  }}
/>

However, the input behaves differently on Android and iOS. On iOS, the cursor jumps to the end as expected and inputting text works. On Android, though the cursor jumps to the end, it "locks" to that position on inputting text (see the video attached below).

I try to use -1 instead of text.length. In this case, the Android works but on iOS the cursor jumps to the start instead of the end.

It looks like a Android specific bug.

Version

0.70.0

Output of npx react-native info

info Fetching system and libraries information...
System:
    OS: macOS 12.6
    CPU: (8) x64 Apple M2
    Memory: 21.76 MB / 16.00 GB
    Shell: 5.8.1 - /bin/zsh
  Binaries:
    Node: 14.20.0 - ~/.nvm/versions/node/v14.20.0/bin/node
    Yarn: 1.22.15 - ~/.nvm/versions/node/v14.20.0/bin/yarn
    npm: 6.14.17 - ~/.nvm/versions/node/v14.20.0/bin/npm
    Watchman: 2022.09.12.00 - /opt/homebrew/bin/watchman
  Managers:
    CocoaPods: 1.11.3 - /opt/homebrew/bin/pod
  SDKs:
    iOS SDK:
      Platforms: DriverKit 21.4, iOS 16.0, macOS 12.3, tvOS 16.0, watchOS 9.0
    Android SDK: Not Found
  IDEs:
    Android Studio: Chipmunk 2021.2.1 Patch 2 Chipmunk 2021.2.1 Patch 2
    Xcode: 14.0/14A309 - /usr/bin/xcodebuild
  Languages:
    Java: 11.0.16.1 - /usr/bin/javac
  npmPackages:
    @react-native-community/cli: Not Found
    react: 18.1.0 => 18.1.0
    react-native: 0.70.0 => 0.70.0
    react-native-macos: Not Found
  npmGlobalPackages:
    *react-native*: Not Found

Steps to reproduce

  1. Create a new project
  2. Write the following components in App.js(basically, removed the demo code and add my input-related code):
const CursorDemo = () => {
  const [text, setText] = useState('long hello world');
  const amountInput = useRef<TextInput>(null);
  return (
    <View>
      <TextInput
        ref={amountInput}
        value={text}
        onChangeText={setText}
        onFocus={() => {
          amountInput.current?.setNativeProps({
            selection: {
              start: text.length,
              end: text.length,
            },
          });
        }}
      />
    </View>
  );
};

const App: () => Node = () => {
  const isDarkMode = useColorScheme() === 'dark';

  const backgroundStyle = {
    backgroundColor: isDarkMode ? Colors.darker : Colors.lighter,
  };

  return (
    <SafeAreaView style={backgroundStyle}>
      <StatusBar
        barStyle={isDarkMode ? 'light-content' : 'dark-content'}
        backgroundColor={backgroundStyle.backgroundColor}
      />
      <CursorDemo />
    </SafeAreaView>
  );
};

export default App;
  1. Run app on iOS and Android respectively, and tap the middle area of the input to focus on it, and expect the cursor to jump to the end of the input.

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

The full project demostrating this issue in here: https://github.com/perqin/NativePropsSelectionIssue.

The video on Android:

1_1663226606.mp4
More Details About Repo
Owner Name facebook
Repo Name react-native
Full Name facebook/react-native
Language JavaScript
Created Date 2015-01-09
Updated Date 2022-10-07
Star Count 105180
Watcher Count 3671
Fork Count 22481
Issue Count 2230

YOU MAY BE INTERESTED

Issue Title Created Date Comment Count Updated Date
connection loss with state[IDLE], create new connection and reset state 0 2022-05-10 2022-07-27
Ops file `use-metric-store` does not set `nats` properties in the `route_registrar` job 1 2022-05-09 2022-09-16
Have you compared it with yolov5 results? 1 2021-10-17 2022-09-14
为什么修改为swin transformer一直报错RuntimeError: CUDA out of memory. Tried to allocate 768.00 MiB (GPU 0; 8.00 GiB total capacity; 5.44 GiB already allocated; 280.75 MiB free; 5.98 GiB reserved in total by PyTorch) 1 2021-11-01 2022-09-02
jfa-go doesn't follow the specified port 3 2021-07-21 2022-05-13
What's the logic of this line code?HELP 1 2021-10-20 2022-08-20
`:deep` selector doesn't work properly with SASS nested parent selector 0 2022-09-05 2022-09-28
Treesitter update and aerial failed 3 2022-04-18 2022-09-22
CSS Class "right-sibs" and "left-sibs" are applied on click on edge when no siblings are present 0 2021-09-29 2022-09-29
filter teller-specific output by default 0 2022-07-16 2022-07-09
Avoid subscribing to unnecessary topics in 3d panel. 0 2022-09-09 2022-09-27
Emit warnings when flit.buildapi is used 1 2022-01-27 2022-09-12
How could I increase the memory limit? 0 2020-09-14 2022-09-13
Cannot save edits after last update 0 2022-03-12 2022-09-07
Eliminate the use of object in TypeScript 0 2021-05-02 2022-08-29
Need a test for every gamemapprototype that the emergency shuttle can dock 0 2022-08-15 2022-08-09
Some entity prototypes have components added or modified during initialization. 0 2022-08-14 2022-08-09
Wix toolkit doesn't work with classfiles that have `$$` the in the file name. 1 2022-02-22 2022-06-18
Missing installer location 3 2022-03-15 2022-06-18
Dependent patch packages are not cleaned from the packagecache during uninstall. 36 2022-02-25 2022-06-18
correlation ID: 84b61c08-8704-4efe-8382-7eaa30dbfe7c 2 2021-12-09 2022-09-29
Redis cluster connection issue 1 2021-11-14 2022-09-20
Importing products from csv fails when optionValues have the same name 0 2022-02-24 2022-09-01
implement libvirt_domain default_ip_address 0 2019-10-20 2022-10-07
日期范围 自定义格式 怎么书写 0 2021-08-31 2022-01-08
Some new suggestions 1 2021-07-07 2022-08-26
绝对路径或者new Url方式导入图片资源 打包时无法打入包内 0 2022-09-19 2022-09-21
IMAP sync is slow 0 2021-11-28 2021-12-14
Why is includeStacktraces an option that cannot be set in constructor? 4 2021-10-09 2022-09-09
Failing Job sync-org_community_postsubmit of type postsubmit ended with state failure 0 2022-03-31 2022-10-03
How can I import this project in my code? does it have documents and examples? 1 2022-05-01 2022-09-30
Allow text-2.0 in serialise 3 2022-01-01 2022-09-25
Replace section in Array2D 1 2019-03-26 2022-10-02
FATAL: modpost: GPL-incompatible module zfs.ko uses GPL-only symbol 'perf_trace_buf_alloc' 1 2022-06-06 2022-08-26
Avatar not rendering correctly on clean install/SERVICE_URL incorrect 5 2021-04-09 2022-10-02
Potential Serialization vulnerability 22 2021-08-25 2022-10-04
Responsiveness of the site 2 2021-01-31 2022-09-25
Modify readFromSecureStorage() and writeToSecureStorage() calls to throw errors 2 2022-01-13 2022-08-15
[Identity] Add `AllowLoggingAccountIdentifiers` to the credential options 0 2022-02-24 2022-09-25
Documentation is unclear how curl works under TLS hostname validation under the case of SNI (Server name indication) 3 2021-11-16 2022-09-14
SynfigStudio segmentation fault on exit 9 2020-08-24 2022-09-20
Why does file.writeAsBytes only receive a portion of a file? 2 2022-01-11 2022-08-02
[Question] Is it possible to use playwright.config.ts webServer for multiple servers? 2 2021-12-30 2022-08-07
Docker setup? 1 2022-01-20 2022-01-15
【3.23.0】变量引用为0时,增加删除操作 0 2022-06-14 2022-09-24
TASK [geerlingguy.kubernetes : Join node to Kubernetes master] 3 2021-04-04 2022-10-03
Find a way to hide/reuse existing patterns inherited from Query Loop 1 2022-08-08 2022-09-30
Feature Request: New Navigation Type for Motorcycles 7 2022-04-15 2022-10-01
Speed camera warning is reproduced when driving on both sides of the route 0 2022-06-09 2022-07-26
Admin panel: address AccountSearch tests that have a .skip (flaky tests) 1 2022-06-06 2022-09-15