[CP staging] fix: prevent DatePicker autofocus from reopening calendar#89057
[CP staging] fix: prevent DatePicker autofocus from reopening calendar#89057pecanoro merged 2 commits intoExpensify:mainfrom
Conversation
|
Hey! I see that you made changes to our Form component. Make sure to update the docs in FORMS.md accordingly. Cheers! |
| transitionEndTimeoutRef.current = null; | ||
| }, []); | ||
|
|
||
| const cancelAutoFocus = useCallback(() => { |
There was a problem hiding this comment.
❌ CLEAN-REACT-PATTERNS-0 (docs)
This file compiles successfully with React Compiler, which automatically memoizes closures based on their captured variables. The manual useCallback wrapping cancelAutoFocus is redundant and can interfere with the compiler's optimization model.
Remove the useCallback wrapper and define cancelAutoFocus as a plain function:
const cancelAutoFocus = () => {
isAutoFocusCancelledRef.current = true;
clearTransitionEndTimeout();
setIsScreenTransitionEnded(false);
};Reviewed at: 49c78e0 | Please rate this suggestion with 👍 or 👎 to help us improve! Reactions are used to monitor reviewer efficiency.
Codecov Report❌ Looks like you've decreased code coverage for some files. Please write tests to increase, or at least maintain, the existing level of code coverage. See our documentation here for how to interpret this table.
|
|
@brunovjk I addressed the automated review comment and pushed the follow-up commit. The checklist is updated now, and the screen recording is attached in the PR body. Please review when you get a chance. |
|
@codex review |
|
Codex Review: Didn't find any major issues. More of your lovely PRs please. ℹ️ About Codex in GitHubCodex has been enabled to automatically review pull requests in this repo. Reviews are triggered when you
If Codex has suggestions, it will comment; otherwise it will react with 👍. When you sign up for Codex through ChatGPT, Codex can also answer questions or update the PR, like "@codex address that feedback". |
Reviewer Checklist
Screenshots/VideosAndroid: HybridApp89057_android_native.movAndroid: mWeb Chrome89057_android_web.moviOS: HybridApp89057_ios_native.moviOS: mWeb Safari89057_ios_web.movMacOS: Chrome / Safari89057_web_chrome.mov |
|
@pecanoro @Julesssss @KJ21-ENG Can you confirm one expected behavior? Should the Date Picker open automatically when we access the Date Picker page? Thank you. iOS: HybridAppScreen.Recording.2026-04-28.at.10.29.20.movMacOS: Chrome / SafariScreen.Recording.2026-04-28.at.10.25.07.mov |
|
@brunovjk On production, it opens automatically, so we should probably keep that behaviour |
|
🚧 @pecanoro has triggered a test Expensify/App build. You can view the workflow run here. |
|
🧪🧪 Use the links below to test this adhoc build on Android, iOS, and Web. Happy testing! 🧪🧪
|
|
✋ This PR was not deployed to staging yet because QA is ongoing. It will be automatically deployed to staging after the next production release. |
fix: prevent DatePicker autofocus from reopening calendar (cherry picked from commit 0e9b7db) (cherry-picked to staging by arosiclair)
|
🚀 Cherry-picked to staging by https://github.com/arosiclair in version: 9.3.64-13 🚀
Bundle Size Analysis (Sentry): |
|
No help site changes are required for this PR. This is a purely internal UI bug fix that prevents the DatePicker calendar from reopening after selecting a DOB in the "Add bank account" flow. The changes are limited to focus-timing logic in |
|
🚀 Cherry-picked to staging by https://github.com/arosiclair in version: 9.3.64-14 🚀
|
Explanation of Change
This fixes a regression from #88367 where the DatePicker calendar could reopen after selecting a DOB in the Add bank account flow.
DatePickeris a special auto-focus consumer because focusing its input opens a calendar popover. If the user manually focuses the DOB input before the delayeduseAutoFocusInputfocus runs, the pending auto-focus can survive while the popover is open and then fire after the popover closes, reopening the calendar.This adds an explicit
cancelAutoFocusAPI touseAutoFocusInputand calls it whenDatePickeropens its popover. The cancellation also gates the pending timeout and navigationtransitionEndpath so the cancelled auto-focus cannot be re-armed during the same screen focus cycle.Fixed Issues
$ #89044
PROPOSAL: #89044 (comment)
Tests
Offline tests
Same as Tests. This is a local UI focus timing fix and does not depend on network state.
QA Steps
Same as Tests.
PR Author Checklist
### Fixed Issuessection aboveTestssectionOffline stepssectionQA stepssectiontoggleReportand notonIconClick)src/languages/*files and using the translation methodSTYLE.md) were followedAvatar, I verified the components usingAvatarare working as expected)StyleUtils.getBackgroundAndBorderStyle(theme.componentBG))npm run compress-svg)Avatar, I verified thatAvataris working as expected in all cases)Designlabel and/or tagged@Expensify/designso the design team can review the changes.ScrollViewcomponent to make it scrollable when more elements are added to the page.mainbranch was merged into this PR after a review, I tested again and verified the outcome was still expected according to theTeststeps.Screenshots/Videos
Android: Native
N/A - regression reported on Web only.
Android: mWeb Chrome
N/A - regression reported on desktop Web only.
iOS: Native
N/A - regression reported on Web only.
iOS: mWeb Safari
N/A - regression reported on desktop Web only.
MacOS: Chrome / Safari
1777359725304928.mp4