add a debug mode

koddsson · Nov 9, 2023 · bbd3859 · bbd3859
1 parent 8cda9f5
commit bbd3859
Show file tree

Hide file tree

Showing 2 changed files with 34 additions and 1 deletion.
diff --git a/index.html b/index.html
@@ -9,8 +9,11 @@
     <link rel="manifest" href="/public/manifest.webmanifest">
 
     <meta name="viewport" content="width=device-width, initial-scale=1" />
+
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@shoelace-style/[email protected]/cdn/themes/light.css" />
+    <script type="module" src="https://cdn.jsdelivr.net/npm/@shoelace-style/[email protected]/cdn/components/alert/alert.js"></script>
 
-    <script async type="module" src="./src/js/index.ts"></script>
+    <script defer type="module" src="./src/js/index.ts"></script>
     <link rel="stylesheet" href="./dist/index.css" />
   </head>
   <body>

diff --git a/src/js/index.ts b/src/js/index.ts
@@ -129,5 +129,35 @@ async function ready(): Promise<void> {
   })
 }
 
+// Custom function to emit toast notifications
+//
+// API Documentation: https://shoelace.style/components/alert/
+function notify(message: string, {variant = 'warning', icon = 'exclamation-triangle', duration = 3000} = {}) {
+  const alert = Object.assign(document.createElement('sl-alert'), {
+    variant,
+    closable: true,
+    duration,
+    innerHTML: `
+        <sl-icon name="${icon}" slot="icon"></sl-icon>
+        ${message}
+      `,
+  })
+
+  document.body.append(alert)
+  // @ts-ignore
+  return alert.toast()
+}
+
+if (new URL(window.location.toString(), window.location.origin).searchParams.get('debug') === 'true') {
+  window.addEventListener('unhandledrejection', event => {
+    notify(`[unhandledrejection]: ${event.reason}`)
+  })
+  window.addEventListener('error', event => {
+    notify(`[error]: ${event.type}: ${event.message}\n`, {duration: Infinity})
+  })
+}
+
 await ready()
 fetchSubscriptions()
+
+throw new Error('foobar')