[Android] textinput: Maintain cursor position when secureTextEntry toggles. #17851
Conversation
|
Thank you for your pull request and welcome to our community. We require contributors to sign our Contributor License Agreement, and we don't seem to have you on file. In order for us to review and merge your code, please sign up at https://code.facebook.com/cla. If you are contributing on behalf of someone else (eg your employer), the individual CLA may not be sufficient and your employer may need the corporate CLA signed. If you have received this in error or have any questions, please contact us at cla@fb.com. Thanks! |
|
@facebook-github-bot label iOS Generated by 🚫 dangerJS |
facebook-github-bot
added
CLA Signed
|
Thank you for signing our Contributor License Agreement. We can now accept your code for this (and any) Facebook open source project. Thanks! |
jainkuniya
changed the title
There was a problem hiding this comment.
Thanks for improving this!
I would like to avoid changing the way we make the text input a password field, I think it would be possible to keep using updateStagedInputTypeFlag and instead do the selection position logic when we commit the input flags here https://github.com/jainkuniya/react-native/blob/c7a678947587488183e855fe56d53325d8ca08c8/ReactAndroid/src/main/java/com/facebook/react/views/textinput/ReactEditText.java#L310. As a bonus it might prevent the selection from changing when changing the keyboardType also.
|
We could also preserve the selection end while at it :) |
jainkuniya
force-pushed
the
textinput-android-maintain-cursor-position
branch
from
c7a6789 to
89e28bb
Compare
|
hi @janicduplessis Thanks for the review |
|
Looks good, thanks! @facebook-github-bot shipit |
facebook-github-bot
added
the
Import Started
There was a problem hiding this comment.
@janicduplessis is landing this pull request. If you are a Facebook employee, you can view this diff on Phabricator.
Summary: <!-- Thank you for sending the PR! We appreciate you spending the time to work on these changes. Help us understand your motivation by explaining why you decided to make this change. You can learn more about contributing to React Native here: http://facebook.github.io/react-native/docs/contributing.html Happy contributing! --> On current [master](https://github.com/facebook/react-native/tree/8235a49a33cc8e84cd4ba1cc15bc09eed6712b4c), text input cursor resets to start when `secureTextEntry` prop toggles on Android. This motivate me to maintain position when `secureTextEntry ` prop toggles for better user experience. On current [master](https://github.com/facebook/react-native/tree/8235a49a33cc8e84cd4ba1cc15bc09eed6712b4c)  On this PR  [ANDROID] [BUGFIX] [TextInput] - Fix: cursor positions resets to start on toggling `secureTextEntry` prop. <!-- Help reviewers and the release process by writing your own release notes **INTERNAL and MINOR tagged notes will not be included in the next version's final release notes.** CATEGORY [----------] TYPE [ CLI ] [-------------] LOCATION [ DOCS ] [ BREAKING ] [-------------] [ GENERAL ] [ BUGFIX ] [-{Component}-] [ INTERNAL ] [ ENHANCEMENT ] [ {File} ] [ IOS ] [ FEATURE ] [ {Directory} ] |-----------| [ ANDROID ] [ MINOR ] [ {Framework} ] - | {Message} | [----------] [-------------] [-------------] |-----------| [CATEGORY] [TYPE] [LOCATION] - MESSAGE EXAMPLES: [IOS] [BREAKING] [FlatList] - Change a thing that breaks other things [ANDROID] [BUGFIX] [TextInput] - Did a thing to TextInput [CLI] [FEATURE] [local-cli/info/info.js] - CLI easier to do things with [DOCS] [BUGFIX] [GettingStarted.md] - Accidentally a thing/word [GENERAL] [ENHANCEMENT] [Yoga] - Added new yoga thing/position [INTERNAL] [FEATURE] [./scripts] - Added thing to script that nobody will see --> Closes facebook#17851 Differential Revision: D6925711 Pulled By: hramos fbshipit-source-id: 6d53ad2dbed2dca20cd21e5b1b0578be13a91aad
|
@janicduplessis and @jainkuniya this commit does not fix the issue completely in Android, I am still getting it in v0.55.3. Check out this thread #18377 for more info. |
|
Hi @ravirajn22 there is a follow up PR for this #17990. It will be fixed once #17990 gets merged. |
…46948) Summary: On Android, when `ReactEditText` is attached to window, `setTextIsSelectable` moves the caret to the beginning, so we need to restore the selection. This is similar to what we did in #17851. Fixes #46943 ## Changelog: [ANDROID] [FIXED] - Fix TextInput caret moving to the beginning when attached to window Pull Request resolved: #46948 Test Plan: Code to reproduce in RNTester: ```TSX import type {RNTesterModuleExample} from '../../types/RNTesterTypes'; import {TextInput} from 'react-native'; import {useEffect, useRef} from 'react'; function Playground() { const input = useRef(null); useEffect(() => { setTimeout(() => input.current?.focus(), 1000); }, []); return <TextInput ref={input} value='1.00' selection={{start: 4, end: 4}} />; } export default ({ title: 'Playground', name: 'playground', render: (): React.Node => <Playground />, }: RNTesterModuleExample); ``` Before | After -- | --  |  Reviewed By: cortinico Differential Revision: D64175774 Pulled By: rshest fbshipit-source-id: ef9fdbecca582c8075bcdfd2d9b810b04d87e3d9
Motivation
On current master, text input cursor resets to start when
secureTextEntryprop toggles on Android. This motivate me to maintain position whensecureTextEntryprop toggles for better user experience.On current master
Test Plan
On this PR
Release Notes
[ANDROID] [BUGFIX] [TextInput] - Fix: cursor positions resets to start on toggling
secureTextEntryprop.