diff --git a/packages/after.js/src/After.tsx b/packages/after.js/src/After.tsx index 16e1a9aa..cefa8a69 100644 --- a/packages/after.js/src/After.tsx +++ b/packages/after.js/src/After.tsx @@ -77,6 +77,7 @@ class Afterparty extends React.Component { history, routes, data, + transitionBehavior, // we don't want to pass these // to loadInitialProps() match, @@ -87,6 +88,19 @@ class Afterparty extends React.Component { const { scrollToTop } = data.afterData; + const instantMode = isInstantTransition(transitionBehavior) + + // Only for page changes, prevent scroll up for anchor links + if ( + (prevState.currentLocation && + prevState.currentLocation.pathname) !== location.pathname && + // Only Scroll if scrollToTop is not false + scrollToTop.current === true && + instantMode === true + ) { + window.scrollTo(0, 0); + } + loadInitialProps(routes, location.pathname, { location, history, @@ -101,10 +115,12 @@ class Afterparty extends React.Component { (prevState.currentLocation && prevState.currentLocation.pathname) !== location.pathname && // Only Scroll if scrollToTop is not false - scrollToTop.current + scrollToTop.current === true && + instantMode === false ) { window.scrollTo(0, 0); } + this.setState({ previousLocation: null, data, isLoading: false }); }) .catch(e => { @@ -132,12 +148,12 @@ class Afterparty extends React.Component { const { location: currentLocation, transitionBehavior } = this.props; const initialData = this.prefetcherCache[currentLocation.pathname] || data; - const instantTransition = isInstantTransition(transitionBehavior) + const instantMode = isInstantTransition(transitionBehavior) // when we are in the instant mode we want to pass the right location prop // to the otherwise it will render previous matche component const location = - instantTransition + instantMode ? currentLocation : previousLocation || currentLocation;