fix(vue-app): do not preserve state when registering client-side dynamic module (#8486)

packages/vue-app/template/index.js

@@ -76,10 +76,14 @@ const defaultTransition = <%=
 
 <% if (store) { %>
 const originalRegisterModule = Vuex.Store.prototype.registerModule
-const baseStoreOptions = { preserveState: process.client }
 
 function registerModule (path, rawModule, options = {}) {
-  return originalRegisterModule.call(this, path, rawModule, { ...baseStoreOptions, ...options })
+  const preserveState = process.client && (
+    Array.isArray(path)
+      ? !!path.reduce((namespacedState, path) => namespacedState && namespacedState[path], this.state)
+      : path in this.state
+  )
+  return originalRegisterModule.call(this, path, rawModule, { preserveState, ...options })
 }
 <% } %>
 

test/e2e/basic.browser.test.js

@@ -55,6 +55,7 @@ describe('basic browser', () => {
   test('/store-module', async () => {
     await page.nuxt.navigate('/store-module')
     expect(await page.$text('h1')).toBe('mutated')
+    expect(await page.evaluate(() => window.__NUXT__.state.clientsideModule.initialised)).toBeTruthy()
   })
 
   test('/css', async () => {

test/fixtures/basic/plugins/vuex-module.js

@@ -15,4 +15,13 @@ export default function ({ store }) {
       }
     }
   })
+
+  if (process.server) { return }
+
+  store.registerModule('clientsideModule', {
+    namespaced: true,
+    state: () => ({
+      initialised: true
+    })
+  })
 }