-
Notifications
You must be signed in to change notification settings - Fork 2.8k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Fix: Keyboard does not open in 2FA page when returning from recovery code #30620
Conversation
@akinwale I tested further and verified that my original proposal did not work. The check for props change is redundant because App/src/pages/signin/ValidateCodeForm/BaseValidateCodeForm.js Lines 321 to 334 in deb267f
The problem is that there's transition animation that blocked the focus. You might notice As such, all we need is to add |
@tienifr The soft keyboard does not show up in mobile Safari on iOS simulator 16.2. Please check this. Video included. 30620-ios-safari-no-soft-keyboard.mp4 |
@akinwale I can't reproduce even after pulling Screen.Recording.2023-11-03.at.00.35.51-compressed.mov |
Could you please test with Safari iOS 16.2 or 16.4? We can't assume that every user has upgraded to 17 at this point, and this will be considered a regression if we merge, since the Applause team is likely to test with iOS 16. Thanks. |
@akinwale Confimred that this does not work on Safari 16. Screen.Recording.2023-11-06.at.12.26.21.movI've digged into this and found out prior to Safari 17, user need to manually press the text input to toggle keyboard. Programatic focus does not work there (i.e. use I think there're no ways we can hack around that. I'll note in the PR description about this behavior. |
Ok, thanks for testing and confirming. Is this also the same behaviour on main without the changes in this PR? If yes, then it won't be considered a regression and we can file it as a separate issue. |
Yes, this is an existing behavior on
|
@tienifr Thanks. Please fix lint issues. |
Reviewer Checklist
Screenshots/VideosAndroid: Native30620-android-native.webmAndroid: mWeb Chrome30620-android-chrome.webmiOS: Native30620-ios-native.mp4iOS: mWeb Safari30620-ios-safari.mp4 |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
LGTM.
Tests well.
@bondydaa Can you check? |
✋ This PR was not deployed to staging yet because QA is ongoing. It will be automatically deployed to staging after the next production release. |
🚀 Deployed to staging by https://github.com/bondydaa in version: 1.3.99-0 🚀
|
🚀 Deployed to production by https://github.com/roryabraham in version: 1.3.99-0 🚀
|
🚀 Deployed to staging by https://github.com/bondydaa in version: 1.4.0-0 🚀
|
Details
Keyboard does not open in 2FA page when returning from recovery code. This PR fixes that.
Fixed Issues
$ #30281
PROPOSAL: #30281 (comment)
Tests
Note: For Safari before version 17, keyboard does not show. Just verify that the input is focused (i.e. highlighted).
Offline tests
NA
QA Steps
Note: For Safari before version 17, keyboard does not show. Just verify that the input is focused (i.e. highlighted).
PR Author Checklist
### Fixed Issues
section aboveTests
sectionOffline steps
sectionQA steps
sectiontoggleReport
and notonIconClick
)myBool && <MyComponent />
.src/languages/*
files and using the translation methodWaiting for Copy
label for a copy review on the original GH to get the correct copy.STYLE.md
) were followedAvatar
, I verified the components usingAvatar
are working as expected)/** comment above it */
this
properly so there are no scoping issues (i.e. foronClick={this.submit}
the methodthis.submit
should be bound tothis
in the constructor)this
are necessary to be bound (i.e. avoidthis.submit = this.submit.bind(this);
ifthis.submit
is never passed to a component event handler likeonClick
)StyleUtils.getBackgroundAndBorderStyle(themeColors.componentBG)
)Avatar
is modified, I verified thatAvatar
is working as expected in all cases)ScrollView
component to make it scrollable when more elements are added to the page.main
branch was merged into this PR after a review, I tested again and verified the outcome was still expected according to theTest
steps.Screenshots/Videos
Android: Native
Screen.Recording.2023-10-31.at.15.49.57-compressed.mov
Android: mWeb Chrome
Screen.Recording.2023-10-31.at.16.02.17-compressed.mov
iOS: Native
Screen.Recording.2023-10-31.at.16.08.25-compressed.mov
iOS: mWeb Safari
Screen.Recording.2023-10-31.at.16.06.38-compressed.mov
MacOS: Chrome / Safari
web-compressed.mov
MacOS: Desktop
desktop-compressed.mov