mirror of
https://github.com/bitwarden/browser
synced 2025-12-06 00:13:28 +00:00
fix(login): [PM-20174] Do not show validation errors on email input on LoginComponent
* Do not show validation errors on input * Removed one-line function. * Removed awaits
This commit is contained in:
@@ -400,12 +400,6 @@ export class LoginComponent implements OnInit, OnDestroy {
|
||||
await this.router.navigate(["/login-with-device"]);
|
||||
}
|
||||
|
||||
protected async emailIsValid(): Promise<boolean> {
|
||||
this.formGroup.controls.email.markAsTouched();
|
||||
this.formGroup.controls.email.updateValueAndValidity({ onlySelf: true, emitEvent: true });
|
||||
return this.formGroup.controls.email.valid;
|
||||
}
|
||||
|
||||
protected async toggleLoginUiState(value: LoginUiState): Promise<void> {
|
||||
this.loginUiState = value;
|
||||
|
||||
@@ -474,7 +468,7 @@ export class LoginComponent implements OnInit, OnDestroy {
|
||||
* Continue to the master password entry state (only if email is validated)
|
||||
*/
|
||||
protected async continue(): Promise<void> {
|
||||
const isEmailValid = await this.emailIsValid();
|
||||
const isEmailValid = this.validateEmail();
|
||||
|
||||
if (isEmailValid) {
|
||||
await this.toggleLoginUiState(LoginUiState.MASTER_PASSWORD_ENTRY);
|
||||
@@ -496,7 +490,7 @@ export class LoginComponent implements OnInit, OnDestroy {
|
||||
*/
|
||||
async handleSsoClick() {
|
||||
// Make sure the email is valid
|
||||
const isEmailValid = await this.emailIsValid();
|
||||
const isEmailValid = this.validateEmail();
|
||||
if (!isEmailValid) {
|
||||
return;
|
||||
}
|
||||
@@ -594,11 +588,21 @@ export class LoginComponent implements OnInit, OnDestroy {
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* Validates the email and displays any validation errors.
|
||||
* @returns true if the email is valid, false otherwise.
|
||||
*/
|
||||
protected validateEmail(): boolean {
|
||||
this.formGroup.controls.email.markAsTouched();
|
||||
this.formGroup.controls.email.updateValueAndValidity({ onlySelf: true, emitEvent: true });
|
||||
return this.formGroup.controls.email.valid;
|
||||
}
|
||||
|
||||
/**
|
||||
* Persist the entered email address and the user's choice to remember it to state.
|
||||
*/
|
||||
private async persistEmailIfValid(): Promise<void> {
|
||||
if (await this.emailIsValid()) {
|
||||
if (this.formGroup.controls.email.valid) {
|
||||
const email = this.formGroup.value.email;
|
||||
const rememberEmail = this.formGroup.value.rememberEmail ?? false;
|
||||
if (!email) {
|
||||
@@ -613,7 +617,7 @@ export class LoginComponent implements OnInit, OnDestroy {
|
||||
}
|
||||
|
||||
/**
|
||||
* Set the email value from the input field.
|
||||
* Set the email value from the input field and persists to state if valid.
|
||||
* We only update the form controls onSubmit instead of onBlur because we don't want to show validation errors until
|
||||
* the user submits. This is because currently our validation errors are shown below the input fields, and
|
||||
* displaying them causes the screen to "jump".
|
||||
@@ -626,7 +630,7 @@ export class LoginComponent implements OnInit, OnDestroy {
|
||||
}
|
||||
|
||||
/**
|
||||
* Set the Remember Email value from the input field.
|
||||
* Set the Remember Email value from the input field and persists to state if valid.
|
||||
* We only update the form controls onSubmit instead of onBlur because we don't want to show validation errors until
|
||||
* the user submits. This is because currently our validation errors are shown below the input fields, and
|
||||
* displaying them causes the screen to "jump".
|
||||
|
||||
Reference in New Issue
Block a user