Normalize error-toast title in unifyErrorEvent

Derive the display title once in unifyErrorEvent — Error.toString(), which
keeps the error type (e.g. "TypeError: …") and drops the browser's
"Uncaught" prefix — instead of re-deriving it in processErrorIntoDetails.
Consistent across thrown Errors, ErrorEvents, and promise rejections, and it
keeps the type visible (the earlier event.error.message dropped it entirely
once the stack header was stripped from the detail).

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>

Author: myieye

frontend/viewer/src/lib/errors/global-errors.test.ts

@@ -1,6 +1,6 @@
 import {describe, expect, it} from 'vitest';
 
-import {processErrorIntoDetails} from './global-errors';
+import {processErrorIntoDetails, unifyErrorEvent} from './global-errors';
 
 describe('processErrorIntoDetails', () => {
   it('splits a .NET error at the first stack frame', () => {
@@ -38,13 +38,43 @@ describe('processErrorIntoDetails', () => {
     expect(detail).toBeUndefined();
   });
 
-  it('does not repeat a JS Error message in both title and detail', () => {
+  it('shows frames-only detail for a JS error, not repeating the title', () => {
     const error = new Error('boom');
 
-    const {message: title, detail} = processErrorIntoDetails({message: 'Uncaught Error: boom', error});
+    const {message: title, detail} = processErrorIntoDetails(unifyErrorEvent(error));
 
-    expect(title).toBe('boom');
+    expect(title).toBe('Error: boom');
     expect(detail).not.toContain('boom');
     expect(detail).toContain('at ');
   });
 });
+
+describe('unifyErrorEvent', () => {
+  it('uses Error.toString() (type kept, no "Uncaught" prefix) for an ErrorEvent with an error', () => {
+    const error = new TypeError('x is not a function');
+    const event = {message: 'Uncaught TypeError: x is not a function', error, filename: 'f', lineno: 1, colno: 2};
+
+    const unified = unifyErrorEvent(event as unknown as ErrorEvent);
+
+    expect(unified.message).toBe('TypeError: x is not a function');
+    expect(unified.error).toBe(error);
+  });
+
+  it('uses Error.toString() for a rejected Error reason', () => {
+    const error = new TypeError('x is not a function');
+
+    const unified = unifyErrorEvent({reason: error} as unknown as PromiseRejectionEvent);
+
+    expect(unified.message).toBe('TypeError: x is not a function');
+    expect(unified.error).toBe(error);
+  });
+
+  it('falls back to the event message for an ErrorEvent without an error object', () => {
+    const event = {message: 'Script error.', error: null, filename: '', lineno: 0, colno: 0};
+
+    const unified = unifyErrorEvent(event as unknown as ErrorEvent);
+
+    expect(unified.message).toBe('Script error.');
+    expect(unified.error).toBeNull();
+  });
+});

frontend/viewer/src/lib/errors/global-errors.ts

@@ -10,15 +10,17 @@ type UnifiedErrorEvent = {
   at?: string;
 }
 
-function unifyErrorEvent(event: ErrorEvent | PromiseRejectionEvent | Error): UnifiedErrorEvent {
+// message is normalized here to a display-ready title so consumers don't each re-derive one. For any Error we
+// use toString() ("TypeError: x", not the bare "x") to keep the type, and drop the browser's "Uncaught" prefix.
+export function unifyErrorEvent(event: ErrorEvent | PromiseRejectionEvent | Error): UnifiedErrorEvent {
   if (event instanceof Error) {
-    return { message: event.message, error: event };
+    return { message: event.toString(), error: event };
   } else if ('message' in event) {
-    return { message: event.message, error: event.error, at: `${event.filename}:${event.lineno}:${event.colno}` };
+    return { message: event.error instanceof Error ? event.error.toString() : event.message, error: event.error, at: `${event.filename}:${event.lineno}:${event.colno}` };
   } else if (typeof event.reason === 'string') {
     return { message: event.reason, error: null };
   } else if (event.reason instanceof Error) {
-    return { message: event.reason.message, error: event.reason };
+    return { message: event.reason.toString(), error: event.reason };
   } else {
     return { message: 'Unknown error', error: event.reason };
   }
@@ -50,9 +52,9 @@ export function processErrorIntoDetails(event: UnifiedErrorEvent): {message: str
   const message = event.message;
   const match = dotnetErrorRegex.exec(message);
   if (match) return {message: match[1].trim(), detail: message.substring(match[1].length).trim()};
-  // A JS Error's stack repeats the message on its first line(s); use the prefix-free error message as the
-  // title and just the frames as the detail, so the message isn't shown in both slots.
-  else if (event.error instanceof Error) return {message: event.error.message || message, detail: stackFrames(event.error)};
+  // message is already the display title (see unifyErrorEvent); attach just the stack frames as detail —
+  // stackFrames drops the leading "Error: <message>" header so the message isn't shown in both slots.
+  else if (event.error instanceof Error) return {message, detail: stackFrames(event.error)};
   else return {message};
 }