diff --git a/app/composables/usePreferencesProvider.ts b/app/composables/usePreferencesProvider.ts index 305545540..06955aeab 100644 --- a/app/composables/usePreferencesProvider.ts +++ b/app/composables/usePreferencesProvider.ts @@ -1,4 +1,4 @@ -import { defu } from 'defu' +import { createDefu } from 'defu' /** * Abstraction for preferences storage @@ -13,6 +13,13 @@ interface StorageProvider { remove: () => void } +const defu = createDefu((object, key, value) => { + if (Array.isArray(object[key]) && Array.isArray(value)) { + object[key] = value + return true + } +}) + /** * Creates a localStorage-based storage provider */ diff --git a/test/nuxt/composables/use-preferences-provider.spec.ts b/test/nuxt/composables/use-preferences-provider.spec.ts new file mode 100644 index 000000000..21d06e9af --- /dev/null +++ b/test/nuxt/composables/use-preferences-provider.spec.ts @@ -0,0 +1,63 @@ +import { describe, it, expect, beforeEach } from 'vitest' +import { defineComponent, onMounted } from 'vue' +import { mount } from '@vue/test-utils' +import { usePreferencesProvider } from '../../../app/composables/usePreferencesProvider' + +const STORAGE_KEY = 'npmx-list-prefs' + +function mountWithSetup(run: () => void) { + return mount( + defineComponent({ + name: 'TestHarness', + setup() { + run() + return () => null + }, + }), + { attachTo: document.body }, + ) +} + +function setLocalStorage(stored: Record) { + localStorage.setItem(STORAGE_KEY, JSON.stringify(stored)) +} + +describe('usePreferencesProvider', () => { + beforeEach(() => { + localStorage.clear() + }) + + it('initializes with default values when storage is empty', () => { + mountWithSetup(() => { + const defaults = { theme: 'light', cols: ['name', 'version'] } + const { data } = usePreferencesProvider(defaults) + onMounted(() => { + expect(data.value).toEqual(defaults) + }) + }) + }) + + it('loads values from localStorage', () => { + mountWithSetup(() => { + const defaults = { theme: 'light' } + const stored = { theme: 'dark' } + setLocalStorage(stored) + const { data } = usePreferencesProvider(defaults) + onMounted(() => { + expect(data.value).toEqual(stored) + }) + }) + }) + + it('handles array merging by replacement', () => { + mountWithSetup(() => { + const defaults = { cols: ['name', 'version', 'date'] } + const stored = { cols: ['name', 'version'] } + setLocalStorage(stored) + const { data } = usePreferencesProvider(defaults) + onMounted(() => { + expect(data.value.cols).toEqual(['name', 'version']) + }) + }) + }) +})