Skip to content
This repository was archived by the owner on Aug 31, 2025. It is now read-only.
This repository was archived by the owner on Aug 31, 2025. It is now read-only.

'pick' option doesn't store keys with null values #408

@Miosss

Description

@Miosss

Are you using Nuxt?

  • Check this box if you encountered the issue using Nuxt and the included module.

Describe the bug

When using pick option, elements that are persisted with value null are instead ignored and not save to Storage at all.
This is different than persisting entire store, without, pick or omit. In this case all keys are stored, and if they are null - the stored value is null.
I guess this is an issue with deep-pick-omit library.

This can be very problematic, when using the store witj pick option and synchronizing store access in different browser tabs with storage event. When one tab nullifies the values, the second tab gets storage event. It then uses $hydrate() to force the store to read from Storage, but since nullified keys are in fact non-existent in the storage, that hydration does nothing and 'old' values from the store are used, and not read from the Storage.

Reproduction

below

System Info

export const useAuthStore = defineStore('auth', () => {
	const accessToken = ref<string | null>('test');
	
	function clear() {
		accessToken.value = null;
	}
	
	return {
		accessToken,
		clear,
	};
}, {
	persist: {
		storage: localStorage,
		pick: ['accessToken'],
		afterHydrate: (ctx) => {
			console.log('When clear called from other tab, this will not be null, but have old value:', ctx.store.accessToken);
		},
	},
});


....


const registerAuthStoreRefresh = () => {
	const authStore = useAuthStore();
	window.addEventListener('storage', (event) => {
		if(event.key === authStore.$id)
			authStore.$hydrate(); 
	});
};
registerAuthStoreRefresh();

Used Package Manager

yarn

Validations

Metadata

Metadata

Assignees

No one assigned

    Labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions