fix(storage): caught DOMException accessing storage (vitest-dev#1124)

Co-authored-by: Anthony Fu <anthonyfu117@hotmail.com>
chaii3 · Jan 5, 2022 · 77fe0fb · 77fe0fb
1 parent 247cc73
commit 77fe0fb
Show file tree

Hide file tree

Showing 3 changed files with 25 additions and 7 deletions.
diff --git a/packages/core/useColorMode/index.ts b/packages/core/useColorMode/index.ts
@@ -73,7 +73,7 @@ export function useColorMode<T extends string = BasicColorSchema>(options: UseCo
     selector = 'html',
     attribute = 'class',
     window = defaultWindow,
-    storage = getSSRHandler('getDefaultStorage', () => defaultWindow?.localStorage)(),
+    storage,
     storageKey = 'vueuse-color-scheme',
     listenToStorageChanges = true,
     storageRef,

diff --git a/packages/core/useStorage/index.ts b/packages/core/useStorage/index.ts
@@ -110,7 +110,7 @@ export function useStorage<T = unknown> (key: string, initialValue: MaybeRef<nul
 export function useStorage<T extends(string|number|boolean|object|null)> (
   key: string,
   initialValue: MaybeRef<T>,
-  storage: StorageLike | undefined = getSSRHandler('getDefaultStorage', () => defaultWindow?.localStorage)(),
+  storage: StorageLike | undefined,
   options: StorageOptions<T> = {},
 ): RemovableRef<T> {
   const {
@@ -132,6 +132,15 @@ export function useStorage<T extends(string|number|boolean|object|null)> (
   const data = (shallow ? shallowRef : ref)(initialValue) as Ref<T>
   const serializer = options.serializer ?? StorageSerializers[type]
 
+  if (!storage) {
+    try {
+      storage = getSSRHandler('getDefaultStorage', () => defaultWindow?.localStorage)()
+    }
+    catch (e) {
+      onError(e)
+    }
+  }
+
   function read(event?: StorageEvent) {
     if (!storage || (event && event.key !== key))
       return
@@ -166,9 +175,9 @@ export function useStorage<T extends(string|number|boolean|object|null)> (
       () => {
         try {
           if (data.value == null)
-            storage.removeItem(key)
+            storage!.removeItem(key)
           else
-            storage.setItem(key, serializer.write(data.value))
+            storage!.setItem(key, serializer.write(data.value))
         }
         catch (e) {
           onError(e)

diff --git a/packages/core/useStorageAsync/index.ts b/packages/core/useStorageAsync/index.ts
@@ -35,7 +35,7 @@ export function useStorageAsync<T = unknown> (key: string, initialValue: MaybeRe
 export function useStorageAsync<T extends(string|number|boolean|object|null)> (
   key: string,
   initialValue: MaybeRef<T>,
-  storage: StorageLikeAsync | undefined = getSSRHandler('getDefaultStorageAsync', () => defaultWindow?.localStorage)(),
+  storage: StorageLikeAsync | undefined,
   options: StorageAsyncOptions<T> = {},
 ): RemovableRef<T> {
   const {
@@ -57,6 +57,15 @@ export function useStorageAsync<T extends(string|number|boolean|object|null)> (
   const data = (shallow ? shallowRef : ref)(initialValue) as Ref<T>
   const serializer = options.serializer ?? StorageSerializers[type]
 
+  if (!storage) {
+    try {
+      storage = getSSRHandler('getDefaultStorage', () => defaultWindow?.localStorage)()
+    }
+    catch (e) {
+      onError(e)
+    }
+  }
+
   async function read(event?: StorageEvent) {
     if (!storage || (event && event.key !== key))
       return
@@ -88,9 +97,9 @@ export function useStorageAsync<T extends(string|number|boolean|object|null)> (
       async() => {
         try {
           if (data.value == null)
-            await storage.removeItem(key)
+            await storage!.removeItem(key)
           else
-            await storage.setItem(key, await serializer.write(data.value))
+            await storage!.setItem(key, await serializer.write(data.value))
         }
         catch (e) {
           onError(e)