fix: skip window.ipfs

package.json

@@ -35,7 +35,7 @@
     "internal-nav-helper": "^1.0.2",
     "ipfs-css": "^0.10.0",
     "ipfs-geoip": "^2.3.0",
-    "ipfs-redux-bundle": "^3.2.0",
+    "ipfs-redux-bundle": "^4.0.0",
     "ipfs-unixfs": "^0.1.15",
     "ipld": "^0.17.3",
     "ipld-explorer-components": "^1.0.0",

src/bundles/connected.js

@@ -3,7 +3,17 @@ import { createSelector } from 'redux-bundler'
 // We ask for the stats every few seconds, so that gives a good indication
 // that ipfs things are working (or not), without additional polling of the api.
 const connected = {
-  name: 'status',
+  name: 'connected',
+
+  reducer: (state = {}, action) => {
+    if (action.type === 'STATS_FETCH_FAILED') {
+      return { lastError: Date.now() }
+    }
+    return state
+  },
+
+  selectConnectedLastError: state => state.connected.lastError,
+
   selectIpfsConnected: createSelector(
     'selectIpfsReady',
     'selectStatsLastSuccess',

src/bundles/identity.js

@@ -0,0 +1,30 @@
+import { createAsyncResourceBundle, createSelector } from 'redux-bundler'
+
+const bundle = createAsyncResourceBundle({
+  name: 'identity',
+  actionBaseType: 'IDENTITY',
+  getPromise: ({ getIpfs }) => getIpfs().id(),
+  staleAfter: Infinity,
+  persist: false,
+  checkIfOnline: false
+})
+
+bundle.selectIdentityLastSuccess = state => state.identity.lastSuccess
+
+// Update identity after we (re)connect with ipfs
+bundle.reactIdentityFetch = createSelector(
+  'selectIpfsConnected',
+  'selectIdentityIsLoading',
+  'selectIdentityLastSuccess',
+  'selectConnectedLastError',
+  (connected, isLoading, idLastSuccess, connLastError) => {
+    console.log('reactIdentityFetch', { connected, isLoading, connLastError, idLastSuccess })
+    if (connected && !isLoading) {
+      if (!idLastSuccess || connLastError > idLastSuccess) {
+        return { actionCreator: 'doFetchIdentity' }
+      }
+    }
+  }
+)
+
+export default bundle

src/bundles/index.js

@@ -17,10 +17,14 @@ import statsBundle from './stats'
 import notifyBundle from './notify'
 import connectedBundle from './connected'
 import retryInitBundle from './retry-init'
+import identityBundle from './identity'
 
 export default composeBundles(
   appIdle({ idleTimeout: 5000 }),
-  ipfsBundle(),
+  ipfsBundle({
+    tryWindow: false
+  }),
+  identityBundle,
   navbarBundle,
   routesBundle,
   redirectsBundle,

src/components/provider-link/ProviderLink.js

@@ -9,6 +9,9 @@ const providers = {
   },
   'window.ipfs': {
     url: 'https://github.com/ipfs-shipyard/ipfs-companion'
+  },
+  'ipfs-companion': {
+    url: 'https://github.com/ipfs-shipyard/ipfs-companion'
   }
 }
 

src/status/NodeInfo.js

@@ -69,22 +69,22 @@ class NodeInfo extends React.Component {
       return obj[field]
     }
 
-    return 'Cannot access the API.'
+    return ''
   }
 
-  getVersion (ipfsIdentity) {
-    const raw = this.getField(ipfsIdentity, 'agentVersion')
+  getVersion (identity) {
+    const raw = this.getField(identity, 'agentVersion')
     return raw ? raw.split('/').join(' ') : ''
   }
 
   render () {
-    const { t, ipfsIdentity, ipfsProvider, ipfsApiAddress, peers } = this.props
+    const { t, identity, ipfsProvider, ipfsApiAddress, peers } = this.props
     const { downSpeed, upSpeed } = this.state
 
     let addresses = null
 
-    if (ipfsIdentity) {
-      addresses = [...new Set(ipfsIdentity.addresses)].sort().map(addr => <Address key={addr} value={addr} />)
+    if (identity) {
+      addresses = [...new Set(identity.addresses)].sort().map(addr => <Address key={addr} value={addr} />)
     }
 
     return (
@@ -94,7 +94,7 @@ class NodeInfo extends React.Component {
             <Title>{t('nodeInfo')}</Title>
             <Block>
               <Label>{t('peerId')}</Label>
-              <Value>{this.getField(ipfsIdentity, 'id')}</Value>
+              <Value>{this.getField(identity, 'id')}</Value>
             </Block>
             <Block>
               <Label>{t('api')}</Label>
@@ -110,7 +110,7 @@ class NodeInfo extends React.Component {
             <Block>
               <Label>{t('version')}</Label>
               <Value>
-                <VersionLink agentVersion={this.getField(ipfsIdentity, 'agentVersion')} />
+                <VersionLink agentVersion={this.getField(identity, 'agentVersion')} />
               </Value>
             </Block>
             <Block>
@@ -138,7 +138,7 @@ class NodeInfo extends React.Component {
           <div className='mt3'>
             <Block>
               <Label>{t('publicKey')}</Label>
-              <Value advanced>{this.getField(ipfsIdentity, 'publicKey')}</Value>
+              <Value advanced>{this.getField(identity, 'publicKey')}</Value>
             </Block>
             {addresses && addresses.length ? (
               <Block>
@@ -154,7 +154,7 @@ class NodeInfo extends React.Component {
 }
 
 export default connect(
-  'selectIpfsIdentity',
+  'selectIdentity',
   'selectIpfsProvider',
   'selectIpfsApiAddress',
   'selectPeers',

test/e2e/navigation.test.js

@@ -46,13 +46,14 @@ it('Navigation test: node running', async () => {
   await waitForTitle('Status - IPFS')
 }, ms.minutes(1))
 
-// Put a minimal mock IPFS instance on the window so we can check pages render.
+// Pretend to be IPFS companion so we can mock out ipfs responses
 // NOTE: this can get fancier as we test more nuances.
 // returns a promise.
 function addMockIpfs (page) {
   return page.evaluateOnNewDocument(mock => {
-    window.ipfs = {
+    const mockIpfs = {
       id: () => Promise.resolve({}),
+      get: () => Promise.resolve({}),
       files: {
         ls: () => Promise.resolve([]),
         stat: () => Promise.resolve({})
@@ -74,5 +75,18 @@ function addMockIpfs (page) {
         })
       }
     }
+    if (!window.chrome) {
+      // window.chrome seems not to be defined when tests are run headless.
+      window.chrome = {}
+    }
+    window.chrome.extension = {
+      getBackgroundPage () {
+        return {
+          ipfsCompanion: {
+            ipfs: mockIpfs
+          }
+        }
+      }
+    }
   })
 }