useStorage: difference between Object.keys(rawValue) and Object.keys(rawInit)

[haoval]

Describe the bug

if an object exists in localStorage with given key:

test: {
  a:1
}

oops:

const testState = useLocalStorage('test', {
  a: 1,
  b: 2,
})
console.log(testState.value.b) // returns undefined

Reproduction

dev

System Info

--npmPackages {
  "@vueuse/core": "^8.9.3"
}

Used Package Manager

pnpm

Validations

• Follow our Code of Conduct
• Read the Contributing Guidelines.
• Read the docs.
• Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
• Make sure this is a VueUse issue and not a framework-specific issue. For example, if it's a Vue SFC related bug, it should likely be reported to https://github.com/vuejs/core instead.
• Check that this is a concrete bug. For Q&A open a GitHub Discussion.
• The provided reproduction is a minimal reproducible example of the bug.

[antfu]

Yeah, currently initValue only applies when the stored value is undefined. I think we could introduce an option to deep merge the initialValue. PR welcome

[lumdzeehol]

Yeah, currently initValue only applies when the stored value is undefined. I think we could introduce an option to deep merge the initialValue. PR welcome

useStorage locates in @vueuse/core, so I think it's better to implement a lite deepmerge function internally instead of introducing lib likes deepmerge？

[antfu]

Yes #1957 allows it to be a function to provide custom merge logic