fix(useStorage): make sure to always read data if new value is undefined (#4957)

OrbisK · web-flow · commit 22116b6908f4 · 2025-08-18T05:58:15.000Z
diff --git a/packages/core/useStorage/index.test.ts b/packages/core/useStorage/index.test.ts
@@ -122,6 +122,15 @@ describe('useStorage', () => {
     expect(storedValue).toBeFalsy()
   })
 
+  it('undefined value with existing store', () => {
+    const initial = { foo: 'bar' }
+    storage.setItem(KEY, JSON.stringify(initial))
+    const store = useStorage(KEY, undefined, storage, { serializer: StorageSerializers.object })
+
+    expect.soft(store.value).toStrictEqual(initial)
+    expect.soft(storage.getItem(KEY)).toBe(JSON.stringify(initial))
+  })
+
   it('remove value', async () => {
     storage.setItem(KEY, 'random')
 
diff --git a/packages/core/useStorage/index.ts b/packages/core/useStorage/index.ts
@@ -175,7 +175,7 @@ export function useStorage<T extends (string | number | boolean | object | null)
 
   const { pause: pauseWatch, resume: resumeWatch } = pausableWatch(
     data,
-    () => write(data.value),
+    newValue => write(newValue),
     { flush, deep, eventFilter },
   )
 
@@ -295,13 +295,17 @@ export function useStorage<T extends (string | number | boolean | object | null)
       return
     }
 
-    if (event && event.key !== keyComputed.value)
+    if (event && event.key !== keyComputed.value) {
       return
+    }
 
     pauseWatch()
+
     try {
-      if (event?.newValue !== serializer.write(data.value))
+      const serializedData = serializer.write(data.value)
+      if (event === undefined || event?.newValue !== serializedData) {
         data.value = read(event)
+      }
     }
     catch (e) {
       onError(e)
