Adding a self test to check that web workers are supported

src/components/system-info/SystemInfo.tsx

@@ -1,55 +1,66 @@
 import {
-  Icon,
   ListItem,
   ListItemButton,
   ListItemIcon,
   ListItemText,
-  SvgIcon,
 } from '@suid/material';
-import { Component, createSignal, Show } from 'solid-js';
+import { Component, createEffect, createSignal, For, Show } from 'solid-js';
 import SystemSecurityUpdateWarningIcon from '@suid/icons-material/SystemSecurityUpdateWarning';
 import Dialog from '../dialog';
 import dispatch from '../../workers/dispatcher-main';
 
+const [error, setError] = createSignal<any[]>([]);
+
+export const reportError = (err: any) => {
+  setError([...error(), err]);
+};
+
 interface Props {}
 
 const SystemInfo: Component<Props> = (props) => {
   const [open, setOpen] = createSignal(false);
   const [settings, setSettings] = createSignal<any>();
   const [account, setAccount] = createSignal<any>();
-  const [error, setError] = createSignal<any>();
 
-  const openDialog = () => {
-    setOpen(true);
-    dispatch(
-      {
-        action: 'getSettings',
-      },
-      (error, result) => {
-        console.log({ caller: 'SystemInfo', error, result });
-        if (!!error) {
-          setError(error);
-        }
-        if (!!result) {
-          setSettings(result);
-          dispatch(
-            {
-              action: 'getAccount',
-              params: { id: settings().currentAccountId },
-            },
-            (error, result) => {
-              console.log({ caller: 'SystemInfo', error, result });
-              if (!!error) {
-                setError(error);
-              }
-              if (!!result) {
-                setAccount(result);
-              }
-            }
-          );
-        }
+  createEffect(() => {
+    if (error().length > 0 && !open()) {
+      openDialog();
+    }
+  });
+
+  const selfTest = async () => {
+    try {
+      const pong = await dispatch({
+        action: 'ping',
+        params: { what: 'ping' },
+      });
+      if (pong !== 'ping pong') {
+        throw new Error(
+          `web worker test error, received "${pong}" instead of expected "ping pong"`
+        );
       }
-    );
+    } catch (err) {
+      reportError(err);
+    }
+  };
+
+  selfTest();
+
+  const openDialog = async () => {
+    setOpen(true);
+    try {
+      const sets: any = await dispatch({
+        action: 'getSettings',
+      });
+      setSettings(sets);
+      const acc: any = await dispatch({
+        action: 'getAccount',
+        params: { id: settings().currentAccountId },
+      });
+      setAccount(acc);
+    } catch (err) {
+      reportError(err);
+    }
   };
 
   return (
@@ -77,6 +88,14 @@ const SystemInfo: Component<Props> = (props) => {
             <p>Remote DB user: {account()?.remoteDbUser}</p>
             <p>Remote DB server: {account()?.remoteDbServer}</p>
           </div>
+          <Show when={error().length > 0}>
+            <div>
+              <p>Errors:</p>
+              <ul>
+                <For each={error()}>{(item) => <li>{item.message}</li>}</For>
+              </ul>
+            </div>
+          </Show>
         </Dialog>
       </Show>
     </>

src/components/system-info/index.ts

@@ -0,0 +1 @@
+export { default, reportError } from './SystemInfo';

src/workers/dispatcher-worker.ts

@@ -27,7 +27,6 @@ import { deleteTrk, getTrk, putNewTrk } from '../db/trk';
 import { putTrkpt } from '../db/trkpt';
 import { getTrkseg, appendTrkpt } from '../db/trkseg';
 import { getWpt, putWpt, deleteWpt } from '../db/wpt';
-import { until } from '../lib/async-wait';
 
 //const self = globalThis as unknown as WorkerGlobalScope;
 
@@ -75,6 +74,8 @@ onmessage = async function (e) {
     putAccount,
     getCurrentAccount,
     putCurrentAccount,
+
+    ping: (params: any) => `${params.what} pong`,
   };
 
   //  console.log({ caller: 'dispatcher-worker / onmessage', e });