fix: address review feedback on MFA verify examples and tests

Author: yogeshchoudhary147

EXAMPLES.md

@@ -1223,35 +1223,52 @@ export class ChallengeComponent {
 
 ### Verifying Challenges
 
-> [!IMPORTANT] > `verify()` does not update Angular auth state (`isAuthenticated$`, `user$`). Call `getAccessTokenSilently()` after a successful verification to reflect the new session in the UI.
+> [!IMPORTANT] > `verify()` does not update Angular auth state (`isAuthenticated$`, `user$`). Always chain `getAccessTokenSilently()` after a successful verification to reflect the new session in the UI.
 
 ```ts
 import { Component } from '@angular/core';
 import { AuthService } from '@auth0/auth0-angular';
+import { switchMap, tap } from 'rxjs';
 
 @Component({ selector: 'app-verify', template: '' })
 export class VerifyComponent {
   constructor(private auth: AuthService) {}
 
   // Verify with OTP code (TOTP authenticator app)
   verifyOtp(mfaToken: string, otp: string) {
-    this.auth.mfa.verify({ mfaToken, otp }).subscribe((tokens) => {
-      console.log('Access token:', tokens.access_token);
-    });
+    this.auth.mfa
+      .verify({ mfaToken, otp })
+      .pipe(
+        switchMap(() => this.auth.getAccessTokenSilently()) // refresh isAuthenticated$, user$
+      )
+      .subscribe();
   }
 
   // Verify with OOB code (SMS / Voice / Email / Push)
   verifyOob(mfaToken: string, oobCode: string, bindingCode?: string) {
-    this.auth.mfa.verify({ mfaToken, oobCode, bindingCode }).subscribe((tokens) => {
-      console.log('Access token:', tokens.access_token);
-    });
+    this.auth.mfa
+      .verify({ mfaToken, oobCode, bindingCode })
+      .pipe(
+        switchMap(() => this.auth.getAccessTokenSilently()) // refresh isAuthenticated$, user$
+      )
+      .subscribe();
   }
 
   // Verify with recovery code (fallback for any authenticator)
+  // When a recovery code is consumed, Auth0 may return a replacement recovery_code
+  // in the response. Prompt the user to save it — losing the new code locks them out.
   verifyRecoveryCode(mfaToken: string, recoveryCode: string) {
-    this.auth.mfa.verify({ mfaToken, recoveryCode }).subscribe((tokens) => {
-      console.log('Access token:', tokens.access_token);
-    });
+    this.auth.mfa
+      .verify({ mfaToken, recoveryCode })
+      .pipe(
+        tap((tokens) => {
+          if (tokens.recovery_code) {
+            console.warn('Save your new recovery code:', tokens.recovery_code);
+          }
+        }),
+        switchMap(() => this.auth.getAccessTokenSilently()) // refresh isAuthenticated$, user$
+      )
+      .subscribe();
   }
 }
 ```

projects/auth0-angular/src/lib/auth.service.spec.ts

@@ -1566,6 +1566,30 @@ describe('AuthService', () => {
             },
           });
       });
+
+      it('should not update isAuthenticated$ or user$ after a successful verify', (done) => {
+        // verify() intentionally does not update Angular auth state — callers must
+        // follow up with getAccessTokenSilently() to reflect the new MFA session.
+        const service = createService();
+        let isAuthEmissions = 0;
+        let userEmissions = 0;
+
+        service.isAuthenticated$.subscribe(() => isAuthEmissions++);
+        service.user$.subscribe(() => userEmissions++);
+
+        loaded(service)
+          .pipe(
+            mergeMap(() =>
+              service.mfa.verify({ mfaToken: '__mfa_token__', otp: '123456' })
+            ),
+            delay(0)
+          )
+          .subscribe(() => {
+            expect(isAuthEmissions).toBe(1);
+            expect(userEmissions).toBe(1);
+            done();
+          });
+      });
     });
   });
 });