From 143e38652e7427ad13ab554e6092a20ba559472d Mon Sep 17 00:00:00 2001 From: Joe Haddad Date: Thu, 11 Jun 2020 09:55:03 -0400 Subject: [PATCH] Revert "Add scroll restoration handling after render is complete (#13914)" This reverts commit 06ac0adcf8c712d416023e5ed5e2f769273af2fc. --- .../next/next-server/lib/router/router.ts | 28 ----- .../scroll-restoration/pages/another.js | 1 - .../scroll-restoration/pages/index.js | 50 --------- .../scroll-restoration/test/index.test.js | 106 ------------------ 4 files changed, 185 deletions(-) delete mode 100644 test/integration/scroll-restoration/pages/another.js delete mode 100644 test/integration/scroll-restoration/pages/index.js delete mode 100644 test/integration/scroll-restoration/test/index.test.js diff --git a/packages/next/next-server/lib/router/router.ts b/packages/next/next-server/lib/router/router.ts index bbd9bb95304b8..919508dfcadb6 100644 --- a/packages/next/next-server/lib/router/router.ts +++ b/packages/next/next-server/lib/router/router.ts @@ -94,9 +94,6 @@ type ComponentLoadCancel = (() => void) | null type HistoryMethod = 'replaceState' | 'pushState' -const manualScrollRestoration = - typeof window !== 'undefined' && 'scrollRestoration' in window.history - function fetchNextData( pathname: string, query: ParsedUrlQuery | null, @@ -257,12 +254,6 @@ export default class Router implements BaseRouter { } window.addEventListener('popstate', this.onPopState) - - // enable custom scroll restoration handling when available - // otherwise fallback to browser's default handling - if (manualScrollRestoration) { - window.history.scrollRestoration = 'manual' - } } } @@ -500,21 +491,6 @@ export default class Router implements BaseRouter { } Router.events.emit('beforeHistoryChange', as) - - if (manualScrollRestoration && history.state) { - const { - url: curUrl, - as: curAs, - options: curOptions, - } = history.state - - this.changeState('replaceState', curUrl, curAs, { - ...curOptions, - _N_X: window.scrollX, - _N_Y: window.scrollY, - }) - } - this.changeState(method, url, as, options) if (process.env.NODE_ENV !== 'production') { @@ -531,10 +507,6 @@ export default class Router implements BaseRouter { } Router.events.emit('routeChangeComplete', as) - - if (manualScrollRestoration && '_N_X' in options) { - window.scrollTo(options._N_X, options._N_Y) - } return resolve(true) }) }, diff --git a/test/integration/scroll-restoration/pages/another.js b/test/integration/scroll-restoration/pages/another.js deleted file mode 100644 index c0a614250eaaa..0000000000000 --- a/test/integration/scroll-restoration/pages/another.js +++ /dev/null @@ -1 +0,0 @@ -export default () =>

hi from another

diff --git a/test/integration/scroll-restoration/pages/index.js b/test/integration/scroll-restoration/pages/index.js deleted file mode 100644 index edb974d3b7b5f..0000000000000 --- a/test/integration/scroll-restoration/pages/index.js +++ /dev/null @@ -1,50 +0,0 @@ -import Link from 'next/link' - -const Page = ({ loaded }) => { - const link = ( - - - to another - - - ) - - if (typeof window !== 'undefined') { - window.didHydrate = true - } - - if (loaded) { - return ( - <> -
- {link} -
the end
- - ) - } - - return link -} - -export default Page - -export const getServerSideProps = () => { - return { - props: { - loaded: true, - }, - } -} diff --git a/test/integration/scroll-restoration/test/index.test.js b/test/integration/scroll-restoration/test/index.test.js deleted file mode 100644 index bc9ebfa71efe7..0000000000000 --- a/test/integration/scroll-restoration/test/index.test.js +++ /dev/null @@ -1,106 +0,0 @@ -/* eslint-env jest */ - -import fs from 'fs-extra' -import { join } from 'path' -import webdriver from 'next-webdriver' -import { - killApp, - findPort, - launchApp, - nextStart, - nextBuild, - check, -} from 'next-test-utils' - -jest.setTimeout(1000 * 60 * 2) - -const appDir = join(__dirname, '../') -const nextConfig = join(appDir, 'next.config.js') -let appPort -let app - -const runTests = () => { - it('should restore the scroll position on navigating back', async () => { - const browser = await webdriver(appPort, '/') - await browser.eval(() => - document.querySelector('#to-another').scrollIntoView() - ) - const scrollRestoration = await browser.eval( - () => window.history.scrollRestoration - ) - - expect(scrollRestoration).toBe('manual') - - const scrollX = Math.floor(await browser.eval(() => window.scrollX)) - const scrollY = Math.floor(await browser.eval(() => window.scrollY)) - - expect(scrollX).not.toBe(0) - expect(scrollY).not.toBe(0) - - await browser.eval(() => window.next.router.push('/another')) - - await check( - () => browser.eval(() => document.documentElement.innerHTML), - /hi from another/ - ) - await browser.eval(() => (window.didHydrate = false)) - - await browser.eval(() => window.history.back()) - await check(() => browser.eval(() => window.didHydrate), { - test(content) { - return content - }, - }) - - const newScrollX = Math.floor(await browser.eval(() => window.scrollX)) - const newScrollY = Math.floor(await browser.eval(() => window.scrollY)) - - expect(scrollX).toBe(newScrollX) - expect(scrollY).toBe(newScrollY) - }) -} - -describe('Scroll Restoration Support', () => { - describe('dev mode', () => { - beforeAll(async () => { - appPort = await findPort() - app = await launchApp(appDir, appPort) - }) - afterAll(() => killApp(app)) - - runTests() - }) - - describe('server mode', () => { - beforeAll(async () => { - await nextBuild(appDir) - appPort = await findPort() - app = await nextStart(appDir, appPort) - }) - afterAll(() => killApp(app)) - - runTests() - }) - - describe('serverless mode', () => { - beforeAll(async () => { - await fs.writeFile( - nextConfig, - ` - module.exports = { - target: 'experimental-serverless-trace' - } - ` - ) - await nextBuild(appDir) - appPort = await findPort() - app = await nextStart(appDir, appPort) - }) - afterAll(async () => { - await fs.remove(nextConfig) - await killApp(app) - }) - - runTests() - }) -})