feat: fix show soft input on focus behavior#35244
Closed
zzz0108 wants to merge 1 commit intofacebook:mainfrom
zzz0108:fix/show-soft-input-on-focus-behavior-ios
Closed
feat: fix show soft input on focus behavior#35244zzz0108 wants to merge 1 commit intofacebook:mainfrom zzz0108:fix/show-soft-input-on-focus-behavior-ios
zzz0108 wants to merge 1 commit intofacebook:mainfrom
zzz0108:fix/show-soft-input-on-focus-behavior-ios
Conversation
Base commit: 6152763 |
Base commit: 6152763 |
|
PR build artifact for 42472db is ready. |
Contributor
|
@jacdebug has imported this pull request. If you are a Meta employee, you can view this diff on Phabricator. |
zzz0108
added a commit
to zzz0108/react-native
that referenced
this pull request
Apr 14, 2023
Summary: The `showSoftInputOnFocus` of `TextInput` is not working properly. When we set `showSoftInputOnFocus` to false and subsequently to `true`, it fails to open the keyboard, we have to re-focus on the input in order for the keyboard to show. It's expected that the keyboard will be opened as soon as `showSoftInputOnFocus` becomes `true`. This happens on iOS only. Reference in React Native doc: https://reactnative.dev/docs/textinput#showsoftinputonfocus. ## Changelog <!-- Help reviewers and the release process by writing your own changelog entry. For an example, see: https://reactnative.dev/contributing/changelogs-in-pull-requests --> [iOS] [Fixed] - Fix issue where keyboard does not open when `TextInput` `showSoftInputOnFocus` changes from `false` to `true` Pull Request resolved: facebook#35244 Test Plan: I've made a clean `create-react-native-app` repo to demonstrate this https://github.com/christianwen/reduced-rn-app. Here's the steps: 1. Clone https://github.com/christianwen/reduced-rn-app 2. Run `yarn install` 3. Run `cd ios`, then `pod install`, then `cd ..` 4. Run `yarn ios` 5. See the text input on the top of the screen, it can be observed that the keyboard does not open because `showSoftInputOnFocus` is `false`, 3 seconds later it becomes `true` due to a `setTimeout` that is used <img width="528" alt="Screenshot 2022-11-07 at 23 39 50" src="https://user-images.githubusercontent.com/21312517/200365369-a92fdea3-762c-4224-b463-7143b63329a7.png"> https://user-images.githubusercontent.com/21312517/200366099-db8626a6-1a31-4bfc-862c-2e37a8b35a3f.mov However, it can be seen that the keyboard does not open even though `showSoftInputOnFocus` becomes `true` 6. Now add the change in this PR to `Libraries/Text/TextInput/RCTBaseTextInputView.m` 7. Run `yarn ios` again 8. Now verify the step 5 again, the keyboard will open automatically when `showSoftInputOnFocus` becomes `true` https://user-images.githubusercontent.com/21312517/200363910-726716b1-e76d-420b-848d-a98747868db9.mp4 The reason why I created a fresh RN repo instead of using `rn-tester` app is because the `showSoftInputOnFocus` example is not working in `rn-tester` app for some reasons (it shows the keyboard even though `showSoftInputOnFocus` is `false` in the example). Regarding the code, it's similar to the fix for `keyboardType` in facebook@8baaacb. <img width="924" alt="Screenshot 2022-11-07 at 23 36 41" src="https://user-images.githubusercontent.com/21312517/200364649-38e7ddc3-ddac-47c4-a72d-a38cf32e120c.png"> Reviewed By: cipolleschi Differential Revision: D41274007 Pulled By: jacdebug fbshipit-source-id: dbdf45194db85eeb0a2a4ed372f8c71f44983725
OlimpiaZurek
pushed a commit
to OlimpiaZurek/react-native
that referenced
this pull request
May 22, 2023
Summary: The `showSoftInputOnFocus` of `TextInput` is not working properly. When we set `showSoftInputOnFocus` to false and subsequently to `true`, it fails to open the keyboard, we have to re-focus on the input in order for the keyboard to show. It's expected that the keyboard will be opened as soon as `showSoftInputOnFocus` becomes `true`. This happens on iOS only. Reference in React Native doc: https://reactnative.dev/docs/textinput#showsoftinputonfocus. ## Changelog <!-- Help reviewers and the release process by writing your own changelog entry. For an example, see: https://reactnative.dev/contributing/changelogs-in-pull-requests --> [iOS] [Fixed] - Fix issue where keyboard does not open when `TextInput` `showSoftInputOnFocus` changes from `false` to `true` Pull Request resolved: facebook#35244 Test Plan: I've made a clean `create-react-native-app` repo to demonstrate this https://github.com/christianwen/reduced-rn-app. Here's the steps: 1. Clone https://github.com/christianwen/reduced-rn-app 2. Run `yarn install` 3. Run `cd ios`, then `pod install`, then `cd ..` 4. Run `yarn ios` 5. See the text input on the top of the screen, it can be observed that the keyboard does not open because `showSoftInputOnFocus` is `false`, 3 seconds later it becomes `true` due to a `setTimeout` that is used <img width="528" alt="Screenshot 2022-11-07 at 23 39 50" src="https://user-images.githubusercontent.com/21312517/200365369-a92fdea3-762c-4224-b463-7143b63329a7.png"> https://user-images.githubusercontent.com/21312517/200366099-db8626a6-1a31-4bfc-862c-2e37a8b35a3f.mov However, it can be seen that the keyboard does not open even though `showSoftInputOnFocus` becomes `true` 6. Now add the change in this PR to `Libraries/Text/TextInput/RCTBaseTextInputView.m` 7. Run `yarn ios` again 8. Now verify the step 5 again, the keyboard will open automatically when `showSoftInputOnFocus` becomes `true` https://user-images.githubusercontent.com/21312517/200363910-726716b1-e76d-420b-848d-a98747868db9.mp4 The reason why I created a fresh RN repo instead of using `rn-tester` app is because the `showSoftInputOnFocus` example is not working in `rn-tester` app for some reasons (it shows the keyboard even though `showSoftInputOnFocus` is `false` in the example). Regarding the code, it's similar to the fix for `keyboardType` in facebook@8baaacb. <img width="924" alt="Screenshot 2022-11-07 at 23 36 41" src="https://user-images.githubusercontent.com/21312517/200364649-38e7ddc3-ddac-47c4-a72d-a38cf32e120c.png"> Reviewed By: cipolleschi Differential Revision: D41274007 Pulled By: jacdebug fbshipit-source-id: dbdf45194db85eeb0a2a4ed372f8c71f44983725
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
The
showSoftInputOnFocusofTextInputis not working properly. When we setshowSoftInputOnFocusto false and subsequently totrue, it fails to open the keyboard, we have to re-focus on the input in order for the keyboard to show. It's expected that the keyboard will be opened as soon asshowSoftInputOnFocusbecomestrue. This happens on iOS only.Reference in React Native doc: https://reactnative.dev/docs/textinput#showsoftinputonfocus.
Changelog
[iOS] [Fixed] - Fix issue where keyboard does not open when
TextInputshowSoftInputOnFocuschanges fromfalsetotrueTest Plan
I've made a clean
create-react-native-apprepo to demonstrate this https://github.com/christianwen/reduced-rn-app.Here's the steps:
yarn installcd ios, thenpod install, thencd ..yarn iosshowSoftInputOnFocusisfalse, 3 seconds later it becomestruedue to asetTimeoutthat is usedScreen.Recording.2022-11-07.at.23.42.11.mov
However, it can be seen that the keyboard does not open even though
showSoftInputOnFocusbecomestrue6. Now add the change in this PR to
Libraries/Text/TextInput/RCTBaseTextInputView.m7. Run
yarn iosagain8. Now verify the step 5 again, the keyboard will open automatically when
showSoftInputOnFocusbecomestrueSimulator.Screen.Recording.-.iPhone.14.-.2022-11-07.at.23.32.01.mp4
The reason why I created a fresh RN repo instead of using
rn-testerapp is because theshowSoftInputOnFocusexample is not working inrn-testerapp for some reasons (it shows the keyboard even thoughshowSoftInputOnFocusisfalsein the example).Regarding the code, it's similar to the fix for
keyboardTypein 8baaacb.