[fix] remove scroll handling code

.changeset/cyan-dodos-clap.md

@@ -0,0 +1,5 @@
+---
+'@sveltejs/kit': patch
+---
+
+[fix] remove scroll handling code

packages/kit/src/runtime/client/renderer.js

@@ -294,7 +294,7 @@ export class Renderer {
 	 * @param {import('./types').NavigationInfo} info
 	 * @param {string[]} chain
 	 * @param {boolean} no_cache
-	 * @param {{hash?: string, scroll: { x: number, y: number } | null, keepfocus: boolean}} [opts]
+	 * @param {{hash?: string, keepfocus: boolean}} [opts]
 	 */
 	async handle_navigation(info, chain, no_cache, opts) {
 		if (this.started) {
@@ -311,7 +311,7 @@ export class Renderer {
 	 * @param {import('./types').NavigationInfo} info
 	 * @param {string[]} chain
 	 * @param {boolean} no_cache
-	 * @param {{hash?: string, scroll: { x: number, y: number } | null, keepfocus: boolean}} [opts]
+	 * @param {{hash?: string, keepfocus: boolean}} [opts]
 	 */
 	async update(info, chain, no_cache, opts) {
 		const token = (this.token = {});
@@ -363,7 +363,7 @@ export class Renderer {
 
 		// opts must be passed if we're navigating
 		if (opts) {
-			const { scroll, keepfocus } = opts;
+			const { keepfocus } = opts;
 
 			if (!keepfocus) {
 				getSelection()?.removeAllRanges();
@@ -375,15 +375,8 @@ export class Renderer {
 
 			if (this.autoscroll) {
 				const deep_linked = info.url.hash && document.getElementById(info.url.hash.slice(1));
-				if (scroll) {
-					scrollTo(scroll.x, scroll.y);
-				} else if (deep_linked) {
-					// Here we use `scrollIntoView` on the element instead of `scrollTo`
-					// because it natively supports the `scroll-margin` and `scroll-behavior`
-					// CSS properties.
+				if (deep_linked) {
 					deep_linked.scrollIntoView();
-				} else {
-					scrollTo(0, 0);
 				}
 			}
 		} else {

packages/kit/src/runtime/client/router.js

@@ -1,13 +1,6 @@
 import { onMount } from 'svelte';
 import { get_base_uri } from './utils';
 
-function scroll_state() {
-	return {
-		x: pageXOffset,
-		y: pageYOffset
-	};
-}
-
 /**
  * @param {Event} event
  * @returns {HTMLAnchorElement | SVGAElement | undefined}
@@ -72,14 +65,6 @@ export class Router {
 	}
 
 	init_listeners() {
-		if ('scrollRestoration' in history) {
-			history.scrollRestoration = 'manual';
-		}
-
-		// Adopted from Nuxt.js
-		// Reset scrollRestoration to auto when leaving page, allowing page reload
-		// and back-navigation from other pages to use the browser to restore the
-		// scrolling position.
 		addEventListener('beforeunload', (e) => {
 			let should_block = false;
 
@@ -94,35 +79,9 @@ export class Router {
 			if (should_block) {
 				e.preventDefault();
 				e.returnValue = '';
-			} else {
-				history.scrollRestoration = 'auto';
 			}
 		});
 
-		// Setting scrollRestoration to manual again when returning to this page.
-		addEventListener('load', () => {
-			history.scrollRestoration = 'manual';
-		});
-
-		// There's no API to capture the scroll location right before the user
-		// hits the back/forward button, so we listen for scroll events
-
-		/** @type {NodeJS.Timeout} */
-		let scroll_timer;
-		addEventListener('scroll', () => {
-			clearTimeout(scroll_timer);
-			scroll_timer = setTimeout(() => {
-				// Store the scroll location in the history
-				// This will persist even if we navigate away from the site and come back
-				const new_state = {
-					...(history.state || {}),
-					'sveltekit:scroll': scroll_state()
-				};
-				history.replaceState(new_state, document.title, window.location.href);
-				// iOS scroll event intervals happen between 30-150ms, sometimes around 200ms
-			}, 200);
-		});
-
 		/** @param {Event} event */
 		const trigger_prefetch = (event) => {
 			const a = find_anchor(event);
@@ -189,19 +148,11 @@ export class Router {
 			// Removing the hash does a full page navigation in the browser, so make sure a hash is present
 			const [base, hash] = url.href.split('#');
 			if (hash !== undefined && base === location.href.split('#')[0]) {
-				// Call `pushState` to add url to history so going back works.
-				// Also make a delay, otherwise the browser default behaviour would not kick in
-				setTimeout(() => history.pushState({}, '', url.href));
-				const info = this.parse(url);
-				if (info) {
-					return this.renderer.update(info, [], false);
-				}
 				return;
 			}
 
 			this._navigate({
 				url,
-				scroll: a.hasAttribute('sveltekit:noscroll') ? scroll_state() : null,
 				keepfocus: false,
 				chain: [],
 				details: {
@@ -221,7 +172,6 @@ export class Router {
 
 				this._navigate({
 					url: new URL(location.href),
-					scroll: event.state['sveltekit:scroll'],
 					keepfocus: false,
 					chain: [],
 					details: null,
@@ -279,7 +229,6 @@ export class Router {
 		if (this.enabled) {
 			return this._navigate({
 				url,
-				scroll: noscroll ? scroll_state() : null,
 				keepfocus,
 				chain,
 				details: {
@@ -348,7 +297,6 @@ export class Router {
 	/**
 	 * @param {{
 	 *   url: URL;
-	 *   scroll: { x: number, y: number } | null;
 	 *   keepfocus: boolean;
 	 *   chain: string[];
 	 *   details: {
@@ -359,7 +307,7 @@ export class Router {
 	 *   blocked: () => void;
 	 * }} opts
 	 */
-	async _navigate({ url, scroll, keepfocus, chain, details, accepted, blocked }) {
+	async _navigate({ url, keepfocus, chain, details, accepted, blocked }) {
 		const from = this.renderer.current.url;
 		let should_block = false;
 
@@ -409,7 +357,6 @@ export class Router {
 		}
 
 		await this.renderer.handle_navigation(info, chain, false, {
-			scroll,
 			keepfocus
 		});