Add timeout to IPC client.

Author: RubenVerborgh

popup-app/components/IdpSelect.js

@@ -6,12 +6,6 @@ import { ipcStorage } from '../../src/storage'
 
 import './IdpSelect.css'
 
-const timeout = (promise, ms) =>
-  Promise.race([
-    promise,
-    new Promise((resolve, reject) => setTimeout(() => resolve(null), ms))
-  ])
-
 class IdpSelect extends React.Component {
   state = {
     enteringCustomIdp: false,
@@ -42,20 +36,8 @@ class IdpSelect extends React.Component {
       return
     }
     const client = new Client(window.opener, appOrigin)
-    let loginOptions = await timeout(client.request('getLoginOptions'), 2000)
-    if (!loginOptions) {
-      console.warn(
-        'Cannot log in - have not yet received loginOptions from parent window'
-      )
-      this.setState({
-        error:
-          "Couldn't find the application window.  " +
-          'Try closing this popup window and logging in again.'
-      })
-      return
-    }
-    loginOptions = {
-      ...loginOptions,
+    const loginOptions = {
+      ...(await client.request('getLoginOptions')),
       storage: ipcStorage(client)
     }
     await auth.login(idp.url, loginOptions)

popup-app/index.js

@@ -24,35 +24,42 @@ const defaultIdps = [
   }
 ]
 
-findAppOrigin().then(appOrigin => {
-  const baseUrl = window.location.href.replace(/(\/\/[^/]*\/).*/, '$1')
-  const host = baseUrl.replace(/^[^:]+:|\//g, '')
-  const appName = process.env.APP_NAME.trim() || host
+findAppOrigin()
+  .then(appOrigin => {
+    const baseUrl = window.location.href.replace(/(\/\/[^/]*\/).*/, '$1')
+    const host = baseUrl.replace(/^[^:]+:|\//g, '')
+    const appName = process.env.APP_NAME.trim() || host
 
-  let element
-  if (!appOrigin) {
-    element = <NoParent appName={appName} />
-  } else if (window.location.hash) {
-    element = (
-      <IdpCallback
-        appOrigin={appOrigin}
-        afterLoggedIn={() => setTimeout(window.close, 750)}
-      />
-    )
-  } else {
-    const idps = [...defaultIdps]
-    if (!idps.some(idp => idp.url === baseUrl)) {
-      idps.unshift({
-        displayName: host,
-        url: baseUrl,
-        iconUrl: baseUrl + 'favicon.ico'
-      })
+    let element
+    if (!appOrigin) {
+      element = <NoParent appName={appName} />
+    } else if (window.location.hash) {
+      element = (
+        <IdpCallback
+          appOrigin={appOrigin}
+          afterLoggedIn={() => setTimeout(window.close, 750)}
+        />
+      )
+    } else {
+      const idps = [...defaultIdps]
+      if (!idps.some(idp => idp.url === baseUrl)) {
+        idps.unshift({
+          displayName: host,
+          url: baseUrl,
+          iconUrl: baseUrl + 'favicon.ico'
+        })
+      }
+      element = (
+        <IdpSelect idps={idps} appOrigin={appOrigin} appName={appName} />
+      )
     }
-    element = <IdpSelect idps={idps} appOrigin={appOrigin} appName={appName} />
-  }
 
-  ReactDOM.render(element, document.getElementById('app-container'))
-})
+    ReactDOM.render(element, document.getElementById('app-container'))
+  })
+  .catch(error => {
+    window.alert(error)
+    window.close()
+  })
 
 async function findAppOrigin() {
   if (!window.opener) {

src/ipc.js

@@ -93,15 +93,25 @@ export class Client {
     )
 
     // Create a promise that resolves to the request's return value
-    return new Promise(resolve => {
+    return new Promise((resolve, reject) => {
+      // Listen for responses to the request
+      window.addEventListener('message', responseListener)
+
+      // Cancel if the response takes too long
+      const timeout = setTimeout(() => {
+        reject(new Error('Could not connect to main window.'))
+        window.removeEventListener('message', responseListener)
+      }, 2000)
+
+      // Processes a possible response to the request
       function responseListener({ data }) {
         const resp = data && data[NAMESPACE]
         if (resp && resp.id === id && resp.hasOwnProperty('ret')) {
           resolve(resp.ret)
+          clearTimeout(timeout)
           window.removeEventListener('message', responseListener)
         }
       }
-      window.addEventListener('message', responseListener)
     })
   }
 }