feat(login): implement full page reload on successful login and refactor navigation logic

This commit is contained in:
2026-07-07 12:51:17 -03:00
parent c54eb105cb
commit 5969818478
2 changed files with 12 additions and 3 deletions

View File

@@ -10,7 +10,7 @@ describe('LoginPageComponent', () => {
TestBed.resetTestingModule(); TestBed.resetTestingModule();
}); });
it('submits credentials and navigates to home on success', async () => { it('submits credentials and redirects to home with a full page reload on success', async () => {
const authService = { const authService = {
login: vi.fn().mockReturnValue( login: vi.fn().mockReturnValue(
of({ of({
@@ -30,6 +30,7 @@ describe('LoginPageComponent', () => {
const component = fixture.componentInstance as any; const component = fixture.componentInstance as any;
const router = TestBed.inject(Router); const router = TestBed.inject(Router);
const navigateSpy = vi.spyOn(router, 'navigate').mockResolvedValue(true); const navigateSpy = vi.spyOn(router, 'navigate').mockResolvedValue(true);
const redirectSpy = vi.spyOn(component, 'redirectToHome').mockImplementation(() => undefined);
component.form.setValue({ component.form.setValue({
email: 'ada@example.com', email: 'ada@example.com',
@@ -42,7 +43,8 @@ describe('LoginPageComponent', () => {
email: 'ada@example.com', email: 'ada@example.com',
password: 'secret123' password: 'secret123'
}); });
expect(navigateSpy).toHaveBeenCalledWith(['/']); expect(redirectSpy).toHaveBeenCalled();
expect(navigateSpy).not.toHaveBeenCalled();
}); });
it('surfaces backend login errors', async () => { it('surfaces backend login errors', async () => {

View File

@@ -1,3 +1,4 @@
import { DOCUMENT } from '@angular/common';
import { ChangeDetectionStrategy, Component, inject, signal } from '@angular/core'; import { ChangeDetectionStrategy, Component, inject, signal } from '@angular/core';
import { FormBuilder, ReactiveFormsModule, Validators } from '@angular/forms'; import { FormBuilder, ReactiveFormsModule, Validators } from '@angular/forms';
import { Router } from '@angular/router'; import { Router } from '@angular/router';
@@ -20,6 +21,7 @@ export class LoginPageComponent {
private readonly formBuilder = inject(FormBuilder); private readonly formBuilder = inject(FormBuilder);
private readonly router = inject(Router); private readonly router = inject(Router);
private readonly authService = inject(AuthService); private readonly authService = inject(AuthService);
private readonly document = inject(DOCUMENT);
private readonly submittedState = signal(false); private readonly submittedState = signal(false);
private readonly serverErrorState = signal<string | null>(null); private readonly serverErrorState = signal<string | null>(null);
@@ -51,7 +53,7 @@ export class LoginPageComponent {
this.authService.login(this.form.getRawValue()).subscribe({ this.authService.login(this.form.getRawValue()).subscribe({
next: () => { next: () => {
this.isSubmittingState.set(false); this.isSubmittingState.set(false);
void this.router.navigate(['/']); this.redirectToHome();
}, },
error: (error: unknown) => { error: (error: unknown) => {
this.isSubmittingState.set(false); this.isSubmittingState.set(false);
@@ -100,6 +102,11 @@ export class LoginPageComponent {
return 'El valor ingresado no es valido.'; return 'El valor ingresado no es valido.';
} }
protected redirectToHome(): void {
const homeUrl = this.router.serializeUrl(this.router.createUrlTree(['/']));
this.document.location.assign(homeUrl);
}
private resolveErrorMessage(error: unknown): string { private resolveErrorMessage(error: unknown): string {
const errorPayload = const errorPayload =
typeof error === 'object' && error !== null && 'error' in error typeof error === 'object' && error !== null && 'error' in error