mirror of
https://github.com/tenrok/vue-meta.git
synced 2026-06-11 19:22:25 +03:00
fix: move addNavGuards check to mounted hook
The addNavGuards check adds the navigation guards when an afterNavigation callback is defined but refreshOnceOnNavigation was not set. As the afterNavigation callback is defined in metaInfo which can be dependent on user data we need to wait until all components are fully mounted before checking if a afterNavigation callback was defined Fixes: #348
This commit is contained in:
+7
-11
@@ -76,8 +76,14 @@ export default function createMixin(Vue, options) {
|
||||
if (!this.$root._vueMeta.initialized) {
|
||||
// refresh meta in nextTick so all child components have loaded
|
||||
this.$nextTick(function () {
|
||||
this.$root.$meta().refresh()
|
||||
const { metaInfo } = this.$root.$meta().refresh()
|
||||
this.$root._vueMeta.initialized = true
|
||||
|
||||
// add the navigation guards if they havent been added yet
|
||||
// they are needed for the afterNavigation callback
|
||||
if (!options.refreshOnceOnNavigation && metaInfo.afterNavigation) {
|
||||
addNavGuards(this)
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
@@ -91,16 +97,6 @@ export default function createMixin(Vue, options) {
|
||||
|
||||
// do not trigger refresh on the server side
|
||||
if (!this.$isServer) {
|
||||
// add the navigation guards if they havent been added yet
|
||||
// if metaInfo is defined as a function, this does call the computed fn redundantly
|
||||
// but as Vue internally caches the results of computed props it shouldnt hurt performance
|
||||
if (!options.refreshOnceOnNavigation && (
|
||||
(this.$options[options.keyName] && this.$options[options.keyName].afterNavigation) ||
|
||||
(this.$options.computed && this.$options.computed.$metaInfo && (this.$options.computed.$metaInfo() || {}).afterNavigation)
|
||||
)) {
|
||||
addNavGuards(this)
|
||||
}
|
||||
|
||||
// no need to add this hooks on server side
|
||||
updateOnLifecycleHook.forEach((lifecycleHook) => {
|
||||
ensuredPush(this.$options, lifecycleHook, () => triggerUpdate(this, lifecycleHook))
|
||||
|
||||
@@ -128,7 +128,7 @@ describe('client', () => {
|
||||
expect(context._uid).toBe(wrapper.vm._uid)
|
||||
})
|
||||
|
||||
test('afterNavigation function is called with refreshOnce: true', () => {
|
||||
test('afterNavigation function is called with refreshOnce: true', async () => {
|
||||
const Vue = loadVueMetaPlugin(false, { refreshOnceOnNavigation: true })
|
||||
const afterNavigation = jest.fn()
|
||||
const component = Vue.component('nav-component', {
|
||||
@@ -151,6 +151,8 @@ describe('client', () => {
|
||||
}
|
||||
})
|
||||
|
||||
await vmTick(wrapper.vm)
|
||||
|
||||
expect(guards.before).toBeDefined()
|
||||
expect(guards.after).toBeDefined()
|
||||
|
||||
@@ -161,7 +163,7 @@ describe('client', () => {
|
||||
expect(afterNavigation).toHaveBeenCalled()
|
||||
})
|
||||
|
||||
test('afterNavigation function is called with refreshOnce: false', () => {
|
||||
test('afterNavigation function is called with refreshOnce: false', async () => {
|
||||
const Vue = loadVueMetaPlugin(false, { refreshOnceOnNavigation: false })
|
||||
const afterNavigation = jest.fn()
|
||||
const component = Vue.component('nav-component', {
|
||||
@@ -184,6 +186,8 @@ describe('client', () => {
|
||||
}
|
||||
})
|
||||
|
||||
await vmTick(wrapper.vm)
|
||||
|
||||
expect(guards.before).toBeDefined()
|
||||
expect(guards.after).toBeDefined()
|
||||
|
||||
|
||||
Reference in New Issue
Block a user