fix(settings): dont send duplicate otp codes#20250
Conversation
There was a problem hiding this comment.
Pull request overview
This PR addresses duplicate OTP sends in the fxa-settings passwordless sign-in flow by changing when the initial passwordless code is triggered.
Changes:
- Updated the initial “send passwordless code”
useEffectto run only once on component mount (empty dependency array), aiming to prevent duplicate sends.
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
| sendCode(); | ||
| } | ||
| }, [email, service, codeSent, authClient, integration, navigateWithQuery, location.pathname, location.search, location.state, flowQueryParams]); | ||
| }, []); |
There was a problem hiding this comment.
This effect now has an empty dependency array but closes over email, codeSent, authClient, integration, service, flowQueryParams, navigateWithQuery, and location.*. That can lead to stale values (e.g., if route state/props change without a remount) and will also trigger react-hooks/exhaustive-deps warnings under the repo’s React ESLint config. Consider restoring an appropriate dependency list and preventing duplicate sends via an explicit in-flight guard (e.g., a ref) rather than relying on [], or add an eslint-disable with a clear rationale if running only once with initial values is truly required.
| sendCode(); | ||
| } | ||
| }, [email, service, codeSent, authClient, integration, navigateWithQuery, location.pathname, location.search, location.state, flowQueryParams]); | ||
| }, []); |
There was a problem hiding this comment.
Given the reported production issue is duplicate OTP sends on sign-in/sign-up, it would be valuable to add a regression test that forces a re-render (e.g., by changing flowQueryParams/location state identity while passwordlessSendCode is still pending) and asserts only one send occurs. The current test does not send code multiple times doesn't actually trigger a re-render, so it may not catch the original failure mode.
Because: - For relying parties with configured CMS customization, users are receiving duplicate OTP codes on signin and signup. This commit: - Ensure only 1 OTP code is sent, by only calling authClient.sendPasswordlessCode on component mount. Closes #FXA-13276
Because
This pull request
Issue that this pull request solves
Closes: #FXA-13276
Checklist
Put an
xin the boxes that applyScreenshots (Optional)
Please attach the screenshots of the changes made in case of change in user interface.
Other information (Optional)
Any other information that is important to this pull request.