chore: update to beforeRender

nuxt · Jun 3, 2021 · d9979a4 · d9979a4
1 parent 8d39741
commit d9979a4
Show file tree

Hide file tree

Showing 6 changed files with 22 additions and 23 deletions.
diff --git a/packages/vue-app/template/index.js b/packages/vue-app/template/index.js
@@ -183,7 +183,7 @@ async function createApp(ssrContext, config = {}) {
     req: ssrContext ? ssrContext.req : undefined,
     res: ssrContext ? ssrContext.res : undefined,
     beforeRenderFns: ssrContext ? ssrContext.beforeRenderFns : undefined,
-    afterRenderFns: ssrContext ? ssrContext.afterRenderFns : undefined,
+    beforeRenderHooks: ssrContext ? ssrContext.beforeRenderHooks : undefined,
     ssrContext
   })
 

diff --git a/packages/vue-app/template/server.js b/packages/vue-app/template/server.js
@@ -83,10 +83,10 @@ export default async (ssrContext) => {
   // Create ssrContext.next for simulate next() of beforeEach() when wanted to redirect
   ssrContext.redirected = false
   ssrContext.next = createNext(ssrContext)
-  // Used for beforeNuxtRender({ Components, nuxtState })
+  // deprectated: Used for beforeNuxtRender({ Components, nuxtState })
   ssrContext.beforeRenderFns = []
-  // Used for afterNuxtRender({ Components, nuxtState })
-  ssrContext.afterRenderFns = []
+  // for beforeRender({ Components, nuxtState })
+  ssrContext.beforeRenderHooks = []
   // Nuxt object (window.{{globals.context}}, defaults to window.__NUXT__)
   ssrContext.nuxt = { <% if (features.layouts) { %>layout: 'default', <% } %>data: [], <% if (features.fetch) { %>fetch: {}, <% } %>error: null<%= (store ? ', state: null' : '') %>, serverRendered: true, routePath: '' }
   <% if (features.fetch) { %>
@@ -120,12 +120,12 @@ export default async (ssrContext) => {
   <% } %>
 
   const beforeRender = async () => {
-    // Call beforeNuxtRender() methods
+    // Deprecated: Call beforeNuxtRender() methods
     await Promise.all(ssrContext.beforeRenderFns.map(fn => promisify(fn, { Components, nuxtState: ssrContext.nuxt })))
 
-    ssrContext.rendered = () => {
-      // Call afterNuxtRender() methods
-      ssrContext.afterRenderFns.forEach(fn => fn({ Components, nuxtState: ssrContext.nuxt }))
+    ssrContext.rendered = async () => {
+      // Call beforeRender() hooks
+      ssrContext.beforeRenderHooks.forEach(fn => fn({ Components, nuxtState: ssrContext.nuxt }))
 
       <% if (store) { %>
       // Add the state from the vuex store

diff --git a/packages/vue-app/template/utils.js b/packages/vue-app/template/utils.js
@@ -258,8 +258,11 @@ export async function setContext (app, context) {
       }
     }
     if (process.server) {
-      app.context.beforeNuxtRender = fn => context.beforeRenderFns.push(fn)
-      app.context.afterNuxtRender = fn => context.afterRenderFns.push(fn)
+      app.context.beforeNuxtRender = fn => {
+        console.warn('`context.beforeNuxtRender(fn)` is deprecated in favour of `context.beforeRender(fn)`. The function updating the `nuxtState` has to be synchronous. Learn more on https://nuxtjs.org/docs/2.x/internals-glossary/context#beforenuxtrender')
+        context.beforeRenderFns.push(fn)
+      }
+      app.context.beforeRender = fn => context.beforeRenderHooks.push(fn)
     }
     if (process.client) {
       app.context.nuxtState = window.<%= globals.context %>

diff --git a/test/dev/basic.ssr.test.js b/test/dev/basic.ssr.test.js
@@ -201,17 +201,16 @@ describe('basic ssr', () => {
     })
   })
 
-  test('/special-state -> check window.__NUXT__.test = true', async () => {
-    const window = await nuxt.server.renderAndGetWindow(url('/special-state'))
+  test('/before-mixt-render -> check window.__NUXT__.beforeNuxtRender = true', async () => {
+    const window = await nuxt.server.renderAndGetWindow(url('/before-nuxt-render'))
     expect(window.document.title).toBe('Nuxt')
-    expect(window.__NUXT__.test).toBe(true)
+    expect(window.__NUXT__.beforeNuxtRender).toBe(true)
   })
 
-  test('/special-state-after -> check window.__NUXT__.testAfter = true', async () => {
-    const window = await nuxt.server.renderAndGetWindow(url('/special-state-after'))
+  test('/before-render -> check window.__NUXT__.beforeRender = true', async () => {
+    const window = await nuxt.server.renderAndGetWindow(url('/before-render'))
     expect(window.document.title).toBe('Nuxt')
-    expect(window.__NUXT__.testBefore).toBeUndefined()
-    expect(window.__NUXT__.testAfter).toBe(true)
+    expect(window.__NUXT__.beforeRender).toBe(true)
   })
 
   test('/error', async () => {

diff --git a/test/fixtures/basic/pages/special-state.vue → ...xtures/basic/pages/before-nuxt-render.vue b/test/fixtures/basic/pages/special-state.vue → ...xtures/basic/pages/before-nuxt-render.vue
@@ -7,7 +7,7 @@ export default {
   middleware ({ beforeNuxtRender }) {
     if (process.server) {
       beforeNuxtRender(({ nuxtState }) => {
-        nuxtState.test = true
+        nuxtState.beforeNuxtRender = true
       })
     }
   }

diff --git a/...tures/basic/pages/special-state-after.vue → test/fixtures/basic/pages/before-render.vue b/...tures/basic/pages/special-state-after.vue → test/fixtures/basic/pages/before-render.vue
@@ -14,11 +14,8 @@ export default {
   },
   fetch () {
     if (process.server) {
-      this.$root.context.beforeNuxtRender(({ nuxtState }) => {
-        nuxtState.testBefore = true
-      })
-      this.$root.context.afterNuxtRender(({ nuxtState }) => {
-        nuxtState.testAfter = true
+      this.$root.context.beforeRender(({ nuxtState }) => {
+        nuxtState.beforeRender = true
       })
     }
   },