From b186710699112ccdc4f26f1b8de3490fd4b5a616 Mon Sep 17 00:00:00 2001 From: Calvin Liang Date: Wed, 13 May 2020 12:35:36 -0700 Subject: [PATCH 1/8] Add handleScroll on initial history.transitionTo --- src/index.js | 28 ++++++++++++++++++++++------ 1 file changed, 22 insertions(+), 6 deletions(-) diff --git a/src/index.js b/src/index.js index e95ace6d1..4c6186c48 100644 --- a/src/index.js +++ b/src/index.js @@ -8,6 +8,7 @@ import { cleanPath } from './util/path' import { createMatcher } from './create-matcher' import { normalizeLocation } from './util/location' import { supportsPushState } from './util/push-state' +import { handleScroll } from './util/scroll' import { HashHistory } from './history/hash' import { HTML5History } from './history/html5' @@ -111,15 +112,30 @@ export default class VueRouter { const history = this.history if (history instanceof HTML5History) { - history.transitionTo(history.getCurrentLocation()) + history.transitionTo(history.getCurrentLocation(), route => { + const expectScroll = this.options.scrollBehavior + const supportsScroll = supportsPushState && expectScroll + + if (supportsScroll) { + handleScroll(this, route, route, false) + } + }) } else if (history instanceof HashHistory) { - const setupHashListener = () => { - history.setupListeners() - } history.transitionTo( history.getCurrentLocation(), - setupHashListener, - setupHashListener + route => { + const expectScroll = this.options.scrollBehavior + const supportsScroll = supportsPushState && expectScroll + + history.setupListeners() + + if (supportsScroll) { + handleScroll(this, route, route, false) + } + }, + () => { + history.setupListeners() + } ) } From 67fbc0d65140965b8286233efd5d3cf040214b4e Mon Sep 17 00:00:00 2001 From: Calvin Liang Date: Wed, 13 May 2020 12:46:51 -0700 Subject: [PATCH 2/8] Update index.js --- src/index.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/index.js b/src/index.js index 4c6186c48..cc8492151 100644 --- a/src/index.js +++ b/src/index.js @@ -126,9 +126,9 @@ export default class VueRouter { route => { const expectScroll = this.options.scrollBehavior const supportsScroll = supportsPushState && expectScroll - + history.setupListeners() - + if (supportsScroll) { handleScroll(this, route, route, false) } From 8bc2319a5d1fb0eb5392c523b977089717808194 Mon Sep 17 00:00:00 2001 From: Calvin Liang Date: Thu, 14 May 2020 15:03:01 -0700 Subject: [PATCH 3/8] test(scroll-behavior): add tests for scrollBehavior on load --- test/e2e/specs/scroll-behavior.js | 38 +++++++++++++++++++++++++++++++ 1 file changed, 38 insertions(+) diff --git a/test/e2e/specs/scroll-behavior.js b/test/e2e/specs/scroll-behavior.js index 6cc371fee..d138d09a7 100644 --- a/test/e2e/specs/scroll-behavior.js +++ b/test/e2e/specs/scroll-behavior.js @@ -127,6 +127,44 @@ module.exports = { null, 'scroll to anchor that starts with number' ) + + .url('http://localhost:8080/scroll-behavior/bar#anchor') + .execute(function () { + location.reload(true) + }) + .waitForElementVisible('#app', 1000) + .assert.evaluate( + function () { + return document.getElementById('anchor').getBoundingClientRect().top < 1 + }, + null, + 'scroll to anchor on load' + ) + .url('http://localhost:8080/scroll-behavior/bar#anchor2') + .execute(function () { + location.reload(true) + }) + .waitForElementVisible('#app', 1000) + .assert.evaluate( + function () { + return document.getElementById('anchor2').getBoundingClientRect().top < 101 + }, + null, + 'scroll to anchor with offset on load' + ) + .url('http://localhost:8080/scroll-behavior/bar#1number') + .execute(function () { + location.reload(true) + }) + .waitForElementVisible('#app', 1000) + .assert.evaluate( + function () { + return document.getElementById('1number').getBoundingClientRect().top < 1 + }, + null, + 'scroll to anchor that starts with number on load' + ) + .end() } } From 294f387ac34ef59747bc495133801052bb3d3ef9 Mon Sep 17 00:00:00 2001 From: Calvin Liang Date: Thu, 14 May 2020 15:04:10 -0700 Subject: [PATCH 4/8] refactor(scroll-behavior): scrollBehavior on load --- src/index.js | 26 +++++++++++--------------- 1 file changed, 11 insertions(+), 15 deletions(-) diff --git a/src/index.js b/src/index.js index cc8492151..26a7c8d60 100644 --- a/src/index.js +++ b/src/index.js @@ -111,27 +111,23 @@ export default class VueRouter { const history = this.history - if (history instanceof HTML5History) { - history.transitionTo(history.getCurrentLocation(), route => { - const expectScroll = this.options.scrollBehavior - const supportsScroll = supportsPushState && expectScroll + const handleInitialScroll = (route) => { + const expectScroll = this.options.scrollBehavior + const supportsScroll = supportsPushState && expectScroll - if (supportsScroll) { - handleScroll(this, route, route, false) - } - }) + if (supportsScroll) { + handleScroll(this, route, route, false) + } + } + + if (history instanceof HTML5History) { + history.transitionTo(history.getCurrentLocation(), handleInitialScroll) } else if (history instanceof HashHistory) { history.transitionTo( history.getCurrentLocation(), route => { - const expectScroll = this.options.scrollBehavior - const supportsScroll = supportsPushState && expectScroll - history.setupListeners() - - if (supportsScroll) { - handleScroll(this, route, route, false) - } + handleInitialScroll(route) }, () => { history.setupListeners() From a958162d13316be71635727e5e6d1e38847aa47c Mon Sep 17 00:00:00 2001 From: Calvin Liang Date: Tue, 19 May 2020 15:12:03 -0700 Subject: [PATCH 5/8] style: remove spaces --- src/index.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/index.js b/src/index.js index 6f9b9f85c..1157520e2 100644 --- a/src/index.js +++ b/src/index.js @@ -121,7 +121,7 @@ export default class VueRouter { const handleInitialScroll = (route) => { const expectScroll = this.options.scrollBehavior const supportsScroll = supportsPushState && expectScroll - + if (supportsScroll) { handleScroll(this, route, route, false) } From d75c46282336798608dc2acbe6473602c4767ed3 Mon Sep 17 00:00:00 2001 From: Calvin Liang Date: Fri, 12 Jun 2020 13:04:05 -0700 Subject: [PATCH 6/8] fix: handleScroll not called with from --- src/index.js | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/index.js b/src/index.js index 1157520e2..3e49d5de7 100644 --- a/src/index.js +++ b/src/index.js @@ -119,11 +119,12 @@ export default class VueRouter { if (history instanceof HTML5History || history instanceof HashHistory) { const handleInitialScroll = (route) => { + const from = history.current const expectScroll = this.options.scrollBehavior const supportsScroll = supportsPushState && expectScroll if (supportsScroll) { - handleScroll(this, route, route, false) + handleScroll(this, route, from, false) } } const setupListeners = (route) => { From 521644daa7d46774abe4dec7578e8e71e318cb95 Mon Sep 17 00:00:00 2001 From: Calvin Liang Date: Fri, 12 Jun 2020 13:04:52 -0700 Subject: [PATCH 7/8] test(scroll-behavior): remove redundant tests --- test/e2e/specs/scroll-behavior.js | 24 ------------------------ 1 file changed, 24 deletions(-) diff --git a/test/e2e/specs/scroll-behavior.js b/test/e2e/specs/scroll-behavior.js index 9034c8633..db317d591 100644 --- a/test/e2e/specs/scroll-behavior.js +++ b/test/e2e/specs/scroll-behavior.js @@ -132,30 +132,6 @@ module.exports = { null, 'scroll to anchor on load' ) - .url('http://localhost:8080/scroll-behavior/bar#anchor2') - .execute(function () { - location.reload(true) - }) - .waitForElementVisible('#app', 1000) - .assert.evaluate( - function () { - return document.getElementById('anchor2').getBoundingClientRect().top < 101 - }, - null, - 'scroll to anchor with offset on load' - ) - .url('http://localhost:8080/scroll-behavior/bar#1number') - .execute(function () { - location.reload(true) - }) - .waitForElementVisible('#app', 1000) - .assert.evaluate( - function () { - return document.getElementById('1number').getBoundingClientRect().top < 1 - }, - null, - 'scroll to anchor that starts with number on load' - ) .end() } From da632bfb1d1afeb39bb2b50df50d84bb6febfdf2 Mon Sep 17 00:00:00 2001 From: Eduardo San Martin Morote Date: Thu, 18 Jun 2020 15:29:54 +0200 Subject: [PATCH 8/8] fix: call handleScroll only if initial navigation succeeds --- src/index.js | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/src/index.js b/src/index.js index 3e49d5de7..ae3b69e15 100644 --- a/src/index.js +++ b/src/index.js @@ -118,18 +118,18 @@ export default class VueRouter { const history = this.history if (history instanceof HTML5History || history instanceof HashHistory) { - const handleInitialScroll = (route) => { + const handleInitialScroll = (routeOrError) => { const from = history.current const expectScroll = this.options.scrollBehavior const supportsScroll = supportsPushState && expectScroll - if (supportsScroll) { - handleScroll(this, route, from, false) + if (supportsScroll && 'fullPath' in routeOrError) { + handleScroll(this, routeOrError, from, false) } } - const setupListeners = (route) => { + const setupListeners = (routeOrError) => { history.setupListeners() - handleInitialScroll(route) + handleInitialScroll(routeOrError) } history.transitionTo(history.getCurrentLocation(), setupListeners, setupListeners) }