Fix for service worker event handling errors (anoma#365)

Force-merging as I'm running solo for a couple weeks :)

apps/extension/src/Approvals/ApproveTx/ApproveTx.tsx

@@ -68,7 +68,6 @@ export const ApproveTx: React.FC<Props> = ({ setDetails }) => {
 
   const handleReject = useCallback(async (): Promise<void> => {
     try {
-      // TODO: use executeUntil here!
       if (msgId) {
         await requester.sendMessage(Ports.Background, new RejectTxMsg(msgId));
         // Close tab

apps/extension/src/Setup/AccountCreation/Steps/SeedPhrase/SeedPhrase.tsx

@@ -1,7 +1,6 @@
 import React, { useEffect, useState } from "react";
 
 import { Button, ButtonVariant, Toggle } from "@namada/components";
-import { executeUntil } from "@namada/utils";
 
 import { GenerateMnemonicMsg } from "background/keyring";
 import { ExtensionRequester } from "extension";
@@ -52,21 +51,14 @@ const SeedPhrase: React.FC<Props> = (props) => {
     // if a mnemonic was passed in we do not generate it again
     if (defaultSeedPhrase?.length && defaultSeedPhrase?.length > 0) return;
 
-    executeUntil(
-      async (): Promise<boolean> => {
-        try {
-          const words = await requester.sendMessage<GenerateMnemonicMsg>(
-            Ports.Background,
-            new GenerateMnemonicMsg(mnemonicLength)
-          );
-          setSeedPhrase(words);
-          return true;
-        } catch (_) {
-          return false;
-        }
-      },
-      { tries: 10, ms: 100 }
-    );
+    const setPhrase = async (): Promise<void> => {
+      const words = await requester.sendMessage<GenerateMnemonicMsg>(
+        Ports.Background,
+        new GenerateMnemonicMsg(mnemonicLength)
+      );
+      setSeedPhrase(words);
+    };
+    setPhrase();
   }, [mnemonicLength]);
 
   return (

apps/extension/src/Setup/AccountCreation/Steps/SeedPhraseConfirmation/SeedPhraseConfirmation.tsx

@@ -1,12 +1,14 @@
 import React, { useEffect, useState } from "react";
-import { Button, ButtonVariant, Input, InputVariants } from "@namada/components";
+import {
+  Button,
+  ButtonVariant,
+  Input,
+  InputVariants,
+} from "@namada/components";
 
 import {
-  BodyText,
   ButtonsContainer,
-  InputContainer,
   Header1,
-  Header5,
   SubViewContainer,
   UpperContentContainer,
   FormContainer,

apps/extension/src/Setup/Common/Completion/Completion.tsx

@@ -1,14 +1,9 @@
-import React, { useState } from "react";
+import React, { useEffect, useState } from "react";
 import { ExtensionRequester } from "extension";
 import browser from "webextension-polyfill";
 
 import { Button, ButtonVariant } from "@namada/components";
-import { useUntil } from "@namada/hooks";
-import {
-  CheckIsLockedMsg,
-  SaveMnemonicMsg,
-  ScanAccountsMsg,
-} from "background/keyring";
+import { SaveMnemonicMsg, ScanAccountsMsg } from "background/keyring";
 import { Ports } from "router";
 
 import {
@@ -41,21 +36,9 @@ const Completion: React.FC<Props> = (props) => {
     "Encrypting and storing mnemonic."
   );
 
-  useUntil(
-    {
-      predFn: async () => {
-        try {
-          //TODO: replace with something else
-          await requester.sendMessage<CheckIsLockedMsg>(
-            Ports.Background,
-            new CheckIsLockedMsg()
-          );
-          return true;
-        } catch (_) {
-          return false;
-        }
-      },
-      onSuccess: async () => {
+  useEffect(() => {
+    const saveMnemonic = async (): Promise<void> => {
+      try {
         await requester.sendMessage<SaveMnemonicMsg>(
           Ports.Background,
           new SaveMnemonicMsg(mnemonic, password, alias)
@@ -70,15 +53,13 @@ const Completion: React.FC<Props> = (props) => {
         }
         setMnemonicStatus(Status.Completed);
         setStatusInfo("Done!");
-      },
-      onFail: () => {
+      } catch (e) {
         setStatusInfo((s) => `Failed while "${s}"`);
         setMnemonicStatus(Status.Failed);
-      },
-    },
-    { tries: 10, ms: 100 },
-    []
-  );
+      }
+    };
+    saveMnemonic();
+  }, [alias, mnemonic, password, scanAccounts]);
 
   return (
     <SubViewContainer>

apps/extension/src/background/index.ts

@@ -50,24 +50,20 @@ const DEFAULT_URL =
   "https://d3brk13lbhxfdb.cloudfront.net/qc-testnet-5.1.025a61165acd05e";
 const { REACT_APP_NAMADA_URL = DEFAULT_URL } = process.env;
 
-(async function init() {
-  const { memory: cryptoMemory } = await initCrypto();
+const messenger = new ExtensionMessenger();
+const router = new ExtensionRouter(
+  ContentScriptEnv.produceEnv,
+  messenger,
+  extensionStore
+);
 
-  await initShared();
+router.addGuard(ExtensionGuards.checkOriginIsValid);
+router.addGuard(ExtensionGuards.checkMessageIsInternal);
 
-  const routerId = await getNamadaRouterId(extensionStore);
-  const messenger = new ExtensionMessenger();
-  const requester = new ExtensionRequester(messenger, routerId);
-
-  const router = new ExtensionRouter(
-    ContentScriptEnv.produceEnv,
-    messenger,
-    extensionStore
-  );
-  router.addGuard(ExtensionGuards.checkOriginIsValid);
-  router.addGuard(ExtensionGuards.checkMessageIsInternal);
+const init = new Promise<void>(async (resolve) => {
+  const { memory: cryptoMemory } = await initCrypto();
 
-  //TODO: Most likely sdk and query should be a one thing
+  await initShared();
   const sdk = new Sdk(REACT_APP_NAMADA_URL);
   const query = new Query(REACT_APP_NAMADA_URL);
 
@@ -83,6 +79,9 @@ const { REACT_APP_NAMADA_URL = DEFAULT_URL } = process.env;
     sdk.decode(data);
   }
 
+  const routerId = await getNamadaRouterId(extensionStore);
+  const requester = new ExtensionRequester(messenger, routerId);
+
   const chainsService = new ChainsService(store, [chains[defaultChainId]]);
   const keyRingService = new KeyRingService(
     store,
@@ -119,5 +118,7 @@ const { REACT_APP_NAMADA_URL = DEFAULT_URL } = process.env;
   initKeyRing(router, keyRingService);
   initLedger(router, ledgerService);
 
-  router.listen(Ports.Background);
-})();
+  resolve();
+});
+
+router.listen(Ports.Background, init);

apps/extension/src/background/keyring/service.ts

@@ -241,7 +241,7 @@ export class KeyRingService {
       const error = new Error(result.error?.message || "Error in web worker");
       error.stack = result.error.stack;
       throw error;
-    };
+    }
   }
 
   private async submitTransferFirefox(

apps/extension/src/content/index.ts

@@ -13,33 +13,37 @@ import { initEvents } from "./events";
 import manifest from "manifest/_base.json";
 import { ExtensionKVStore } from "@namada/storage";
 
-// Start proxying messages from Namada to InjectedNamada
-(async function init() {
-  const extensionStore = new ExtensionKVStore(KVPrefix.LocalStorage, {
-    get: browser.storage.local.get,
-    set: browser.storage.local.set,
-  });
+const extensionStore = new ExtensionKVStore(KVPrefix.LocalStorage, {
+  get: browser.storage.local.get,
+  set: browser.storage.local.set,
+});
+const messenger = new ExtensionMessenger();
+
+const router = new ExtensionRouter(
+  ContentScriptEnv.produceEnv,
+  messenger,
+  extensionStore
+);
+
+const init = new Promise<void>(async (resolve) => {
+  // Start proxying messages from Namada to InjectedNamada
   const routerId = await getNamadaRouterId(extensionStore);
-  const messenger = new ExtensionMessenger();
   Proxy.start(
     new Namada(manifest.version, new ExtensionRequester(messenger, routerId))
   );
+  resolve();
+});
 
-  const router = new ExtensionRouter(
-    ContentScriptEnv.produceEnv,
-    messenger,
-    extensionStore
-  );
-  initEvents(router);
-  router.listen(Ports.WebBrowser);
-  router.addGuard(ContentScriptGuards.checkMessageIsInternal);
+router.listen(Ports.WebBrowser, init);
+router.addGuard(ContentScriptGuards.checkMessageIsInternal);
+
+initEvents(router);
 
-  // Insert a script element to load injection script
-  const container = document.head || document.documentElement;
-  const scriptElement = document.createElement("script");
+// Insert a script element to load injection script
+const container = document.head || document.documentElement;
+const scriptElement = document.createElement("script");
 
-  scriptElement.src = browser.runtime.getURL("injected.namada.js");
-  scriptElement.type = "text/javascript";
-  container.insertBefore(scriptElement, container.children[0]);
-  scriptElement.remove();
-})();
+scriptElement.src = browser.runtime.getURL("injected.namada.js");
+scriptElement.type = "text/javascript";
+container.insertBefore(scriptElement, container.children[0]);
+scriptElement.remove();

apps/extension/src/extension/ExtensionRouter.ts

@@ -18,14 +18,16 @@ export class ExtensionRouter extends Router {
     super(envProducer);
   }
 
-  listen(port: string): void {
+  listen(port: string, initPromise: Promise<void>): void {
     if (!port) {
       throw new Error("Empty port");
     }
 
     console.info(`Listening on port ${port}`);
     this.port = port;
-    this.messenger.addListener(this.onMessage);
+    this.messenger.addListener(async (message, sender) =>
+      initPromise.then(() => this.onMessage(message, sender))
+    );
   }
 
   unlisten(): void {

apps/extension/src/router/Router.ts

@@ -31,7 +31,7 @@ export abstract class Router {
     this.guards.push(guard);
   }
 
-  public abstract listen(port: string): void;
+  public abstract listen(port: string, init: Promise<void>): void;
 
   public abstract unlisten(): void;
 

apps/extension/src/test/init.ts

@@ -123,12 +123,15 @@ export const init = async (): Promise<{
     ledgerService
   );
 
-  // Initialize messages and handlers
-  initChains(router, chainsService);
-  initKeyRing(router, keyRingService);
-  initApprovals(router, approvalsService);
-
-  router.listen(Ports.Background);
+  const init = new Promise<void>(async (resolve) => {
+    // Initialize messages and handlers
+    initChains(router, chainsService);
+    initKeyRing(router, keyRingService);
+    initApprovals(router, approvalsService);
+    resolve();
+  });
+
+  router.listen(Ports.Background, init);
 
   const version = "0.1.0";
   const namada = new Namada(version, requester);

packages/shared/lib/src/sdk/mod.rs

@@ -32,14 +32,6 @@ pub enum TxType {
     RevealPK = 5,
 }
 
-// Require that a public key is present
-fn validate_pk(pk: Option<PublicKey>) -> Result<PublicKey, JsError> {
-    match pk {
-        Some(v) => Ok(v),
-        None => Err(JsError::new("No public key was provided!")),
-    }
-}
-
 /// Represents the Sdk public API.
 #[wasm_bindgen]
 pub struct Sdk {