From e5ce2fe65509da5433181f7374ded899bd660728 Mon Sep 17 00:00:00 2001 From: Thomas Beduneau Date: Thu, 25 Mar 2021 08:51:20 +0100 Subject: [PATCH 1/2] fix(vue-app): call navigation guards in createApp when called from the client (#9049) --- packages/vue-app/template/client.js | 10 ++++----- packages/vue-app/template/index.js | 32 ++++++++++++++--------------- 2 files changed, 20 insertions(+), 22 deletions(-) diff --git a/packages/vue-app/template/client.js b/packages/vue-app/template/client.js index 7c80fff8dbe7..045f017ef7ff 100644 --- a/packages/vue-app/template/client.js +++ b/packages/vue-app/template/client.js @@ -229,10 +229,8 @@ function applySSRData (Component, ssrData) { } // Get matched components -function resolveComponents (router) { - const path = getLocation(router.options.base, router.options.mode) - - return flatMapComponents(router.match(path), async (Component, _, match, key, index) => { +function resolveComponents (route) { + return flatMapComponents(route, async (Component, _, match, key, index) => { // If component is not resolved yet, resolve it if (typeof Component === 'function' && !Component.options) { Component = await Component() @@ -884,7 +882,7 @@ async function mountApp (__app) { } <% if (features.transitions) { %> // Resolve route components - const Components = await Promise.all(resolveComponents(router)) + const Components = await Promise.all(resolveComponents(app.context.route)) // Enable transitions _app.setTransitions = _app.$options.nuxt.setTransitions.bind(_app) @@ -893,7 +891,7 @@ async function mountApp (__app) { _lastPaths = router.currentRoute.matched.map(route => compile(route.path)(router.currentRoute.params)) } <% } else if (features.asyncData || features.fetch) { %> - await Promise.all(resolveComponents(router)) + await Promise.all(resolveComponents(app.context.route)) <% } %> // Initialize error handler _app.$loading = {} // To avoid error while _app.$nuxt does not exist diff --git a/packages/vue-app/template/index.js b/packages/vue-app/template/index.js index 50c11c90a758..0ecefc824aca 100644 --- a/packages/vue-app/template/index.js +++ b/packages/vue-app/template/index.js @@ -263,26 +263,26 @@ async function createApp(ssrContext, config = {}) { } } - // If server-side, wait for async component to be resolved first - if (process.server && ssrContext && ssrContext.url) { - await new Promise((resolve, reject) => { - router.push(ssrContext.url, resolve, (err) => { - // https://github.com/vuejs/vue-router/blob/v3.4.3/src/util/errors.js - if (!err._isRouter) return reject(err) - if (err.type !== 2 /* NavigationFailureType.redirected */) return resolve() + // Wait for async component to be resolved first + await new Promise((resolve, reject) => { + router.push(app.context.route.fullPath, resolve, (err) => { + // https://github.com/vuejs/vue-router/blob/v3.4.3/src/util/errors.js + if (!err._isRouter) return reject(err) + if (err.type !== 2 /* NavigationFailureType.redirected */) return resolve() - // navigated to a different route in router guard - const unregister = router.afterEach(async (to, from) => { + // navigated to a different route in router guard + const unregister = router.afterEach(async (to, from) => { + if (process.server && ssrContext && ssrContext.url) { ssrContext.url = to.fullPath - app.context.route = await getRouteData(to) - app.context.params = to.params || {} - app.context.query = to.query || {} - unregister() - resolve() - }) + } + app.context.route = await getRouteData(to) + app.context.params = to.params || {} + app.context.query = to.query || {} + unregister() + resolve() }) }) - } + }) return { <% if(store) { %>store,<% } %> From 8900839a399207bade6df3471b3cb9b90b8aee1b Mon Sep 17 00:00:00 2001 From: Daniel Roe Date: Wed, 31 Mar 2021 20:13:44 +0100 Subject: [PATCH 2/2] test: update e2e spa base test --- test/e2e/spa-base.browser.test.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/test/e2e/spa-base.browser.test.js b/test/e2e/spa-base.browser.test.js index 8eac938d7460..95a914524e02 100644 --- a/test/e2e/spa-base.browser.test.js +++ b/test/e2e/spa-base.browser.test.js @@ -26,7 +26,7 @@ describe('spa router base browser', () => { test('Open /app (router base)', async () => { page = await browser.page(url('/app')) - expect(await page.evaluate(() => location.href)).toBe(url('/app')) + expect(await page.evaluate(() => location.href)).toBe(url('/app/')) expect(await page.html()).not.toContain('This page could not be found')