diff --git a/server.js b/server.js index a3ec6174..1ab95175 100644 --- a/server.js +++ b/server.js @@ -156,6 +156,39 @@ async function main() { ); }); }, + function(hook, vm) { + hook.init(() => { + console.log('----------- plugin init') + }) + + hook.beforeEach((markdown, done) => { + console.log('----------- plugin beforeEach start') + setTimeout(() => { + console.log('----------- plugin beforeEach end') + done(markdown) + }, 500) + }) + + hook.afterEach((html, done) => { + console.log('----------- plugin afterEach start') + setTimeout(() => { + console.log('----------- plugin afterEach end') + done(html) + }, 500) + }) + + hook.doneEach(() => { + console.log('----------- plugin doneEach') + }) + + hook.mounted(() => { + console.log('----------- plugin mounted') + }) + + hook.ready(() => { + console.log('----------- plugin ready') + }) + } ], }; diff --git a/src/core/fetch/index.js b/src/core/fetch/index.js index 6bad3cd6..788e0fbe 100644 --- a/src/core/fetch/index.js +++ b/src/core/fetch/index.js @@ -173,15 +173,27 @@ export function fetchMixin(proto) { const onlyCover = this._fetchCover(); if (onlyCover) { + // FIXME This is super confusing. At this point, doneEach will be called, but + // the cover hasn't been rendered yet. + // TODO: Wait for cover to be fetched... done(); } else { this._fetch(() => { // Scroll to the target item of the page, or to the top. $resetEvents(); + // FIXME This also has a problem similar to the onlyCover branch in the + // previous FIXME: it waits for main content to be fetched, but not for + // navbar to be fetched, so doneEach can be called before things are + // *done* being fetched. done(); }); } + + // FIXME: What is doneEach even for? The documentation says "Invoked each + // time after the data is fully loaded". The way it is being used here is + // confusing because at this point *something* may have been loaded, or + // nothing may have been loaded. }; proto._fetchFallbackPage = function (path, qs, cb = noop) { @@ -247,6 +259,7 @@ export function initFetch(vm) { // Server-Side Rendering if (vm.rendered) { + console.log('--------------------- Hmmmmmmmmmmmmmmmmmmmmmmmmm? 1'); const activeEl = getAndActive(vm.router, '.sidebar-nav', true, true); if (loadSidebar && activeEl) { activeEl.parentNode.innerHTML += window.__SUB_SIDEBAR__; @@ -257,6 +270,7 @@ export function initFetch(vm) { callHook(vm, 'doneEach'); callHook(vm, 'ready'); } else { + console.log('--------------------- Hmmmmmmmmmmmmmmmmmmmmmmmmm? 2'); vm.$fetch(_ => callHook(vm, 'ready')); } } diff --git a/src/core/init/lifecycle.js b/src/core/init/lifecycle.js index 033e9836..49754d24 100644 --- a/src/core/init/lifecycle.js +++ b/src/core/init/lifecycle.js @@ -18,6 +18,18 @@ export function initLifecycle(vm) { }); } +// FIXME! +// FIXME! +// FIXME! Hooks can be async (they need to call the second callback arg passed +// to them, if they have to parameters). This allows plugins to be executed +// in sequence even if they run async code. However! On the last hook function +// of a particular type (for example the last afterEach hook), the next hook of +// the next type (for example the first doneEach hook) will start executing +// before the previous last hook of the last type completed (for example the +// first doneEach hook will begin executing before the last afterEach hook +// has completed). THIS IS BAD! Most people are probably not using async +// hooks in order to encounter this, but if they do, it will be jarring! + export function callHook(vm, hookName, markdownOrHtml, next = noop) { const queue = vm._hooks[hookName]; diff --git a/src/core/render/index.js b/src/core/render/index.js index da87de82..e63333c4 100644 --- a/src/core/render/index.js +++ b/src/core/render/index.js @@ -278,6 +278,7 @@ export function renderMixin(proto) { this._bindEventOnRendered(activeEl); }; + // FIXME why is scroll behavior here? Also see the comments in eventMixin proto._bindEventOnRendered = function (activeEl) { const { autoHeader } = this.config;