bitwarden/browser
1
0
Fork 0
mirror of https://github.com/bitwarden/browser synced 2025-12-10 13:23:34 +00:00
Code Issues Releases Wiki Activity

fix(login): [PM-20174] Do not show validation errors on email input on LoginComponent

Browse Source 
* 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
1 changed files with 15 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

26
libs/auth/src/angular/login/login.component.ts
View File

@@ -400,12 +400,6 @@ export class LoginComponent implements OnInit, OnDestroy {
await this.router.navigate(["/login-with-device"]); 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> { protected async toggleLoginUiState(value: LoginUiState): Promise<void> {
this.loginUiState = value; 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) * Continue to the master password entry state (only if email is validated)
*/ */
protected async continue(): Promise<void> { protected async continue(): Promise<void> {
const isEmailValid = await this.emailIsValid(); const isEmailValid = this.validateEmail();
if (isEmailValid) { if (isEmailValid) {
await this.toggleLoginUiState(LoginUiState.MASTER_PASSWORD_ENTRY); await this.toggleLoginUiState(LoginUiState.MASTER_PASSWORD_ENTRY);
@@ -496,7 +490,7 @@ export class LoginComponent implements OnInit, OnDestroy {
*/ */
async handleSsoClick() { async handleSsoClick() {
// Make sure the email is valid // Make sure the email is valid
const isEmailValid = await this.emailIsValid(); const isEmailValid = this.validateEmail();
if (!isEmailValid) { if (!isEmailValid) {
return; 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. * Persist the entered email address and the user's choice to remember it to state.
*/ */
private async persistEmailIfValid(): Promise<void> { private async persistEmailIfValid(): Promise<void> {
if (await this.emailIsValid()) { if (this.formGroup.controls.email.valid) {
const email = this.formGroup.value.email; const email = this.formGroup.value.email;
const rememberEmail = this.formGroup.value.rememberEmail ?? false; const rememberEmail = this.formGroup.value.rememberEmail ?? false;
if (!email) { 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 * 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 * the user submits. This is because currently our validation errors are shown below the input fields, and
* displaying them causes the screen to "jump". * 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 * 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 * the user submits. This is because currently our validation errors are shown below the input fields, and
* displaying them causes the screen to "jump". * displaying them causes the screen to "jump".