anthonygore/vuex-undo-redo

Accessing vuex-undo-redo from multiple components

caugner opened this issue · 2 comments

Context: I ran into the following caveat when accessing vuex-undo-redo from two components:

  • Component A provides buttons to undo/redo.
  • Component B attaches a global keydown handler (document.addEventListener("keydown", this.handleKeydown);) and provides undo/redo via keyboard shortcuts.

Problem: When undoing/redoing via the keyboard shortcuts, the Vuex state changed to the desired state, but the undo count increased (with mutation duplicates) and the redo count remained 0.

Workaround: The problem did not appear when I attached the document event listener within the same component.

Observation: To debug, I temporarily worked with a local copy of the plugin and inserted console.log calls also inside the this.$store.subscribe handler. This allowed me to observe that the handler was called multiple times for each mutation (probably once per instanciated Vue component, because the number increased with increasing "elements" on the display).

Has anybody seen this in the wild and got an explanation or a solution?

Hello @caugner,

You were not the only one seeing this issue. I fixed it on my fork by attaching the done / undone arrays directly to the store instead of declaring them in the global Mixin (which was added to every component).

Fix is there: tvillaren@ee31a9c

fogs commented

We are facing the same issue. Any chance, this gets integrated to the repository?