Skip to content

Commit

Permalink
fix(ui): Web recaptcha hover removed after use. (#8812)
Browse files Browse the repository at this point in the history
Fixes #4377

After showing a recaptcha in web for SMS login, the recaptcha icon
overlay persists on the app until it is reloaded, often blocking an
app's buttons and other interactive widgets. This adds removal of the
web UI element in the clear method, and ensures that clear is called on
any RecaptchaVerifier() objects created by flutterfire.
  • Loading branch information
aebrahim authored Jun 30, 2022
1 parent 159def6 commit 790e450
Show file tree
Hide file tree
Showing 3 changed files with 20 additions and 10 deletions.
14 changes: 9 additions & 5 deletions packages/firebase_auth/firebase_auth/lib/src/firebase_auth.dart
Original file line number Diff line number Diff line change
Expand Up @@ -604,12 +604,16 @@ class FirebaseAuth extends FirebasePluginPlatform {
RecaptchaVerifier? verifier,
]) async {
assert(phoneNumber.isNotEmpty);

// If we add a recaptcha to the page by creating a new instance, we must
// also clear that instance before proceeding.
bool mustClear = verifier == null;
verifier ??= RecaptchaVerifier();
return ConfirmationResult._(
this,
await _delegate.signInWithPhoneNumber(phoneNumber, verifier.delegate),
);
final result =
await _delegate.signInWithPhoneNumber(phoneNumber, verifier.delegate);
if (mustClear) {
verifier.clear();
}
return ConfirmationResult._(this, result);
}

/// Authenticates a Firebase client using a popup-based OAuth authentication
Expand Down
13 changes: 9 additions & 4 deletions packages/firebase_auth/firebase_auth/lib/src/user.dart
Original file line number Diff line number Diff line change
Expand Up @@ -259,11 +259,16 @@ class User {
RecaptchaVerifier? verifier,
]) async {
assert(phoneNumber.isNotEmpty);
// If we add a recaptcha to the page by creating a new instance, we must
// also clear that instance before proceeding.
bool mustClear = verifier == null;
verifier ??= RecaptchaVerifier();
return ConfirmationResult._(
_auth,
await _delegate.linkWithPhoneNumber(phoneNumber, verifier.delegate),
);
final result =
await _delegate.linkWithPhoneNumber(phoneNumber, verifier.delegate);
if (mustClear) {
verifier.clear();
}
return ConfirmationResult._(_auth, result);
}

/// Re-authenticates a user using a fresh credential.
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -117,7 +117,8 @@ class RecaptchaVerifierFactoryWeb extends RecaptchaVerifierFactoryPlatform {

@override
void clear() {
return _delegate.clear();
_delegate.clear();
window.document.getElementById(_kInvisibleElementId)?.remove();
}

@override
Expand Down

0 comments on commit 790e450

Please sign in to comment.