Vuex does not pause reference tracking during actions/mutations

[kawazoe]

Version

4.0.2

Reproduction link

stackblitz.com

Steps to reproduce

1. open the link to minimal reproduction.
2. open dev tools
3. wait for the server to start.
4. notice how multiple refs are tracked on top of props.msg.

What is expected?

Only props.msg should be tracked.

What is actually happening?

Refs inside vuex's mutation are getting tracked by watchEffect(), which will cause the effect to trigger if any data in the store changes even though it isn't used by the watch itself. This will cause all sensible uses of vuex mutations (ones that change the state) in a watchEffect() to trigger in loops.

---

It has been established by the core team that watchEffect() is expected to watch every ref used in the provided callback. Still, we believe it to be unexpected that usage of the state in actions/mutations are getting tracked by watchEffect() and thus moved this discussion in the vuex repo.

See additional discussion here: https://github.com/vuejs/core/issues/5359

[eyal-rp]

Can someone on the Vuex team respond to this?

I've ran into the same problem with a very simple watchEffect... it seems just using store.dispatch inside the watchEffect callback causes it to rerun every few seconds without anything changing.