upgrade typescript to 4.5.5

I found one significant breaking change: caught exceptions are now
unknown rather than any. Rework the error handling a bit to match.

ui/package.json

@@ -21,8 +21,8 @@
     "react": "^17.0.1",
     "react-dom": "^17.0.1",
     "react-router-dom": "^6.2.1",
-    "react-scripts": "5.0.0",
-    "typescript": "^4.3.5"
+    "react-scripts": "^5.0.0",
+    "typescript": "4.5.5"
   },
   "scripts": {
     "start": "react-scripts start",

ui/src/Live/LiveCamera.tsx

@@ -121,11 +121,14 @@ class LiveCameraDriver {
     console.error(`${this.camera.shortName}: ws error`);
   };
 
-  onWsMessage = async (e: MessageEvent) => {
+  onWsMessage = async (e: MessageEvent<Blob>) => {
     let raw;
     try {
       raw = new Uint8Array(await e.data.arrayBuffer());
     } catch (e) {
+      if (!(e instanceof DOMException)) {
+        throw e;
+      }
       this.error(`error reading part: ${e.message}`);
       return;
     }
@@ -135,7 +138,7 @@ class LiveCameraDriver {
     }
     let result = parsePart(raw);
     if (result.status === "error") {
-      this.error("unparseable part");
+      this.error(`unparseable part: ${result.errorMessage}`);
       return;
     }
     const part = result.part;
@@ -223,6 +226,9 @@ class LiveCameraDriver {
     try {
       buf.srcBuf.appendBuffer(part.body);
     } catch (e) {
+      if (!(e instanceof DOMException)) {
+        throw e;
+      }
       // In particular, appendBuffer can throw QuotaExceededError.
       // <https://developers.google.com/web/updates/2017/10/quotaexceedederror>
       // tryTrimBuffer removes already-played stuff from the buffer to avoid

ui/src/api.ts

@@ -42,6 +42,9 @@ async function myfetch(
   try {
     response = await fetch(url, init);
   } catch (e) {
+    if (!(e instanceof DOMException)) {
+      throw e;
+    }
     if (e.name === "AbortError") {
       return { status: "aborted" };
     } else {
@@ -56,6 +59,9 @@ async function myfetch(
     try {
       text = await response.text();
     } catch (e) {
+      if (!(e instanceof DOMException)) {
+        throw e;
+      }
       console.warn(
         `${url}: ${response.status}: unable to read body: ${e.message}`
       );
@@ -105,6 +111,9 @@ export async function init(
   try {
     body = await fetchRes.response.arrayBuffer();
   } catch (e) {
+    if (!(e instanceof DOMException)) {
+      throw e;
+    }
     console.warn(`${url}: unable to read body: ${e.message}`);
     return {
       status: "error",
@@ -130,6 +139,9 @@ async function json<T>(
   try {
     body = await fetchRes.response.json();
   } catch (e) {
+    if (!(e instanceof DOMException)) {
+      throw e;
+    }
     console.warn(`${url}: unable to read body: ${e.message}`);
     return {
       status: "error",