diff --git a/packages/experience/src/components/IdentifierRegisterForm/index.test.tsx b/packages/experience/src/components/IdentifierRegisterForm/index.test.tsx
index 328e6c71b09..3446649d5fa 100644
--- a/packages/experience/src/components/IdentifierRegisterForm/index.test.tsx
+++ b/packages/experience/src/components/IdentifierRegisterForm/index.test.tsx
@@ -161,7 +161,7 @@ describe('', () => {
test('submit properly', async () => {
const { getByText, queryByText, container } = renderForm();
const submitButton = getByText('action.create_account');
- const termsButton = getByText('description.agree_with_terms');
+
const usernameInput = container.querySelector('input[name=identifier]');
assert(usernameInput, new Error('username input not found'));
@@ -176,12 +176,9 @@ describe('', () => {
expect(registerWithUsername).not.toBeCalled();
});
+ const agreeButton = getByText('Agree');
act(() => {
- fireEvent.click(termsButton);
- });
-
- act(() => {
- fireEvent.submit(submitButton);
+ fireEvent.click(agreeButton);
});
await waitFor(() => {
diff --git a/packages/experience/src/components/IdentifierRegisterForm/index.tsx b/packages/experience/src/components/IdentifierRegisterForm/index.tsx
index 599e681ff8c..5ce7b032671 100644
--- a/packages/experience/src/components/IdentifierRegisterForm/index.tsx
+++ b/packages/experience/src/components/IdentifierRegisterForm/index.tsx
@@ -63,6 +63,10 @@ const IdentifierRegisterForm = ({ className, autoFocus, signUpMethods }: Props)
const onSubmitHandler = useCallback(
async (event?: React.FormEvent) => {
+ if (isSubmitting) {
+ return;
+ }
+
clearErrorMessage();
void handleSubmit(async ({ identifier: { type, value } }) => {
@@ -92,6 +96,7 @@ const IdentifierRegisterForm = ({ className, autoFocus, signUpMethods }: Props)
agreeToTermsPolicy,
clearErrorMessage,
handleSubmit,
+ isSubmitting,
navigateToSingleSignOn,
onSubmit,
setIdentifierInputValue,
diff --git a/packages/experience/src/components/IdentifierSignInForm/index.tsx b/packages/experience/src/components/IdentifierSignInForm/index.tsx
index 2246033a67d..9a5a697624f 100644
--- a/packages/experience/src/components/IdentifierSignInForm/index.tsx
+++ b/packages/experience/src/components/IdentifierSignInForm/index.tsx
@@ -70,6 +70,10 @@ const IdentifierSignInForm = ({ className, autoFocus, signInMethods }: Props) =>
const onSubmitHandler = useCallback(
async (event?: React.FormEvent) => {
+ if (isSubmitting) {
+ return;
+ }
+
clearErrorMessage();
void handleSubmit(async ({ identifier: { type, value } }) => {
@@ -96,6 +100,7 @@ const IdentifierSignInForm = ({ className, autoFocus, signInMethods }: Props) =>
agreeToTermsPolicy,
clearErrorMessage,
handleSubmit,
+ isSubmitting,
navigateToSingleSignOn,
onSubmit,
setIdentifierInputValue,
diff --git a/packages/experience/src/components/PasswordSignInForm/index.tsx b/packages/experience/src/components/PasswordSignInForm/index.tsx
index 8c541207f3f..6f08c12d607 100644
--- a/packages/experience/src/components/PasswordSignInForm/index.tsx
+++ b/packages/experience/src/components/PasswordSignInForm/index.tsx
@@ -63,6 +63,10 @@ const PasswordSignInForm = ({ className, autoFocus, signInMethods }: Props) => {
const onSubmitHandler = useCallback(
async (event?: React.FormEvent) => {
+ if (isSubmitting) {
+ return;
+ }
+
clearErrorMessage();
await handleSubmit(async ({ identifier: { type, value }, password }) => {
@@ -92,6 +96,7 @@ const PasswordSignInForm = ({ className, autoFocus, signInMethods }: Props) => {
agreeToTermsPolicy,
clearErrorMessage,
handleSubmit,
+ isSubmitting,
navigateToSingleSignOn,
onSubmit,
setIdentifierInputValue,
diff --git a/packages/experience/src/components/SingleSignOnForm/index.tsx b/packages/experience/src/components/SingleSignOnForm/index.tsx
index 56bc68343d2..2878c77a154 100644
--- a/packages/experience/src/components/SingleSignOnForm/index.tsx
+++ b/packages/experience/src/components/SingleSignOnForm/index.tsx
@@ -55,6 +55,10 @@ const SingleSignOnForm = ({ isTermsAndPrivacyCheckboxVisible }: Props) => {
*/
event?.preventDefault();
+ if (isSubmitting) {
+ return;
+ }
+
/**
* Check if the user has agreed to the terms and privacy policy when the policy is set to `Manual`.
*/
@@ -66,7 +70,7 @@ const SingleSignOnForm = ({ isTermsAndPrivacyCheckboxVisible }: Props) => {
await handleSubmit(async ({ identifier: { value } }) => onSubmit(value, true))(event);
},
- [agreeToTermsPolicy, clearErrorMessage, handleSubmit, onSubmit, termsValidation]
+ [agreeToTermsPolicy, clearErrorMessage, handleSubmit, isSubmitting, onSubmit, termsValidation]
);
return (
diff --git a/packages/experience/src/containers/SetPassword/Lite.tsx b/packages/experience/src/containers/SetPassword/Lite.tsx
index a0ab77abddf..aa1197a70fb 100644
--- a/packages/experience/src/containers/SetPassword/Lite.tsx
+++ b/packages/experience/src/containers/SetPassword/Lite.tsx
@@ -43,13 +43,17 @@ const Lite = ({ className, autoFocus, onSubmit, errorMessage, clearErrorMessage
const onSubmitHandler = useCallback(
(event?: React.FormEvent) => {
+ if (isSubmitting) {
+ return;
+ }
+
clearErrorMessage?.();
void handleSubmit(async (data) => {
await onSubmit(data.newPassword);
})(event);
},
- [clearErrorMessage, handleSubmit, onSubmit]
+ [clearErrorMessage, handleSubmit, isSubmitting, onSubmit]
);
return (
diff --git a/packages/experience/src/containers/SetPassword/SetPassword.tsx b/packages/experience/src/containers/SetPassword/SetPassword.tsx
index d668270d8e9..5a3ad107078 100644
--- a/packages/experience/src/containers/SetPassword/SetPassword.tsx
+++ b/packages/experience/src/containers/SetPassword/SetPassword.tsx
@@ -57,13 +57,17 @@ const SetPassword = ({
const onSubmitHandler = useCallback(
(event?: React.FormEvent) => {
+ if (isSubmitting) {
+ return;
+ }
+
clearErrorMessage?.();
void handleSubmit(async (data) => {
await onSubmit(data.newPassword);
})(event);
},
- [clearErrorMessage, handleSubmit, onSubmit]
+ [clearErrorMessage, handleSubmit, isSubmitting, onSubmit]
);
return (
diff --git a/packages/experience/src/pages/Continue/IdentifierProfileForm/index.tsx b/packages/experience/src/pages/Continue/IdentifierProfileForm/index.tsx
index 39fdfa6627d..fd4250daeb2 100644
--- a/packages/experience/src/pages/Continue/IdentifierProfileForm/index.tsx
+++ b/packages/experience/src/pages/Continue/IdentifierProfileForm/index.tsx
@@ -62,6 +62,10 @@ const IdentifierProfileForm = ({
const onSubmitHandler = useCallback(
(event?: React.FormEvent) => {
+ if (isSubmitting) {
+ return;
+ }
+
clearErrorMessage?.();
void handleSubmit(async ({ identifier: { type, value } }) => {
@@ -72,7 +76,7 @@ const IdentifierProfileForm = ({
await onSubmit?.(type, value);
})(event);
},
- [clearErrorMessage, handleSubmit, onSubmit]
+ [clearErrorMessage, handleSubmit, isSubmitting, onSubmit]
);
return (
diff --git a/packages/experience/src/pages/ForgotPassword/ForgotPasswordForm/index.tsx b/packages/experience/src/pages/ForgotPassword/ForgotPasswordForm/index.tsx
index a94bffc1ff8..af71a782613 100644
--- a/packages/experience/src/pages/ForgotPassword/ForgotPasswordForm/index.tsx
+++ b/packages/experience/src/pages/ForgotPassword/ForgotPasswordForm/index.tsx
@@ -59,6 +59,10 @@ const ForgotPasswordForm = ({ className, autoFocus, defaultValue = '', enabledTy
const onSubmitHandler = useCallback(
async (event?: React.FormEvent) => {
+ if (isSubmitting) {
+ return;
+ }
+
clearErrorMessage();
void handleSubmit(async ({ identifier: { type, value } }) => {
@@ -72,7 +76,7 @@ const ForgotPasswordForm = ({ className, autoFocus, defaultValue = '', enabledTy
await onSubmit({ identifier: type, value });
})(event);
},
- [clearErrorMessage, handleSubmit, onSubmit, setForgotPasswordIdentifierInputValue]
+ [clearErrorMessage, handleSubmit, isSubmitting, onSubmit, setForgotPasswordIdentifierInputValue]
);
return (
diff --git a/packages/experience/src/pages/SignInPassword/PasswordForm/index.tsx b/packages/experience/src/pages/SignInPassword/PasswordForm/index.tsx
index ebd088306c0..1727b1a6622 100644
--- a/packages/experience/src/pages/SignInPassword/PasswordForm/index.tsx
+++ b/packages/experience/src/pages/SignInPassword/PasswordForm/index.tsx
@@ -68,6 +68,10 @@ const PasswordForm = ({
const onSubmitHandler = useCallback(
async (event?: React.FormEvent) => {
+ if (isSubmitting) {
+ return;
+ }
+
clearErrorMessage();
void handleSubmit(async ({ identifier: { type, value }, password }) => {
@@ -83,7 +87,7 @@ const PasswordForm = ({
});
})(event);
},
- [clearErrorMessage, handleSubmit, onSubmit, setIdentifierInputValue]
+ [clearErrorMessage, handleSubmit, isSubmitting, onSubmit, setIdentifierInputValue]
);
return (