Error thrown by an error http interceptor is garbled

44 views Asked by At

I have upgraded my angular app to ver 17. I have an error interceptor implemented like below (it was working OK in ver 16). I am entering wrong password in my login component to test the error handling. My problem is that when interceptor throws an error in return throwError(erro) I am getting in my error handler (the bottom part) message like this () => erro instead of the message erro itself (which in my case is Email, DOB or password is incorrect)

@Injectable()
export class ErrorInterceptor implements HttpInterceptor {
    constructor(private accountService: AccountService) { }

    intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
        return next.handle(request).pipe(catchError(err => {
            if ([401, 403].includes(err.status) && this.accountService.accountValue) {
                // auto logout if 401 or 403 response returned from api
                this.accountService.logout();
            }
            var erro = this.error(err);
            console.error("ErrorInterceptor: " + erro);
            return throwError(erro);
        }))
    }
    
    error(e: any): any {
        if (this.isPrimitive(e)) {
            return e;
        } else if (e.error) {
            // If e.error is an object error
            return this.error(e.error);
        } else if (e.message) {
            return e.message
        } else if (e.errorMessage) {
            return e.errorMessage
        } else if (e.title) {
            return e.title
        } else {
            return "Unknown Error";
        }
    }
    isPrimitive(test: any) {
        return test !== Object(test);
    }
}

My error handler in login component:

this.accountService.login(this.f['email'].value, this.f['password'].value, moment(this.f['dob'].value).format(Constants.dateFormat))
            .pipe(first())
            .subscribe({
                next: () => {
                    // get return url from query parameters or default to home page
                    const returnUrl = this.route.snapshot.queryParams['returnUrl'] || '/';
                    this.router.navigateByUrl(returnUrl);
                },
                error: error => {
                    this.alertService.error(error); <-- "() => erro"
                    this.loading = false;
                }
            });
0

There are 0 answers