fix: add arbitrary delay for retrieval of router object

src/index.ts

@@ -16,7 +16,8 @@ const initAsync = async () => {
 
 let tries = 0
 const waitForConnectionAsync = async () => {
-  if (!insomnia.connect()) {
+  const connectionIsUp = await insomnia.connect()
+  if (!connectionIsUp) {
     if (tries++ < 25) window.setTimeout(waitForConnectionAsync, 200)
     else console.error('[plugin-navigator]', 'cannot connect to Insomnia')
   } else await initAsync()

src/services/insomnia/connector/index.ts

@@ -2,10 +2,15 @@
 import { initRouter } from './refs-router'
 import { initEvents } from './refs-events'
 
-export const connect = (): boolean => {
+export const connect = async () => {
   initConnection()
-  if (!initRouter()) return false
+
+  const routerWasFound = await initRouter()
+  if (!routerWasFound) {
+    return false
+  }
+
   initEvents()
 
   return true
-}
+};

src/services/insomnia/connector/refs-router.ts

@@ -3,23 +3,41 @@
 
 let internalRouter: InsomniaRouter = {} as InsomniaRouter
 
-export const initRouter = (): boolean => {
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  const rootElement = document.querySelector('#root') as any
-  if (!rootElement) {
-    console.error('[plugin-navigator]', 'root element not found')
-    return false
-  }
-
-  const containerElement = Object.getOwnPropertyNames(rootElement).findLast(x => x.startsWith('__reactContainer'))
-  if (!containerElement) {
-    console.warn('[plugin-navigator]', 'store container element not found')
-    return false
-  }
-
-  internalRouter = rootElement[containerElement].memoizedState.element.props.router
-  return true
-}
+// A delay is needed to wait for the router to be initialized, this is a
+// workaround for the fact that the router is not available immediately after
+// the plugin is loaded.
+const ROUTER_INIT_DELAY = 1000;
+
+export const initRouter = (): Promise<boolean> => {
+  return new Promise((resolve) => {
+    setTimeout(() => {
+      // eslint-disable-next-line @typescript-eslint/no-explicit-any
+      const rootElement = document.querySelector('#root') as any
+      if (!rootElement) {
+        console.error('[plugin-navigator]', 'root element not found')
+        return resolve(false)
+      }
+
+      const containerElement = Object.getOwnPropertyNames(rootElement).findLast(
+        (x) => x.startsWith('__reactContainer')
+      );
+      if (!containerElement) {
+        console.warn('[plugin-navigator]', 'store container element not found')
+        return resolve(false)
+      }
+
+      const memoizedStateElement =
+        rootElement[containerElement].memoizedState.element;
+      if (!memoizedStateElement) {
+        console.warn('[plugin-navigator]', 'memoized state element not found')
+        return resolve(false)
+      }
+
+      internalRouter = memoizedStateElement.props.router;
+      return resolve(true)
+    }, ROUTER_INIT_DELAY)
+  });
+};
 
 export const getRouter = (): InsomniaRouter => internalRouter