fix: redirect hashes with different casing

Author: benmccann

apps/svelte.dev/src/routes/docs/[...path]/+page.svelte

@@ -2,8 +2,11 @@
 	import { Text } from '@sveltejs/site-kit/components';
 	import { legacy_details } from '@sveltejs/site-kit/actions';
 	import { setupDocsHovers } from '@sveltejs/site-kit/docs';
+	import { onMount } from 'svelte';
 	import OnThisPage from './OnThisPage.svelte';
 	import Breadcrumbs from './Breadcrumbs.svelte';
+	import { goto } from '$app/navigation';
+	import { page } from '$app/stores';
 	import PageControls from '$lib/components/PageControls.svelte';
 
 	let { data } = $props();
@@ -17,6 +20,35 @@
 		const link = 'docs/' + data.document.file.split('/').slice(2).join('/');
 		return `https://github.com/sveltejs/${name}/edit/main/documentation/${link}`;
 	});
+
+	// make hash case-insensitive
+	// hash was lowercase in v4 docs and varying case in v5 docs
+	function get_url_to_redirect_to() {
+		const hash = $page.url.hash.replace(/^#/i, '');
+		if (!hash) return;
+
+		const elements = document.querySelectorAll('*[id]');
+		// if there's an exact match, use that. no need to redirect
+		for (const el of elements) {
+			if (el.id === hash) {
+				return;
+			}
+		}
+		for (const el of elements) {
+			if (el.id.toLocaleLowerCase() === hash.toLocaleLowerCase()) {
+				const url = $page.url;
+				url.hash = el.id;
+				return url;
+			}
+		}
+	}
+
+	onMount(() => {
+		const redirect = get_url_to_redirect_to();
+		if (redirect) {
+			goto(redirect, { replaceState: true });
+		}
+	});
 </script>
 
 <svelte:head>