Possibility to log all state changes (not only actions or mutations)

[Danilo-Araujo-Silva]

What problem does this feature solve?

With these built-in logger plugin we are able to subscribe to our store and log all state mutations.

But, it looks like, for now, we are not able to log all state changes other than mutations or actions. What does it mean? For example, if we are controlling the state of the application drawer (like this one on the Vuetify project or more specifically some inline editing actions in the data table component) and we would like to connect (even mapping) the store state directly in the component we will not be able to log the mutations there, since there's no mutation action involved.

Maybe we could use events to try to accomplish that but I'll be far more difficult.

I think it could be very good for us we have the possibility to log state changes that are not triggered by mutations and actions too.

What does the proposed API look like?

const myPlugin = store => {
  // called when the store is initialized
  store.subscribe((state, mutation, action) => {
    // called after every state change and not only on mutations.
    // The mutation comes in the format of `{ type, payload }`.
  })
}

[leoyli]

In practice, you should never mutate states out of store (mutations). You’d either copy it into local state (e.g. form), or commit a mutation.

[jdoubleu]

The proposed API looks similar to #1440

[ktsn]

You should not directly mutate state without mutations. That's one of the reason why we have mutation on Vuex - it allows us to notice the every state changes.

[Danilo-Araujo-Silva]

Well, I'm not really saying that we shouldn't use mutations to change the state. I was just trying to find a way to log all state changes because this could really help on development or in a debug process. But ok, this is not a problem for me anymore.