fix: dom-exception on access to localStorage (#999)

* fix(dom-exception): delays access to localStorage to async api

* fix(dom-exception): memoize storage compution

packages/cache-browser-local-storage/src/__tests__/unit/browser-local-storage-cache.test.ts

@@ -79,7 +79,37 @@ describe('browser local storage cache', () => {
     expect(localStorage.length).toBe(0);
   });
 
-  it('do throws localstorage related exceptions', async () => {
+  it('do throws localstorage exceptions on access', async () => {
+    const message =
+      "Failed to read the 'localStorage' property from 'Window': Access is denied for this document.";
+
+    const cache = createBrowserLocalStorageCache(
+      new Proxy(
+        { key: 'foo' },
+        {
+          get(_, key) {
+            if (key === 'key') {
+              return 'foo';
+            }
+
+            // Simulates a window.localStorage access.
+            throw new DOMException(message);
+          },
+        }
+      )
+    );
+    const key = { foo: 'bar' };
+    const value = 'foo';
+    const fallback = 'bar';
+
+    await expect(cache.delete(key)).rejects.toEqual(new DOMException(message));
+    await expect(cache.set(key, value)).rejects.toEqual(new DOMException(message));
+    await expect(cache.get(key, () => Promise.resolve(fallback))).rejects.toEqual(
+      new DOMException(message)
+    );
+  });
+
+  it('do throws localstorage exceptions after access', async () => {
     const cache = createBrowserLocalStorageCache({
       key: version,
       localStorage: notAvailableStorage,

packages/cache-browser-local-storage/src/createBrowserLocalStorageCache.ts

@@ -3,11 +3,20 @@ import { Cache, CacheEvents } from '@algolia/cache-common';
 import { BrowserLocalStorageOptions } from '.';
 
 export function createBrowserLocalStorageCache(options: BrowserLocalStorageOptions): Cache {
-  const storage = options.localStorage || window.localStorage;
   const namespaceKey = `algoliasearch-client-js-${options.key}`;
 
+  // eslint-disable-next-line functional/no-let
+  let storage: Storage;
+  const getStorage = () => {
+    if (storage === undefined) {
+      storage = options.localStorage || window.localStorage;
+    }
+
+    return storage;
+  };
+
   const getNamespace = <TValue>(): Record<string, TValue> => {
-    return JSON.parse(storage.getItem(namespaceKey) || '{}');
+    return JSON.parse(getStorage().getItem(namespaceKey) || '{}');
   };
 
   return {
@@ -38,7 +47,7 @@ export function createBrowserLocalStorageCache(options: BrowserLocalStorageOptio
         // eslint-disable-next-line functional/immutable-data
         namespace[JSON.stringify(key)] = value;
 
-        storage.setItem(namespaceKey, JSON.stringify(namespace));
+        getStorage().setItem(namespaceKey, JSON.stringify(namespace));
 
         return value;
       });
@@ -51,13 +60,13 @@ export function createBrowserLocalStorageCache(options: BrowserLocalStorageOptio
         // eslint-disable-next-line functional/immutable-data
         delete namespace[JSON.stringify(key)];
 
-        storage.setItem(namespaceKey, JSON.stringify(namespace));
+        getStorage().setItem(namespaceKey, JSON.stringify(namespace));
       });
     },
 
     clear(): Readonly<Promise<void>> {
       return Promise.resolve().then(() => {
-        storage.removeItem(namespaceKey);
+        getStorage().removeItem(namespaceKey);
       });
     },
   };