Skip to content

Commit

Permalink
fix(middleware/persist): hydrate in sync (new impl with storage optio…
Browse files Browse the repository at this point in the history 
…n) (#1518)

* fix tests to use storage option

* fix the impl
  • Loading branch information
@dai-shi
dai-shi committed Jan 10, 2023
1 parent 725c2c0 commit a5a8f28
Show file tree
Hide file tree
Showing 3 changed files with 32 additions and 34 deletions.
4 changes: 2 additions & 2 deletions src/middleware/persist.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -418,7 +418,7 @@ const newImpl: PersistImpl = (config, baseOptions) => (set, get, api) => {
options.onRehydrateStorage?.(get()) || undefined

// bind is used to avoid `TypeError: Illegal invocation` error
return Promise.resolve(storage.getItem.bind(storage)(options.name))
return toThenable(storage.getItem.bind(storage))(options.name)
.then((deserializedStorageValue) => {
if (deserializedStorageValue) {
if (
Expand Down Expand Up @@ -473,7 +473,7 @@ const newImpl: PersistImpl = (config, baseOptions) => (set, get, api) => {
storage?.removeItem(options.name)
},
getOptions: () => options,
rehydrate: () => hydrate(),
rehydrate: () => hydrate() as Promise<void>,
hasHydrated: () => hasHydrated,
onHydrate: (cb) => {
hydrationListeners.add(cb)
Expand Down
27 changes: 13 additions & 14 deletions tests/persistAsync.test.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
import { StrictMode, useEffect } from 'react'
import { act, render, waitFor } from '@testing-library/react'
import { create } from 'zustand'
import { persist } from 'zustand/middleware'
import { createJSONStorage, persist } from 'zustand/middleware'

const createPersistantStore = (initialValue: string | null) => {
let state = initialValue
Expand Down Expand Up @@ -58,7 +58,7 @@ describe('persist middleware with async configuration', () => {
}),
{
name: 'test-storage',
getStorage: () => storage,
storage: createJSONStorage(() => storage),
onRehydrateStorage: () => onRehydrateStorageSpy,
}
)
Expand Down Expand Up @@ -101,7 +101,7 @@ describe('persist middleware with async configuration', () => {
const useBoundStore = create(
persist(() => ({ count: 0 }), {
name: 'test-storage',
getStorage: () => storage,
storage: createJSONStorage(() => storage),
onRehydrateStorage: () => onRehydrateStorageSpy,
})
)
Expand Down Expand Up @@ -134,7 +134,7 @@ describe('persist middleware with async configuration', () => {
const useBoundStore = create(
persist(() => ({ count: 0 }), {
name: 'test-storage',
getStorage: () => storage,
storage: createJSONStorage(() => storage),
onRehydrateStorage: () => onRehydrateStorageSpy,
})
)
Expand Down Expand Up @@ -208,7 +208,7 @@ describe('persist middleware with async configuration', () => {
persist(() => ({ count: 0 }), {
name: 'test-storage',
version: 13,
getStorage: () => storage,
storage: createJSONStorage(() => storage),
onRehydrateStorage: () => onRehydrateStorageSpy,
migrate: migrateSpy,
})
Expand Down Expand Up @@ -263,7 +263,7 @@ describe('persist middleware with async configuration', () => {
}),
{
name: 'test-storage',
getStorage: () => storage,
storage: createJSONStorage(() => storage),
}
)
)
Expand Down Expand Up @@ -315,7 +315,7 @@ describe('persist middleware with async configuration', () => {
persist(() => ({ count: 0 }), {
name: 'test-storage',
version: 13,
getStorage: () => storage,
storage: createJSONStorage(() => storage),
onRehydrateStorage: () => onRehydrateStorageSpy,
})
)
Expand Down Expand Up @@ -356,7 +356,7 @@ describe('persist middleware with async configuration', () => {
persist(() => ({ count: 0 }), {
name: 'test-storage',
version: 13,
getStorage: () => storage,
storage: createJSONStorage(() => storage),
migrate: () => {
throw new Error('migrate error')
},
Expand Down Expand Up @@ -402,7 +402,7 @@ describe('persist middleware with async configuration', () => {
const useBoundStore = create(
persist(() => ({ count: 0, unstorableMethod }), {
name: 'test-storage',
getStorage: () => storage,
storage: createJSONStorage(() => storage),
onRehydrateStorage: () => onRehydrateStorageSpy,
})
)
Expand Down Expand Up @@ -446,7 +446,7 @@ describe('persist middleware with async configuration', () => {
const useBoundStore = create(
persist(() => ({ count: 0, actions: { unstorableMethod } }), {
name: 'test-storage',
getStorage: () => storage,
storage: createJSONStorage(() => storage),
merge: (_persistedState, currentState) => {
const persistedState = _persistedState as any
delete persistedState.actions
Expand Down Expand Up @@ -494,8 +494,7 @@ describe('persist middleware with async configuration', () => {
const useBoundStore = create(
persist(() => ({ count: 0 }), {
name: 'test-storage',
getStorage: () => storage,
deserialize: (str) => JSON.parse(str),
storage: createJSONStorage(() => storage),
})
)

Expand Down Expand Up @@ -528,7 +527,7 @@ describe('persist middleware with async configuration', () => {
const useBoundStore = create(
persist(() => ({ count: 0 }), {
name: 'test-storage',
getStorage: () => storage,
storage: createJSONStorage(() => storage),
})
)

Expand All @@ -549,7 +548,7 @@ describe('persist middleware with async configuration', () => {
const useBoundStore = create(
persist(() => ({ count: 0 }), {
name: 'test-storage',
getStorage: () => storage,
storage: createJSONStorage(() => storage),
})
)
expect(useBoundStore.persist.hasHydrated()).toBe(false)
Expand Down
35 changes: 17 additions & 18 deletions tests/persistSync.test.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
import { create } from 'zustand'
import { persist } from 'zustand/middleware'
import { createJSONStorage, persist } from 'zustand/middleware'

const createPersistentStore = (initialValue: string | null) => {
let state = initialValue
Expand Down Expand Up @@ -54,7 +54,7 @@ describe('persist middleware with sync configuration', () => {
}),
{
name: 'test-storage',
getStorage: () => storage,
storage: createJSONStorage(() => storage),
onRehydrateStorage: () => onRehydrateStorageSpy,
}
)
Expand Down Expand Up @@ -83,7 +83,7 @@ describe('persist middleware with sync configuration', () => {
create(
persist(() => ({ count: 0 }), {
name: 'test-storage',
getStorage: () => storage,
storage: createJSONStorage(() => storage),
onRehydrateStorage: () => spy,
})
)
Expand All @@ -99,7 +99,7 @@ describe('persist middleware with sync configuration', () => {
const useBoundStore = create(
persist(() => ({ count: 0 }), {
name: 'test-storage',
getStorage: () => storage,
storage: createJSONStorage(() => storage),
onRehydrateStorage: () => onRehydrateStorageSpy,
})
)
Expand Down Expand Up @@ -148,7 +148,7 @@ describe('persist middleware with sync configuration', () => {
persist(() => ({ count: 0 }), {
name: 'test-storage',
version: 13,
getStorage: () => storage,
storage: createJSONStorage(() => storage),
onRehydrateStorage: () => onRehydrateStorageSpy,
migrate: migrateSpy,
})
Expand Down Expand Up @@ -183,7 +183,7 @@ describe('persist middleware with sync configuration', () => {
persist(() => ({ count: 0 }), {
name: 'test-storage',
version: 13,
getStorage: () => storage,
storage: createJSONStorage(() => storage),
onRehydrateStorage: () => onRehydrateStorageSpy,
})
)
Expand All @@ -210,7 +210,7 @@ describe('persist middleware with sync configuration', () => {
persist(() => ({ count: 0 }), {
name: 'test-storage',
version: 13,
getStorage: () => storage,
storage: createJSONStorage(() => storage),
migrate: () => {
throw new Error('migrate error')
},
Expand Down Expand Up @@ -243,7 +243,7 @@ describe('persist middleware with sync configuration', () => {
const useBoundStore = create(
persist(() => ({ count: 0, unstorableMethod }), {
name: 'test-storage',
getStorage: () => storage,
storage: createJSONStorage(() => storage),
onRehydrateStorage: () => onRehydrateStorageSpy,
})
)
Expand Down Expand Up @@ -273,7 +273,7 @@ describe('persist middleware with sync configuration', () => {
const useBoundStore = create(
persist(() => ({ count: 0, actions: { unstorableMethod } }), {
name: 'test-storage',
getStorage: () => storage,
storage: createJSONStorage(() => storage),
merge: (_persistedState, currentState) => {
const persistedState = _persistedState as any
delete persistedState.actions
Expand Down Expand Up @@ -309,8 +309,7 @@ describe('persist middleware with sync configuration', () => {
const useBoundStore = create(
persist(() => ({ count: 0 }), {
name: 'test-storage',
getStorage: () => storage,
deserialize: (str) => JSON.parse(str),
storage: createJSONStorage(() => storage),
})
)

Expand Down Expand Up @@ -349,7 +348,7 @@ describe('persist middleware with sync configuration', () => {
}),
{
name: 'test-storage',
getStorage: () => storage,
storage: createJSONStorage(() => storage),
partialize: (state) => {
return {
object: {
Expand Down Expand Up @@ -394,7 +393,7 @@ describe('persist middleware with sync configuration', () => {
const useBoundStore = create(
persist(() => ({ count: 0 }), {
name: 'test-storage',
getStorage: () => storage,
storage: createJSONStorage(() => storage),
})
)
expect(useBoundStore.persist.getOptions().name).toBeDefined()
Expand All @@ -413,7 +412,7 @@ describe('persist middleware with sync configuration', () => {
const useBoundStore = create(
persist(() => ({ count: 0 }), {
name: 'test-storage',
getStorage: () => storage,
storage: createJSONStorage(() => storage),
partialize: (s) => s as Partial<typeof s>,
})
)
Expand Down Expand Up @@ -450,7 +449,7 @@ describe('persist middleware with sync configuration', () => {
const useBoundStore = create(
persist(() => ({ count: 0 }), {
name: 'test-storage',
getStorage: () => storage,
storage: createJSONStorage(() => storage),
})
)

Expand All @@ -470,7 +469,7 @@ describe('persist middleware with sync configuration', () => {
const useBoundStore = create(
persist(() => ({ count: 0 }), {
name: 'test-storage',
getStorage: () => storage,
storage: createJSONStorage(() => storage),
})
)

Expand All @@ -491,7 +490,7 @@ describe('persist middleware with sync configuration', () => {
const useBoundStore = create(
persist(() => ({ count: 0 }), {
name: 'test-storage',
getStorage: () => storage,
storage: createJSONStorage(() => storage),
})
)

Expand Down Expand Up @@ -519,7 +518,7 @@ describe('persist middleware with sync configuration', () => {
const useBoundStore = create(
persist(() => ({ count: 0 }), {
name: 'test-storage',
getStorage: () => storage,
storage: createJSONStorage(() => storage),
})
)

Expand Down

0 comments on commit a5a8f28

Please sign in to comment.