From 721d153f9b7ab9fa8b00cce8bb8cb5da8447e1d4 Mon Sep 17 00:00:00 2001
From: sapphi-red <green@sapphi.red>
Date: Sat, 28 Jan 2023 16:49:45 +0900
Subject: [PATCH 1/2] fix: take <a> in SVG into account

---
 src/client/app/composables/preFetch.ts | 56 +++++++++++++++-----------
 src/client/app/router.ts               | 20 ++++++---
 2 files changed, 47 insertions(+), 29 deletions(-)

diff --git a/src/client/app/composables/preFetch.ts b/src/client/app/composables/preFetch.ts
index 387fc176124b..a37e24e53cc3 100644
--- a/src/client/app/composables/preFetch.ts
+++ b/src/client/app/composables/preFetch.ts
@@ -73,32 +73,40 @@ export function usePrefetch() {
     })
 
     rIC(() => {
-      document.querySelectorAll<HTMLAnchorElement>('#app a').forEach((link) => {
-        const { target, hostname, pathname } = link
-        const extMatch = pathname.match(/\.\w+$/)
-        if (extMatch && extMatch[0] !== '.html') {
-          return
-        }
+      document
+        .querySelectorAll<HTMLAnchorElement | SVGAElement>('#app a')
+        .forEach((link) => {
+          const { target } = link
+          const { hostname, pathname } = new URL(
+            link.href instanceof SVGAnimatedString
+              ? link.href.animVal
+              : link.href,
+            link.baseURI
+          )
+          const extMatch = pathname.match(/\.\w+$/)
+          if (extMatch && extMatch[0] !== '.html') {
+            return
+          }
 
-        if (
-          // only prefetch same tab navigation, since a new tab will load
-          // the lean js chunk instead.
-          target !== `_blank` &&
-          // only prefetch inbound links
-          hostname === location.hostname
-        ) {
-          if (pathname !== location.pathname) {
-            observer!.observe(link)
-          } else {
-            // No need to prefetch chunk for the current page, but also mark
-            // it as already fetched. This is because the initial page uses its
-            // lean chunk, and if we don't mark it, navigation to another page
-            // with a link back to the first page will fetch its full chunk
-            // which isn't needed.
-            hasFetched.add(pathname)
+          if (
+            // only prefetch same tab navigation, since a new tab will load
+            // the lean js chunk instead.
+            target !== `_blank` &&
+            // only prefetch inbound links
+            hostname === location.hostname
+          ) {
+            if (pathname !== location.pathname) {
+              observer!.observe(link)
+            } else {
+              // No need to prefetch chunk for the current page, but also mark
+              // it as already fetched. This is because the initial page uses its
+              // lean chunk, and if we don't mark it, navigation to another page
+              // with a link back to the first page will fetch its full chunk
+              // which isn't needed.
+              hasFetched.add(pathname)
+            }
           }
-        }
-      })
+        })
     })
   }
 
diff --git a/src/client/app/router.ts b/src/client/app/router.ts
index 8b0972549e71..da1853c75325 100644
--- a/src/client/app/router.ts
+++ b/src/client/app/router.ts
@@ -141,9 +141,19 @@ export function createRouter(
         const button = (e.target as Element).closest('button')
         if (button) return
 
-        const link = (e.target as Element).closest('a')
-        if (link && !link.closest('.vp-raw') && !link.download) {
-          const { href, origin, pathname, hash, search, target } = link
+        const link = (e.target as Element | SVGElement).closest<
+          HTMLAnchorElement | SVGAElement
+        >('a')
+        if (
+          link &&
+          !link.closest('.vp-raw') &&
+          (link instanceof SVGElement || !link.download)
+        ) {
+          const { target } = link
+          const { href, origin, pathname, hash, search } = new URL(
+            link.href instanceof SVGAnimatedString ? link.href.animVal : link.href,
+            link.baseURI
+          )
           const currentUrl = window.location
           const extMatch = pathname.match(/\.\w+$/)
           // only intercept inbound links
@@ -205,8 +215,8 @@ export function useRoute(): Route {
   return useRouter().route
 }
 
-function scrollTo(el: HTMLElement, hash: string, smooth = false) {
-  let target: HTMLElement | null = null
+function scrollTo(el: HTMLElement | SVGElement, hash: string, smooth = false) {
+  let target: HTMLElement | SVGElement | null = null
 
   try {
     target = el.classList.contains('header-anchor')

From 055ec77694605dc602b037ad2532363b714ec991 Mon Sep 17 00:00:00 2001
From: sapphi-red <green@sapphi.red>
Date: Sat, 28 Jan 2023 16:53:32 +0900
Subject: [PATCH 2/2] chore: format

---
 src/client/app/router.ts | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/src/client/app/router.ts b/src/client/app/router.ts
index da1853c75325..d09eb3a67574 100644
--- a/src/client/app/router.ts
+++ b/src/client/app/router.ts
@@ -151,7 +151,9 @@ export function createRouter(
         ) {
           const { target } = link
           const { href, origin, pathname, hash, search } = new URL(
-            link.href instanceof SVGAnimatedString ? link.href.animVal : link.href,
+            link.href instanceof SVGAnimatedString
+              ? link.href.animVal
+              : link.href,
             link.baseURI
           )
           const currentUrl = window.location