fix: improve UVE Personalization error handling to show specific error messages (#34646)

[zJaaal]

Summary

Fixes the UVE Personalization error handling which was only showing one generic error message ("Personalization requires page content. Add some first"), making it extremely difficult to debug when different errors occurred.

Changes

• Enhanced error extraction: Added #getPersonalizeErrorDetail() method to extract meaningful error messages from HttpErrorResponse
• Multi-source error detection:
  • First checks error-message header for backend messages
  • Falls back to parsing error body (extracts message after colon prefix)
  • Returns null to use generic i18n message only when no specific error available
• Comprehensive test coverage: Added 3 test cases covering:
  • Error from error-message header
  • Error from response body with colon prefix
  • Error from response body without prefix

Why this matters

Previously, any Personalization creation error would only display "Personalization requires page content. Add some first", regardless of the actual problem. This made debugging:

• Backend validation errors
• Missing persona errors
• Network failures
• API parameter issues

Nearly impossible to troubleshoot without checking browser console or backend logs.

Example errors now properly shown:

• ✅ "Does not exists a Persona with the tag: nonexistent-persona"
• ✅ "Page parameter is missing"
• ✅ "Something went wrong" (generic backend errors)
• ✅ Falls back to i18n message only when no backend error available

Test plan

• Added test for error-message header extraction
• Added test for body error with colon prefix parsing
• Added test for body error without prefix
• All unit tests passing
• Pre-commit hooks (lint, format, SDK build) passed
• Manual testing: Trigger various Personalization errors and verify correct messages displayed

Related Issue

Fixes #34646

🤖 Generated with Claude Code

[Copilot]

Pull request overview

This PR improves error handling for UVE Personalization by extracting and displaying specific backend error messages instead of always showing a generic "Personalization requires page content" message. The implementation adds a new private method to extract error details from HTTP error responses, checking both the error-message header and the response body, with fallback to a localized message when no specific error is available.

Changes:

• Added #getPersonalizeErrorDetail() method to extract meaningful error messages from HttpErrorResponse objects
• Enhanced error handler to display backend-specific error messages for better debugging
• Added comprehensive test coverage for error extraction from headers and body

Reviewed changes

Copilot reviewed 2 out of 2 changed files in this pull request and generated 2 comments.

File	Description
dot-uve-toolbar.component.ts	Added error extraction method and updated error handler to use specific backend messages
dot-uve-toolbar.component.spec.ts	Added 3 test cases covering error-message header, body with colon prefix, and body without prefix

[Copilot]

The error parameter is typed as HttpErrorResponse, but RxJS error callbacks can emit any error type. The existing test at line 680 demonstrates this by passing a generic Error object. While the runtime behavior is correct (undefined checks cause it to return null), TypeScript should show a type error when passing non-HttpErrorResponse errors to this handler.

The error parameter on line 241 should be typed as unknown instead of HttpErrorResponse, and then use a type guard to check if it's an HttpErrorResponse before calling #getPersonalizeErrorDetail. For example:

error: (err: unknown) => {
    const detail = err instanceof HttpErrorResponse 
        ? this.#getPersonalizeErrorDetail(err)
        : null;
    const fallback = detail ?? this.#dotMessageService.get('uve.personalize.empty.page.error');
    // ... rest of error handling
}

This ensures type safety while maintaining backward compatibility with the existing test that passes a generic Error object.

Suggested change

	error: (err: HttpErrorResponse) => {
	const detail =
	this.#getPersonalizeErrorDetail(err) ??
	error: (err: unknown) => {
	const detail =
	(err instanceof HttpErrorResponse
	? this.#getPersonalizeErrorDetail(err)
	: null) ??

[Copilot]

If the error body contains only whitespace (e.g., error: { error: " " }), the method will return an empty string after trimming, which will be used as the error message instead of falling back to the i18n message. This would result in displaying an error toast with no message content.

The fix is to check if the trimmed result is empty before returning it:

if (typeof bodyError === 'string') {
    const trimmed = bodyError.trim();
    if (!trimmed) return null;
    const afterColon = trimmed.indexOf(': ');
    return afterColon >= 0 ? trimmed.slice(afterColon + 2).trim() : trimmed;
}

Or more concisely using the same pattern as the header check:

if (typeof bodyError === 'string') {
    const trimmed = bodyError.trim();
    if (trimmed) {
        const afterColon = trimmed.indexOf(': ');
        return afterColon >= 0 ? trimmed.slice(afterColon + 2).trim() : trimmed;
    }
}

Suggested change

	const afterColon = bodyError.indexOf(': ');
	return afterColon >= 0 ? bodyError.slice(afterColon + 2).trim() : bodyError.trim();
	const trimmed = bodyError.trim();
	if (trimmed) {
	const afterColon = trimmed.indexOf(': ');
	return afterColon >= 0 ? trimmed.slice(afterColon + 2).trim() : trimmed;
	}