Add error handler

src/utils/error-handler.ts

@@ -0,0 +1,45 @@
+export enum Severity {
+  INFO = 'info',
+  WARNING = 'warning',
+  ERROR = 'error',
+}
+
+export interface ErrorHandlerError {
+  severity: Severity;
+  message: string;
+}
+
+export type ErrorMetadata = { [key: string]: any };
+
+export class ErrorHandler {
+  private static readonly errors: Array<ErrorHandlerError> = [];
+  private static metadata: ErrorMetadata = {};
+  private static onErrorListeners: Array<
+    (error: ErrorHandlerError, metadata: ErrorMetadata) => void
+  > = [];
+
+  public static addException(exception: Error) {
+    ErrorHandler.addError(Severity.ERROR, exception.message);
+  }
+
+  public static addError(severity: Severity, message: string) {
+    ErrorHandler.errors.push({ severity, message });
+    ErrorHandler.onErrorListeners.forEach((listener) =>
+      listener({ severity, message }, ErrorHandler.metadata)
+    );
+  }
+
+  public static addMetadata(key: string, value: any) {
+    const serialized = {};
+    for (const k in value) {
+      serialized[k] = value[k];
+    }
+    ErrorHandler.metadata[key] = serialized;
+  }
+
+  public static addOnErrorListener(
+    listener: (error: ErrorHandlerError, metadata: ErrorMetadata) => void
+  ) {
+    ErrorHandler.onErrorListeners.push(listener);
+  }
+}

src/utils/graphics/initialize-gpu.ts

@@ -1,7 +1,9 @@
+import { ErrorHandler, Severity } from '../error-handler';
+
 export const initializeGPU = async (): Promise<GPUDevice> => {
   const gpu = navigator.gpu;
   if (!gpu) {
-    throw new Error('WebGPU is not supported');
+    throw new Error('WebGPU is not supported in your browser');
   }
 
   const adapter = await gpu.requestAdapter({
@@ -12,5 +14,15 @@ export const initializeGPU = async (): Promise<GPUDevice> => {
     throw new Error('Could not request adatper');
   }
 
-  return await adapter.requestDevice(); // could request more resources
+  ErrorHandler.addMetadata('adapter', await adapter.requestAdapterInfo());
+  ErrorHandler.addMetadata('features', adapter.features);
+  ErrorHandler.addMetadata('limits', adapter.limits);
+
+  const gpuDevice = await adapter.requestDevice(); // could request more resources
+
+  gpuDevice.addEventListener('uncapturederror', (event: GPUUncapturedErrorEvent) =>
+    ErrorHandler.addError(Severity.ERROR, event.error.message)
+  );
+
+  return gpuDevice;
 };

src/utils/graphics/smart-compile.ts

@@ -1,3 +1,5 @@
+import { ErrorHandler, Severity } from '../error-handler';
+
 export const smartCompile = (device: GPUDevice, ...code: Array<string>) => {
   const concatenated = code.join('\n\n');
 
@@ -5,17 +7,18 @@ export const smartCompile = (device: GPUDevice, ...code: Array<string>) => {
     code: concatenated,
   });
 
-  module
-    .getCompilationInfo()
-    .then((info) =>
-      info.messages.forEach((message) =>
-        console.warn(
-          message.type,
-          message.message,
-          concatenated.split('\n')[message.lineNum - 1]
-        )
+  module.getCompilationInfo().then((info) =>
+    info.messages.forEach((message) =>
+      ErrorHandler.addError(
+        {
+          info: Severity.INFO,
+          warning: Severity.WARNING,
+          error: Severity.ERROR,
+        }[message.type],
+        `${message.message}\n${concatenated.split('\n')[message.lineNum - 1]}`
       )
-    );
+    )
+  );
 
   return module;
 };