Skip to content
This repository has been archived by the owner on Jan 11, 2023. It is now read-only.

Commit

Permalink
Fix hash link reliability (fix #434)
Browse files Browse the repository at this point in the history
  • Loading branch information
DayBr3ak committed Oct 13, 2018
1 parent abcac75 commit f2931b5
Show file tree
Hide file tree
Showing 3 changed files with 23 additions and 0 deletions.
5 changes: 5 additions & 0 deletions templates/src/client/start/index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -83,6 +83,11 @@ function handle_click(event: MouseEvent) {
const svg = typeof a.href === 'object' && a.href.constructor.name === 'SVGAnimatedString';
const href = String(svg ? (<SVGAElement>a).href.baseVal : a.href);

// If we are clicking on the same hash we still want to scroll to it anyway.
if (location.hash && href === location.href) {
return;
}

if (href === location.href) {
event.preventDefault();
return;
Expand Down
1 change: 1 addition & 0 deletions test/apps/scroll/src/routes/tall-page.html
Original file line number Diff line number Diff line change
@@ -1,3 +1,4 @@
<a href="tall-page#foo">scroll to foo</a>
<div style="height: 9999px"></div>

<div id="foo">
Expand Down
17 changes: 17 additions & 0 deletions test/apps/scroll/test.ts
Original file line number Diff line number Diff line change
Expand Up @@ -33,6 +33,23 @@ describe('scroll', function() {
assert.ok(scrollY > 0, scrollY);
});

it('scrolls to any deeplink if it was already active', async () => {
await page.goto(`${base}/tall-page#foo`);
await start();

let scrollY = await page.evaluate(() => window.scrollY);
assert.ok(scrollY > 0, scrollY);

await page.evaluate(() => window.scrollTo(0, 0));
scrollY = await page.evaluate(() => window.scrollY);
assert.ok(scrollY === 0, scrollY);

await page.click('[href="tall-page#foo"]');
await wait(50);
scrollY = await page.evaluate(() => window.scrollY);
assert.ok(scrollY > 0, scrollY);
});

it('resets scroll when a link is clicked', async () => {
await page.goto(`${base}/tall-page#foo`);
await start();
Expand Down

0 comments on commit f2931b5

Please sign in to comment.