1
0
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:
Todd Martin
2025-04-14 15:55:01 -04:00
committed by GitHub
parent 95ea1b22ae
commit 356a20a4bc

View File

@@ -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".