Let bridge module handle timeout

ext/src/lib/bridge.ts

@@ -14,6 +14,8 @@ import { ReceiverSelectionCast
        , ReceiverSelectionStop } from "../background/receiverSelector/ReceiverSelector";
 
 
+export const BRIDGE_TIMEOUT = 500;
+
 async function connect (): Promise<Port> {
     const applicationName = await options.get("bridgeApplicationName");
     const bridgePort = nativeMessaging.connectNative(applicationName) as
@@ -42,14 +44,22 @@ export interface BridgeInfo {
     isVersionNewer: boolean;
 }
 
-async function getInfo (): Promise<BridgeInfo> {
+export class BridgeConnectionError extends Error {}
+export class BridgeTimedOutError extends Error {}
+
+const getInfo = () => new Promise<BridgeInfo>(async (resolve, reject) => {
     const applicationName = await options.get("bridgeApplicationName");
     if (!applicationName) {
-        throw logger.error("Bridge application name not found.");
+        reject(logger.error("Bridge application name not found."));
+        return;
     }
 
-    let applicationVersion: string;
+    const bridgeTimeoutId = setTimeout(() => {
+        logger.error("Bridge timed out.");
+        reject(new BridgeTimedOutError());
+    }, BRIDGE_TIMEOUT);
 
+    let applicationVersion: string;
     try {
         const { version } = browser.runtime.getManifest();
 
@@ -58,9 +68,15 @@ async function getInfo (): Promise<BridgeInfo> {
               , { subject: "bridge:/getInfo"
                 , data: version });
     } catch (err) {
-        throw logger.error("Failed to connect to bridge application");
+        logger.error("Bridge connection failed.");
+        reject(new BridgeConnectionError());
+        clearTimeout(bridgeTimeoutId);
+
+        return;
     }
 
+    clearTimeout(bridgeTimeoutId);
+
     /**
      * If the target version is above 0.x.x range, API is stable
      * and versions with minor or patch level changes should be
@@ -83,7 +99,7 @@ async function getInfo (): Promise<BridgeInfo> {
                     : "Try updating the extension to the latest version"}`);
     }
 
-    return {
+    resolve({
         name: applicationName
       , version: applicationVersion
       , expectedVersion: APPLICATION_VERSION
@@ -93,9 +109,8 @@ async function getInfo (): Promise<BridgeInfo> {
       , isVersionCompatible
       , isVersionOlder
       , isVersionNewer
-    };
-}
-
+    });
+});
 
 export default {
     connect

ext/src/ui/options/index.tsx

@@ -9,7 +9,7 @@ import defaultOptions from "../../defaultOptions";
 import Bridge from "./Bridge";
 import EditableList from "./EditableList";
 
-import bridge, { BridgeInfo } from "../../lib/bridge";
+import bridge, { BridgeInfo, BridgeTimedOutError } from "../../lib/bridge";
 import logger from "../../lib/logger";
 import options, { Options } from "../../lib/options";
 import { REMOTE_MATCH_PATTERN_REGEX } from "../../lib/utils";
@@ -149,13 +149,6 @@ class OptionsApp extends Component<{}, OptionsAppState> {
           , platform: (await browser.runtime.getPlatformInfo()).os
         });
 
-        const bridgeTimeoutId = setTimeout(() => {
-            this.setState({
-                bridgeLoading: false
-              , bridgeLoadingTimedOut: true
-            });
-        }, 500);
-
         try {
             const bridgeInfo = await bridge.getInfo();
 
@@ -163,15 +156,20 @@ class OptionsApp extends Component<{}, OptionsAppState> {
                 bridgeInfo
               , bridgeLoading: false
             });
-        } catch {
+        } catch (err) {
             logger.error("Failed to fetch bridge/platform info.");
 
-            this.setState({
-                bridgeLoading: false
-            });
+            if (err instanceof BridgeTimedOutError) {
+                this.setState({
+                    bridgeLoading: false
+                  , bridgeLoadingTimedOut: true
+                });
+            } else {
+                this.setState({
+                    bridgeLoading: false
+                });
+            }
         }
-
-        clearTimeout(bridgeTimeoutId);
     }
 
     public render () {

ext/src/ui/options/styles/index.css

@@ -135,6 +135,9 @@ button.ghost:not(:hover) {
     flex-direction: row;
     gap: 20px;
 }
+.bridge__info--timed-out .bridge__status-title {
+    font-size: 1.75em;
+}
 
 .bridge__status-title {
     margin: initial;