109 lines
2.9 KiB
TypeScript
109 lines
2.9 KiB
TypeScript
|
|
'use client';
|
||
|
|
|
||
|
|
import { clientLogger } from './client-logger';
|
||
|
|
|
||
|
|
/**
|
||
|
|
* Global error handler for unhandled errors and promise rejections
|
||
|
|
* Sets up event listeners for window errors and unhandled promise rejections
|
||
|
|
*/
|
||
|
|
|
||
|
|
interface ClientErrorReport {
|
||
|
|
message: string;
|
||
|
|
stack?: string;
|
||
|
|
url: string;
|
||
|
|
userAgent: string;
|
||
|
|
timestamp: string;
|
||
|
|
type: 'error' | 'unhandledrejection';
|
||
|
|
filename?: string;
|
||
|
|
lineno?: number;
|
||
|
|
colno?: number;
|
||
|
|
}
|
||
|
|
|
||
|
|
async function reportErrorToServer(errorReport: ClientErrorReport): Promise<void> {
|
||
|
|
try {
|
||
|
|
await fetch('/api/client-error', {
|
||
|
|
method: 'POST',
|
||
|
|
headers: { 'Content-Type': 'application/json' },
|
||
|
|
body: JSON.stringify(errorReport),
|
||
|
|
});
|
||
|
|
} catch (err) {
|
||
|
|
// Silently fail - don't want error reporting to cause more errors
|
||
|
|
console.error('Failed to report error to server:', err);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/**
|
||
|
|
* Initialize global error handlers
|
||
|
|
* Should be called once when the app starts
|
||
|
|
*/
|
||
|
|
export function initGlobalErrorHandlers(): void {
|
||
|
|
if (typeof window === 'undefined') {
|
||
|
|
return; // Only run in browser
|
||
|
|
}
|
||
|
|
|
||
|
|
// Handle uncaught errors
|
||
|
|
window.addEventListener('error', (event: ErrorEvent) => {
|
||
|
|
clientLogger.error('Uncaught error', event.error, {
|
||
|
|
message: event.message,
|
||
|
|
filename: event.filename,
|
||
|
|
lineno: event.lineno,
|
||
|
|
colno: event.colno,
|
||
|
|
});
|
||
|
|
|
||
|
|
// Report to server
|
||
|
|
reportErrorToServer({
|
||
|
|
message: event.message,
|
||
|
|
stack: event.error?.stack,
|
||
|
|
url: window.location.href,
|
||
|
|
userAgent: navigator.userAgent,
|
||
|
|
timestamp: new Date().toISOString(),
|
||
|
|
type: 'error',
|
||
|
|
filename: event.filename,
|
||
|
|
lineno: event.lineno,
|
||
|
|
colno: event.colno,
|
||
|
|
}).catch(() => {
|
||
|
|
// Ignore reporting errors
|
||
|
|
});
|
||
|
|
});
|
||
|
|
|
||
|
|
// Handle unhandled promise rejections
|
||
|
|
window.addEventListener('unhandledrejection', (event: PromiseRejectionEvent) => {
|
||
|
|
const reason = event.reason;
|
||
|
|
const message = reason instanceof Error ? reason.message : String(reason);
|
||
|
|
const stack = reason instanceof Error ? reason.stack : undefined;
|
||
|
|
|
||
|
|
clientLogger.error('Unhandled promise rejection', reason, {
|
||
|
|
message,
|
||
|
|
stack,
|
||
|
|
});
|
||
|
|
|
||
|
|
// Report to server
|
||
|
|
reportErrorToServer({
|
||
|
|
message: `Unhandled Promise Rejection: ${message}`,
|
||
|
|
stack,
|
||
|
|
url: window.location.href,
|
||
|
|
userAgent: navigator.userAgent,
|
||
|
|
timestamp: new Date().toISOString(),
|
||
|
|
type: 'unhandledrejection',
|
||
|
|
}).catch(() => {
|
||
|
|
// Ignore reporting errors
|
||
|
|
});
|
||
|
|
});
|
||
|
|
|
||
|
|
clientLogger.info('Global error handlers initialized');
|
||
|
|
}
|
||
|
|
|
||
|
|
/**
|
||
|
|
* Cleanup global error handlers
|
||
|
|
*/
|
||
|
|
export function cleanupGlobalErrorHandlers(): void {
|
||
|
|
if (typeof window === 'undefined') {
|
||
|
|
return;
|
||
|
|
}
|
||
|
|
|
||
|
|
// Remove event listeners
|
||
|
|
// Note: We can't remove the exact listeners without keeping references
|
||
|
|
// This is mainly for completeness, in practice these stay for the lifetime of the app
|
||
|
|
clientLogger.info('Global error handlers cleanup requested');
|
||
|
|
}
|