Wait for validity check to complete before verification

web/packages/accounts/pages/credentials.tsx

@@ -70,6 +70,9 @@ const Page: React.FC<PageProps> = ({ appContext }) => {
     const [passkeyVerificationData, setPasskeyVerificationData] = useState<
         { passkeySessionID: string; url: string } | undefined
     >();
+    const [sessionValidityCheck, setSessionValidityCheck] = useState<
+        Promise<void> | undefined
+    >();
 
     const router = useRouter();
 
@@ -144,8 +147,7 @@ const Page: React.FC<PageProps> = ({ appContext }) => {
             );
 
             if (token) {
-                // Let it validate without blocking the rest of the flow.
-                void validateSession();
+                setSessionValidityCheck(validateSession());
             }
 
             if (kekEncryptedAttributes && keyAttributes) {
@@ -270,6 +272,8 @@ const Page: React.FC<PageProps> = ({ appContext }) => {
         passphrase,
     ) => {
         try {
+            if (sessionValidityCheck) await sessionValidityCheck;
+
             if (isFirstLogin() && passphrase) {
                 await generateAndSaveIntermediateKeyAttributes(
                     passphrase,
@@ -307,24 +311,6 @@ const Page: React.FC<PageProps> = ({ appContext }) => {
         }
     };
 
-    const handleIncorrectPassword = useCallback(() => {
-        // We've already checked this when the page was opened. But the user
-        // might've had a tab open from earlier and switch back to it after
-        // changing their password, and then try to enter their new password
-        // there. In those cases, the page-load version of this check wouldn't
-        // get to run in the new changed condition.
-        //
-        // To cover such cases, we redo the check whenever an incorrect password
-        // is entered.
-        const srpAttributes: SRPAttributes = getData(LS_KEYS.SRP_ATTRIBUTES);
-        const user: User = getData(LS_KEYS.USER);
-        if (srpAttributes && user?.email) {
-            void didPasswordChangeElsewhere(user.email, srpAttributes).then(
-                (changed) => changed && showSessionExpiredDialog(),
-            );
-        }
-    }, [showSessionExpiredDialog]);
-
     if (!keyAttributes && !srpAttributes) {
         return (
             <VerticallyCentered>
@@ -377,7 +363,6 @@ const Page: React.FC<PageProps> = ({ appContext }) => {
                     keyAttributes={keyAttributes}
                     getKeyAttributes={getKeyAttributes}
                     srpAttributes={srpAttributes}
-                    onIncorrectPassword={handleIncorrectPassword}
                 />
 
                 <LoginFlowFormFooter>

web/packages/shared/components/VerifyMasterPasswordForm.tsx

@@ -29,13 +29,6 @@ export interface VerifyMasterPasswordFormProps {
      */
     getKeyAttributes?: (kek: string) => Promise<KeyAttributes | undefined>;
     srpAttributes?: SRPAttributes;
-    /**
-     * Called when the user enters an incorrect password.
-     *
-     * Optional. If present, this function will be called _instead_ of
-     * performing the default behaviour (showing an "incorrect password" error).
-     */
-    onIncorrectPassword?: () => void;
 }
 
 export default function VerifyMasterPasswordForm({
@@ -46,7 +39,6 @@ export default function VerifyMasterPasswordForm({
     buttonText,
     submitButtonProps,
     getKeyAttributes,
-    onIncorrectPassword,
 }: VerifyMasterPasswordFormProps) {
     const verifyPassphrase: SingleInputFormProps["callback"] = async (
         passphrase,
@@ -105,8 +97,7 @@ export default function VerifyMasterPasswordForm({
                         setFieldError(t("WEAK_DEVICE"));
                         break;
                     case CustomError.INCORRECT_PASSWORD:
-                        if (onIncorrectPassword) onIncorrectPassword();
-                        else setFieldError(t("INCORRECT_PASSPHRASE"));
+                        setFieldError(t("INCORRECT_PASSPHRASE"));
                         break;
                     default:
                         setFieldError(`${t("UNKNOWN_ERROR")} ${e.message}`);