From 45c20cc77b8cfcd58edce803644bace20bc56757 Mon Sep 17 00:00:00 2001 From: Sidhartha Chatterjee Date: Wed, 9 Dec 2020 18:09:08 +0530 Subject: [PATCH 1/2] Respect hash as source of truth for scroll position --- .../gatsby-react-router-scroll/src/scroll-handler.tsx | 11 ++++++++++- 1 file changed, 10 insertions(+), 1 deletion(-) diff --git a/packages/gatsby-react-router-scroll/src/scroll-handler.tsx b/packages/gatsby-react-router-scroll/src/scroll-handler.tsx index e7289346343e0..b547308b84810 100644 --- a/packages/gatsby-react-router-scroll/src/scroll-handler.tsx +++ b/packages/gatsby-react-router-scroll/src/scroll-handler.tsx @@ -61,7 +61,16 @@ export class ScrollHandler extends React.Component< scrollPosition = this._stateStorage.read(this.props.location, key) } - if (hash && scrollPosition === 0) { + /** There are two pieces of state: the browser url and + * history state which keeps track of scroll position + * Native behaviour prescribes that we ought to restore scroll position + * when a user navigates back in their browser (this is the `POP` action) + * Currently, reach router has a bug that prevents this at https://github.com/reach/router/issues/228 + * So we _always_ stick to the url as a source of truth — if the url + * contains a hash, we scroll to it + */ + + if (hash) { this.scrollToHash(decodeURI(hash), prevProps) } else { this.windowScroll(scrollPosition, prevProps) From 0e56eccd0dd560400562f70992bd186d4d6e5641 Mon Sep 17 00:00:00 2001 From: Sidhartha Chatterjee Date: Wed, 9 Dec 2020 19:50:44 +0530 Subject: [PATCH 2/2] Fix incorrect assertion --- .../production-runtime/cypress/integration/scroll-behavior.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/e2e-tests/production-runtime/cypress/integration/scroll-behavior.js b/e2e-tests/production-runtime/cypress/integration/scroll-behavior.js index e1f135df5169d..e62a769a2132e 100644 --- a/e2e-tests/production-runtime/cypress/integration/scroll-behavior.js +++ b/e2e-tests/production-runtime/cypress/integration/scroll-behavior.js @@ -48,7 +48,7 @@ describe(`Scroll behaviour`, () => { cy.go(`forward`).waitForRouteChange() cy.window().then(updatedWindow => { - expect(updatedWindow.scrollY).not.to.eq(idScrollY) + expect(updatedWindow.scrollY).to.eq(idScrollY) }) }) })