fix(vuex): initialState only on vuex init, closes #950

Author: Guillaume Chau

src/backend/hook.js

@@ -98,26 +98,18 @@ export function installHook (target) {
 
   hook.once('vuex:init', store => {
     hook.store = store
-    hook.initialStore = {
-      state: clone(store.state),
-      getters: store.getters
-    }
-    const origReplaceState = store.replaceState.bind(store)
-    store.replaceState = state => {
-      hook.initialStore.state = clone(state)
-      origReplaceState(state)
-    }
     // Dynamic modules
+    let origRegister, origUnregister
     if (store.registerModule) {
       hook.storeModules = []
-      const origRegister = store.registerModule.bind(store)
+      origRegister = store.registerModule.bind(store)
       store.registerModule = (path, module, options) => {
         if (typeof path === 'string') path = [path]
         hook.storeModules.push({ path, module, options })
         origRegister(path, module, options)
-        if (process.env.NODE_ENV !== 'production') console.log('early register module', path)
+        if (process.env.NODE_ENV !== 'production') console.log('early register module', path, module, options)
       }
-      const origUnregister = store.unregisterModule.bind(store)
+      origUnregister = store.unregisterModule.bind(store)
       store.unregisterModule = (path) => {
         if (typeof path === 'string') path = [path]
         const key = path.join('/')
@@ -126,17 +118,13 @@ export function installHook (target) {
         origUnregister(path)
         if (process.env.NODE_ENV !== 'production') console.log('early unregister module', path)
       }
-      hook.flushStoreModules = () => {
+    }
+    hook.flushStoreModules = () => {
+      if (store.registerModule) {
         store.registerModule = origRegister
         store.unregisterModule = origUnregister
-        store.replaceState = origReplaceState
-        return hook.storeModules
-      }
-    } else {
-      hook.flushStoreModules = () => {
-        store.replaceState = origReplaceState
-        return []
       }
+      return hook.storeModules
     }
   })
 

src/backend/vuex.js

@@ -9,6 +9,9 @@ const isProd = process.env.NODE_ENV === 'production'
 export function initVuexBackend (hook, bridge, isLegacy) {
   const store = hook.store
 
+  const earlyModules = hook.flushStoreModules()
+  let initialState = clone(store.state)
+
   let snapshotsVm = null
   const updateSnapshotsVm = (state) => {
     snapshotsVm = new Vue({
@@ -19,27 +22,14 @@ export function initVuexBackend (hook, bridge, isLegacy) {
     })
   }
 
-  const getStateSnapshot = (_store = store) => clone(_store.state)
-
   let baseStateSnapshot, stateSnapshots, mutations, lastState
   let registeredModules = {}
   let allTimeModules = {}
 
-  const earlyModules = hook.flushStoreModules()
-
-  // Init additional state
-  earlyModules.forEach(({ path, module, options }) => {
-    if (!options || options.preserveState !== true) {
-      const state = typeof module.state === 'function' ? module.state() : module.state
-      const parentState = path.length === 1 ? hook.initialStore.state : get(hook.initialStore.state, path.slice(0, -1))
-      set(parentState, path[path.length - 1], state)
-    }
-  })
-
   updateSnapshotsVm()
 
   function reset (stateSnapshot = null) {
-    baseStateSnapshot = stateSnapshot || getStateSnapshot(hook.initialStore)
+    baseStateSnapshot = stateSnapshot || clone(initialState)
     mutations = []
     resetSnapshotCache()
   }
@@ -199,7 +189,7 @@ export function initVuexBackend (hook, bridge, isLegacy) {
 
   bridge.on('vuex:import-state', state => {
     const parsed = parse(state, true)
-    hook.initialStore.state = parsed
+    initialState = parsed
     reset()
     hook.emit('vuex:travel-to-state', parsed)
     bridge.send('vuex:init')
@@ -281,7 +271,7 @@ export function initVuexBackend (hook, bridge, isLegacy) {
             tempAddedModules.push(key)
             origRegisterModule(moduleInfo.path, {
               ...moduleInfo.module,
-              state: moduleInfo.state
+              state: clone(moduleInfo.state)
             }, moduleInfo.options)
             updateSnapshotsVm(store.state)
             if (!isProd) console.log('replay register module', moduleInfo)
@@ -319,7 +309,7 @@ export function initVuexBackend (hook, bridge, isLegacy) {
       }
 
       // Send final state after replay
-      resultState = getStateSnapshot()
+      resultState = clone(store.state)
     }
 
     lastState = resultState
@@ -338,7 +328,7 @@ export function initVuexBackend (hook, bridge, isLegacy) {
       const { path, module, options, state } = registeredModules[m]
       origRegisterModule(path, {
         ...module,
-        state
+        state: clone(state)
       }, options)
       if (!isProd) console.log('after replay register', m)
     })
@@ -364,7 +354,7 @@ export function initVuexBackend (hook, bridge, isLegacy) {
   function takeStateSnapshot (index) {
     stateSnapshots.push({
       index,
-      state: getStateSnapshot()
+      state: clone(store.state)
     })
     // Delete old cached snapshots
     if (stateSnapshots.length > SharedData.cacheVuexSnapshotsLimit) {
@@ -402,7 +392,7 @@ export function initVuexBackend (hook, bridge, isLegacy) {
             const { path, module, options, state } = data
             origRegisterModule(path, {
               ...module,
-              state
+              state: clone(state)
             }, options)
             registeredModules[path.join('/')] = data
           }