Skip to content

trigger app.$mount in beforeResolve #3820

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 6 commits into from
Nov 21, 2019
Merged

trigger app.$mount in beforeResolve #3820

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
d9528a0
mount app in beforeResolve, after all components are resolved
Nov 19, 2019
d5f3943
if route is already resolved then we can mount app
Nov 19, 2019
a37c4c2
Merge branch 'hotfix/v1.10.5' of https://github.com/DivanteLtd/vue-st…
Nov 19, 2019
b8d9d38
update changelog
Nov 19, 2019
f410757
check if router history is pending
Nov 20, 2019
a20bc88
update code readability
Nov 20, 2019
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions CHANGELOG.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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

Expand Down
24 changes: 15 additions & 9 deletions core/client-entry.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -63,8 +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) => {
if (!from.name) return next() // do not resolve asyncData on server render - already been done
if (!from.name) {
next()
if (canBeMounted()) {
Copy link
Collaborator

@pkarw pkarw Nov 20, 2019

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

shouldn't this be executed before next()?

Copy link
Contributor Author

@gibkigonzo gibkigonzo Nov 20, 2019 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Problem is that vue-router doesn't reveal when it resolve async components. So I check when this.pending is falsy, because it gets null just after enter events are finished (here). In this line it adds this.router.resolveHooks (beforeResolve) to other enter events. So we need to wait just after beforeResolve is finished and then we have falsy this.pending. Best solution would be mounting app after queue ends (here) in onReady, but I couldn't find any flag to check this before it goes to beforeResolve.

Copy link
Contributor Author

@gibkigonzo gibkigonzo Nov 21, 2019

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I had to keep app mounting in onReady callback because in production version on for example homepage there could be a situation that beforeResolve event is not triggered at all.

app.$mount('#app')
}
return // do not resolve asyncData on server render - already been done
}
if (Vue.prototype.$ssrRequestContext) Vue.prototype.$ssrRequestContext.output.cacheTags = new Set<string>()
const matched = router.getMatchedComponents(to)
if (to) { // this is from url
Expand Down Expand Up @@ -99,14 +113,6 @@ const invokeClientEntry = async () => {
}
}))
})
// Mounting app
if (!RouterManager.isRouteDispatched()) {
RouterManager.addDispatchCallback(() => {
app.$mount('#app')
})
} else {
app.$mount('#app')
}
})
registerSyncTaskProcessor()
window.addEventListener('online', () => { onNetworkStatusChange(store) })
Expand Down
8 changes: 4 additions & 4 deletions core/lib/search/adapter/api/searchAdapter.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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 {
Expand Down