From d9528a0373cb5693481e1b34715b0f19b2cfd308 Mon Sep 17 00:00:00 2001 From: tkostuch Date: Tue, 19 Nov 2019 12:26:09 +0100 Subject: [PATCH 1/5] mount app in beforeResolve, after all components are resolved --- core/client-entry.ts | 12 ++++-------- 1 file changed, 4 insertions(+), 8 deletions(-) diff --git a/core/client-entry.ts b/core/client-entry.ts index 38f242ab50..77ec96204c 100755 --- a/core/client-entry.ts +++ b/core/client-entry.ts @@ -64,6 +64,10 @@ const invokeClientEntry = async () => { } router.onReady(async () => { router.beforeResolve((to, from, next) => { + // Mounting app + if (!(app as any)._isMounted) { + app.$mount('#app') + } if (!from.name) return next() // do not resolve asyncData on server render - already been done if (Vue.prototype.$ssrRequestContext) Vue.prototype.$ssrRequestContext.output.cacheTags = new Set() const matched = router.getMatchedComponents(to) @@ -99,14 +103,6 @@ const invokeClientEntry = async () => { } })) }) - // Mounting app - if (!RouterManager.isRouteDispatched()) { - RouterManager.addDispatchCallback(() => { - app.$mount('#app') - }) - } else { - app.$mount('#app') - } }) registerSyncTaskProcessor() window.addEventListener('online', () => { onNetworkStatusChange(store) }) From d5f39439baa72b2400e2cbd05df969f58de26f0d Mon Sep 17 00:00:00 2001 From: tkostuch Date: Tue, 19 Nov 2019 14:07:09 +0100 Subject: [PATCH 2/5] if route is already resolved then we can mount app --- core/client-entry.ts | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/core/client-entry.ts b/core/client-entry.ts index 77ec96204c..7e6d771fde 100755 --- a/core/client-entry.ts +++ b/core/client-entry.ts @@ -103,6 +103,10 @@ const invokeClientEntry = async () => { } })) }) + // route is already resolved so 'beforeResolve' will not be triggered + if (RouterManager.isRouteDispatched()) { + app.$mount('#app') + } }) registerSyncTaskProcessor() window.addEventListener('online', () => { onNetworkStatusChange(store) }) From b8d9d38e9e8044bac8dc9755089433c7a15d9be3 Mon Sep 17 00:00:00 2001 From: tkostuch Date: Tue, 19 Nov 2019 14:14:37 +0100 Subject: [PATCH 3/5] update changelog --- CHANGELOG.md | 1 + core/lib/search/adapter/api/searchAdapter.ts | 8 ++++---- 2 files changed, 5 insertions(+), 4 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 8abade3c6a..ba5e3659c4 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -13,6 +13,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 - Disable product mutation when assigning product variant - @gibkigonzo (#3735) - Fixed null value of search input - @AdKamil (#3778) - Sorting fixed on category page - @AdKamil (#3785) +- Mount app in 'beforeResolve' if it's not dispatched in 'onReady' - @gibkigonzo (#3669) ## [1.10.4] - 18.10.2019 diff --git a/core/lib/search/adapter/api/searchAdapter.ts b/core/lib/search/adapter/api/searchAdapter.ts index 556c6f6603..b40e8fb204 100644 --- a/core/lib/search/adapter/api/searchAdapter.ts +++ b/core/lib/search/adapter/api/searchAdapter.ts @@ -80,10 +80,10 @@ export class SearchAdapter { }, body: config.elasticsearch.queryMethod === 'POST' ? JSON.stringify(ElasticsearchQueryBody) : null }) - .then(resp => { return resp.json() }) - .catch(error => { - throw new Error('FetchError in request to ES: ' + error.toString()) - }) + .then(resp => { return resp.json() }) + .catch(error => { + throw new Error('FetchError in request to ES: ' + error.toString()) + }) } public handleResult (resp, type, start = 0, size = 50): SearchResponse { From f410757796ee9e26ca2d53b0203e715c709b6940 Mon Sep 17 00:00:00 2001 From: tkostuch Date: Wed, 20 Nov 2019 07:29:09 +0100 Subject: [PATCH 4/5] check if router history is pending --- core/client-entry.ts | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/core/client-entry.ts b/core/client-entry.ts index 7e6d771fde..57848ab7d9 100755 --- a/core/client-entry.ts +++ b/core/client-entry.ts @@ -103,8 +103,9 @@ const invokeClientEntry = async () => { } })) }) - // route is already resolved so 'beforeResolve' will not be triggered - if (RouterManager.isRouteDispatched()) { + // if route is dispatched and there is no pending in router history + // if there is stil pending then 'beforeResolve' will handle app mount, otherwise 'beforeResolve' will not trigger + if (RouterManager.isRouteDispatched() && !(router as any).history.pending) { app.$mount('#app') } }) From a20bc88bdf60634f4e9293de8dc68a69d1d8ac27 Mon Sep 17 00:00:00 2001 From: tkostuch Date: Wed, 20 Nov 2019 09:12:08 +0100 Subject: [PATCH 5/5] update code readability --- core/client-entry.ts | 23 ++++++++++++++--------- 1 file changed, 14 insertions(+), 9 deletions(-) diff --git a/core/client-entry.ts b/core/client-entry.ts index 57848ab7d9..72437fc3d7 100755 --- a/core/client-entry.ts +++ b/core/client-entry.ts @@ -63,12 +63,22 @@ const invokeClientEntry = async () => { }) } router.onReady(async () => { + // check if app can be mounted + const canBeMounted = () => RouterManager.isRouteDispatched() && // route is dispatched + !(router as any).history.pending && // there is no pending in router history + !(app as any)._isMounted // it's not mounted before + + if (canBeMounted()) { + app.$mount('#app') + } router.beforeResolve((to, from, next) => { - // Mounting app - if (!(app as any)._isMounted) { - app.$mount('#app') + if (!from.name) { + next() + if (canBeMounted()) { + app.$mount('#app') + } + return // do not resolve asyncData on server render - already been done } - if (!from.name) return next() // do not resolve asyncData on server render - already been done if (Vue.prototype.$ssrRequestContext) Vue.prototype.$ssrRequestContext.output.cacheTags = new Set() const matched = router.getMatchedComponents(to) if (to) { // this is from url @@ -103,11 +113,6 @@ const invokeClientEntry = async () => { } })) }) - // if route is dispatched and there is no pending in router history - // if there is stil pending then 'beforeResolve' will handle app mount, otherwise 'beforeResolve' will not trigger - if (RouterManager.isRouteDispatched() && !(router as any).history.pending) { - app.$mount('#app') - } }) registerSyncTaskProcessor() window.addEventListener('online', () => { onNetworkStatusChange(store) })