Store doesn't removes a property on a document after a patch with an $unset on that property of the document.

[flaviospagnuolo]

Steps to reproduce

1. Retrieve some documents from a service using find action
2. Get the corresponding documents from the store using the find getter
3. Execute a patch in one of the retrieved documents, with a { $unset: { someProp: 1 } } as the data (delete a property)

Expected behavior

The document in the store should be updated and the deleted property should be removed from it.

Actual behavior

Even if the "patched" event is received with the correct data (the property is no longer defined), the document in the store doesn't reflect this change and the property is still in it.

System configuration

Module versions (especially the part that's not working): "feathers-vuex": "2.3.1", "vuex": "3.6.2"

NodeJS version: 12.16.1

Operating System: Ubuntu 18.04

Browser Version: Google Chrome Version 90.0.4430.93 (Official Build) (64-bit)

[marshallswain]

Hmm... This is not an advertised feature, and not a bug. But it's worth considering for a future update. I'll mark it as an enhancement.

For a workaround, maybe the replaceItems option will work? I've actually never run into the need to do this, so I'm not sure exactly how to do it.

[J3m5]

I think this is the same problem as described in this issue.
You must use the replaceItems option with the next release.

[flaviospagnuolo]

Hi @marshallswain, thanks for your answer. I know this is not an advertised feature, I am new to Feathers and to my limited knowledge I thought that if a document changes on the server and the vuex store is notified the document should be updated in the store. Since I wrote my OP, I have also found that if a document is added to the store without a property and then this property gets added to the document in a later patch, the property is not reflected in the store reactively. For this last problem I opted to add the property with a default value defined in instanceDefaults, so that it is always reactive no matter how the document initially came. By the way, do you have a standard way to handle the scenario where the store is initially loaded with a query with $select from some fields and then we call the get method and retrieve the entire document? I have gone from wanting to optimize a find by doing a $select to obtain only the necessary data but then when I load the whole document with the get method, the fields that were not in the find are ignored.

[marshallswain]

The reactivity problem exists due to how Vue 2 handles reactivity. The properties have to be defined up front. There's not a performance way to add a bunch of properties dynamically later. Vue 3 doesn't have this issue with its reactive layer, but I'm not sure if Vuex still does.

[J3m5]

A possible solution would be to use the Vue set method on each properties each time an item is updated but I'm not sure if it would be good in term of performance...

[flaviospagnuolo]

Thanks @marshallswain and @J3m5 for your help, I'll take your advices into account and keep setting all the relevant properties within the instanceDefaults.