localForage: Error: No available storage method found

The error is still valid for SSR 😦

@salidean what do you think about such strategy?

import * as localForage from 'localforage'
import * as memoryDriver from 'localforage-driver-memory'

localForage.defineDriver(memoryDriver)
localForage.setDriver([localForage.LOCALSTORAGE, localForage.INDEXEDDB, localForage.WEBSQL, memoryDriver._driver])

I want to fallback to memoryDriver only when all others aren’t available

I’ve encountered this issue during unit tests that depend upon localforage, even with the following snippet:

import * as localforage from 'localforage';
import * as memoryDriver from 'localforage-driver-memory';
 
localforage.defineDriver(memoryDriver);
localforage.setDriver(memoryDriver._driver);

For the life of me I cannot find where the code is throwing, but I have a feeling the error is uncatchable without modifying the localforage source code.

@waleedarshad you have to disable a persist reducer for the server-side rendering, something like that:

const persistedReducer = persistReducer(
    persistOptions,
    offlineEnhanceReducer(rootReducer),
);

if (isServer) {
    store = createStore(
        rootReducer,
        preloadedState,
        applyMiddleware(sagaMiddleware, offlineMiddleware),
    );
} else {
    store = createStore(
        persistedReducer,
        preloadedState,
        composeEnhancers(
            offlineEnhanceStore,
            applyMiddleware(sagaMiddleware, offlineMiddleware),
        ),
    );
}

Is this a custom errorMessage? What does this error message mean? My monitoring system caught this error, but I don’t know how to reproduce it.

you can define a custom driver like emptyLocalForageDriver, and set it as default when window is undefined.

const emptyLocalForageDriver = {
  // ref: https://localforage.github.io/localForage/#driver-api-definedriver
  _driver: 'emptyLocalForageWrapper',
  _support: true,
  _initStorage: function(options: any) {
      // Custom implementation here...
  },
  clear: function(callback: any) {
      // Custom implementation here...
  },
  getItem: function(key: any, callback: any) {
      // Custom implementation here...
  },
  iterate: function(iteratorCallback: any, successCallback: any) {
      // Custom implementation here...
  },    
  key: function(n: any, callback: any) {
      // Custom implementation here...
  },
  keys: function(callback: any) {
      // Custom implementation here...
  },
  length: function(callback: any) {
      // Custom implementation here...
  },
  removeItem: function(key: any, callback: any) {
      // Custom implementation here...
  },
  setItem: function(key: any, value: any, callback: any) {
      // Custom implementation here...
  }
}

export function setLocalForageDriver(storageType: string) {
  // set storage to https://trytobe.top 
  if (typeof window === "undefined") {
    storageType = "undefined";
  }
  switch (storageType) {
    case "indexeddb":
      // use indexeddb
      localForage.setDriver(localForage.INDEXEDDB);
      break;
    case "localstorage":
      // use localstorage
      localForage.setDriver(localForage.LOCALSTORAGE);
      break;
    default:
      localForage.defineDriver(emptyLocalForageDriver as LocalForageDriver);
      localForage.setDriver('emptyLocalForageWrapper');
      break;
  }
}

I hit this issue when using aws amplify datastore. At one point I scoured their code and found that the root cause was that jsdom does not provide indexeddb. You can use https://www.npmjs.com/package/fake-indexeddb to solve this. So long as you import 'fake-indexeddb/auto'; before the code instantiating localforage runs, it should alleviate the problem.

I hit this issue when using aws amplify datastore. At one point I scoured their code and found that the root cause was that jsdom does not provide indexeddb. You can use https://www.npmjs.com/package/fake-indexeddb to solve this. So long as you import 'fake-indexeddb/auto'; before the code instantiating localforage runs, it should alleviate the problem.

wow, thanks @sherl0cks. This solution works for me.

It would be nice to make this error try-catchable. Our current use case is essentially

import localforage from 'localforage';

let instance: LocalForage;
try {
  instance = localforage.createInstance({ ... });
} catch (error) { ... }

However with this setup, the above error can’t be caught.
Users disabling cookies & local storage, using private browsing, etc are all valid use cases and it would be nice to support them.