Skip to content

Commit c6c983e

Browse files
authoredAug 6, 2023
fix(client): handle empty hash in links (#2738)
1 parent e54eea3 commit c6c983e

File tree

1 file changed

+21
-23
lines changed

1 file changed

+21
-23
lines changed
 

‎src/client/app/router.ts

+21-23
Original file line numberDiff line numberDiff line change
@@ -74,11 +74,7 @@ export function createRouter(
7474
href = url.pathname + url.search + url.hash
7575
}
7676
}
77-
if (inBrowser && href !== location.href) {
78-
// save scroll position before changing url
79-
history.replaceState({ scrollPosition: window.scrollY }, document.title)
80-
history.pushState(null, '', href)
81-
}
77+
updateHistory(href)
8278
await loadPage(href)
8379
await router.onAfterRouteChanged?.(href)
8480
}
@@ -211,15 +207,18 @@ export function createRouter(
211207
search === currentUrl.search
212208
) {
213209
// scroll between hash anchors in the same page
210+
// avoid duplicate history entries when the hash is same
211+
if (hash !== currentUrl.hash) {
212+
history.pushState(null, '', hash)
213+
// still emit the event so we can listen to it in themes
214+
window.dispatchEvent(new Event('hashchange'))
215+
}
214216
if (hash) {
215-
// avoid duplicate history entries when the hash is same
216-
if (hash !== currentUrl.hash) {
217-
history.pushState(null, '', hash)
218-
// still emit the event so we can listen to it in themes
219-
window.dispatchEvent(new Event('hashchange'))
220-
}
221217
// use smooth scroll when clicking on header anchor links
222218
scrollTo(link, hash, link.classList.contains('header-anchor'))
219+
} else {
220+
updateHistory(href)
221+
window.scrollTo(0, 0)
223222
}
224223
} else {
225224
go(href)
@@ -292,20 +291,11 @@ export function scrollTo(el: Element, hash: string, smooth = false) {
292291
target.getBoundingClientRect().top -
293292
offset +
294293
targetPadding
295-
// only smooth scroll if distance is smaller than screen height.
296294
function scrollToTarget() {
297-
if (
298-
!smooth ||
299-
Math.abs(targetTop - window.scrollY) > window.innerHeight
300-
) {
295+
// only smooth scroll if distance is smaller than screen height.
296+
if (!smooth || Math.abs(targetTop - window.scrollY) > window.innerHeight)
301297
window.scrollTo(0, targetTop)
302-
} else {
303-
window.scrollTo({
304-
left: 0,
305-
top: targetTop,
306-
behavior: 'smooth'
307-
})
308-
}
298+
else window.scrollTo({ left: 0, top: targetTop, behavior: 'smooth' })
309299
}
310300
requestAnimationFrame(scrollToTarget)
311301
}
@@ -338,3 +328,11 @@ function shouldHotReload(payload: PageDataPayload): boolean {
338328
.slice(siteDataRef.value.base.length - 1)
339329
return payloadPath === locationPath
340330
}
331+
332+
function updateHistory(href: string) {
333+
if (inBrowser && href !== location.href) {
334+
// save scroll position before changing url
335+
history.replaceState({ scrollPosition: window.scrollY }, document.title)
336+
history.pushState(null, '', href)
337+
}
338+
}

0 commit comments

Comments
 (0)
Please sign in to comment.