From 33c213bc36a0996f6333185dfc695fcd0d37c9d9 Mon Sep 17 00:00:00 2001 From: Thierry Michel Date: Mon, 11 Feb 2019 17:48:43 +0100 Subject: [PATCH] fix(prefetch): :bug: fix requestError - return full response - rename params - fix `usePrefetch` with eventHandlers bindings --- packages/core/src/barba.js | 57 +++++++++++++----------------------- packages/core/src/request.js | 14 ++++----- 2 files changed, 27 insertions(+), 44 deletions(-) diff --git a/packages/core/src/barba.js b/packages/core/src/barba.js index e18dc07b..6049f70d 100644 --- a/packages/core/src/barba.js +++ b/packages/core/src/barba.js @@ -180,9 +180,8 @@ export default { this.useCache = useCache; this.usePrefetch = usePrefetch; - // Init dom with data-attributes schema + // 1. Init modules with data-attributes schema dom.init({ attributeSchema: schema }); - // Init prevent with data-attributes schema this.prevent.init({ attributeSchema: schema }); // Add prevent custom if (preventCustom !== null) { @@ -193,46 +192,40 @@ export default { this.prevent.add('preventCustom', preventCustom); } - // Get wrapper + // 2. Wrapper this._wrapper = dom.getWrapper(); if (!this._wrapper) { throw new Error('[@barba/core] No Barba wrapper found'); } + this._wrapper.setAttribute('aria-live', 'polite'); // A11y - // A11y - this._wrapper.setAttribute('aria-live', 'polite'); + // 3. Init pages (get "current" data) + this._initPages(); + if (!this._current.container) { + throw new Error('[@barba/core] No Barba container found'); + } - // Store + // 4. Init other modules this.store = store.init(transitions); - // Views manager viewsManager.init(this, views); - // Init pages - this._initPages(); - + // 5. Use "current" data // Set/update history history.add(this._current.url, this._current.namespace); - - if (!this._current.container) { - throw new Error('[@barba/core] No Barba container found'); - } - - // TODO: check network connectivity / reduced data usage mode? // Add to cache - this.cache.set(this._current.url, Promise.resolve(this._current.html)); + this.useCache && + this.cache.set(this._current.url, Promise.resolve(this._current.html)); - // Bindings - /* istanbul ignore else */ - if (this.useCache && this.usePrefetch) { - this._onLinkEnter = this._onLinkEnter.bind(this); - this._onLinkClick = this._onLinkClick.bind(this); - } + // 6. Bindings + this._onLinkEnter = this._onLinkEnter.bind(this); + this._onLinkClick = this._onLinkClick.bind(this); this._onStateChange = this._onStateChange.bind(this); this._bind(); - // Init plugins + // 7. Init plugins this._plugins.forEach(plugin => plugin.init()); + // 8. Finally, do appear… this.appear(); }, @@ -250,7 +243,7 @@ export default { _bind() { /* istanbul ignore else */ - if (this.useCache && this.usePrefetch) { + if (this.usePrefetch) { document.addEventListener('mouseover', this._onLinkEnter); document.addEventListener('touchstart', this._onLinkEnter); } @@ -258,16 +251,6 @@ export default { window.addEventListener('popstate', this._onStateChange); }, - // DEV - // _unbind() { - // if (this.useCache && this.usePrefetch) { - // document.removeEventListener('mouseover', this._onLinkEnter); - // document.removeEventListener('touchstart', this._onLinkEnter); - // } - // document.removeEventListener('click', this._onLinkClick); - // window.removeEventListener('popstate', this._onStateChange); - // }, - _onLinkEnter(e) { let el = e.target; @@ -330,14 +313,14 @@ export default { }, _onRequestError(action, ...args) { - const [url, error] = args; + const [url, response] = args; this.cache.delete(url); // Custom requestError returning false will return here; if ( this._requestError && - this._requestError(action, url, error) === false + this._requestError(action, url, response) === false ) { return; } diff --git a/packages/core/src/request.js b/packages/core/src/request.js index 8278e375..253f23ef 100644 --- a/packages/core/src/request.js +++ b/packages/core/src/request.js @@ -24,10 +24,10 @@ function timeout(url, ms, request, requestError) { window.clearTimeout(timeoutId); resolve(res); }, - error => { + errorOrResponse => { window.clearTimeout(timeoutId); - requestError(url, error); - reject(error); + requestError(url, errorOrResponse); + reject(errorOrResponse); } ); }); @@ -64,18 +64,18 @@ async function request(url) { }); try { - const result = await fetch(url, { + const response = await fetch(url, { method: 'GET', headers, cache: 'default', }); - if (result.status >= 200 && result.status < 300) { + if (response.status >= 200 && response.status < 300) { // DEV: should return DOM directly ? - return await result.text(); + return await response.text(); } - throw new Error(result.statusText || result.status); + throw response; } catch (error) { throw error; }