Mutations are showing out of order when committing actions from a plugin

[DarynHolmes]

Version

4.1.4

Browser and OS info

Version 65.0.3325.181 (Official Build) (64-bit) - Windows 10

Steps to reproduce

When calling an action from a Vuex plugin, the order of the mutations are listed out of order in Vue Devtools. The log statements from the built-in logger seem correct, but the list in Devtools is incorrect.

This can be replicated by running the code in this repo: https://github.com/DarynHolmes/vue-devtools-order

Run that with: npm run serve
Click the button: Add Error
Compare the output from the built-in vuex logger to the Vue devtools display of mutations.

What is expected?

Base State

addError

removeError

What is actually happening?

Base State

removeError

addError

---

It appears that the Dev Tools are not using enough precision when ordering by time.

[simplesmiler]

Confirmed that this happens with the latest beta.

[simplesmiler]

Happens because devtools adds its subscriber after the application subscribers are added.

1. Mutation A goes through the application subscriber, and subscriber commits mutation B.
2. Mutation B goes through the application subscriber, nothing interesting happens.
3. Mutation B goes through the devtools subscriber, gets added to history.
4. Mutation A goes through the devtools subscriber, gets added to history.

The solution would be to prepend the devtools subscriber, so it would be the first in the chain. Currently vuex does not have an API to prepend subscribers.