[fix] urlhash in page store

.changeset/heavy-moons-admire.md

@@ -0,0 +1,5 @@
+---
+'@sveltejs/kit': patch
+---
+
+url hash is now properly reflected in page store

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

@@ -159,6 +159,9 @@ export class Renderer {
 
 		let error_args;
 
+		// url.hash is empty when coming from the server
+		url.hash = window.location.hash;
+
 		try {
 			for (let i = 0; i < nodes.length; i += 1) {
 				const is_leaf = i === nodes.length - 1;

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

@@ -162,6 +162,10 @@ export class Router {
 				// 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;
 			}
 

packages/kit/test/apps/basics/src/routes/routing/hashes/pagestore.svelte

@@ -0,0 +1,19 @@
+<script>
+	import { page } from '$app/stores';
+	import { onMount } from 'svelte';
+
+	/** @type {string} */
+	let curWindowHash;
+	onMount(() => setHashVar());
+	function setHashVar() {
+		curWindowHash = window.location.hash;
+	}
+</script>
+
+<svelte:window on:hashchange={setHashVar} />
+
+<h1 id="window-hash">{curWindowHash}</h1>
+<h1 id="page-url-hash">{$page.url.hash}</h1>
+
+<a href="#target">Nav to #ing with anchor tag</a>
+<div id="target">Target</div>

packages/kit/test/apps/basics/test/test.js

@@ -1499,6 +1499,25 @@ test.describe.parallel('Routing', () => {
 		).toBe('rgb(255, 0, 0)');
 	});
 
+	test('$page.url.hash is correctly set on page load', async ({ page, javaScriptEnabled }) => {
+		if (javaScriptEnabled) {
+			await page.goto('/routing/hashes/pagestore#target');
+			expect(await page.textContent('#window-hash')).toBe('#target');
+			expect(await page.textContent('#page-url-hash')).toBe('#target');
+		}
+	});
+
+	test('$page.url.hash is correctly set on navigation', async ({ page, javaScriptEnabled }) => {
+		if (javaScriptEnabled) {
+			await page.goto('/routing/hashes/pagestore');
+			expect(await page.textContent('#window-hash')).toBe('');
+			expect(await page.textContent('#page-url-hash')).toBe('');
+			await page.click('[href="#target"]');
+			expect(await page.textContent('#window-hash')).toBe('#target');
+			expect(await page.textContent('#page-url-hash')).toBe('#target');
+		}
+	});
+
 	test('fallthrough', async ({ page }) => {
 		await page.goto('/routing/fallthrough-simple/invalid');
 		expect(await page.textContent('h1')).toBe('Page');