Refresh and back button bug leads to empty hash/anchor (#)
Closed this issue · 3 comments
This is a great lightweight script. There's a bug involving refreshes (I've only tested this using the vanilla JS version). This is how you reproduce it.
Cllick an anchored link:
Refresh the page, then click the back button, and instead of properly returning to:
It returns to:
It's caused by this part of the code:
var currentHash = location.hash;
if (currentHash) {
// fix hash
setTimeout(function () {
location.hash = ''; // This is the problem line
location.hash = currentHash;
}, 0);
}
The problem is you're setting location.hash
to an empty string, then setting it to currentHash
This is what's causing every browser I've used to insert the #
Removing
location.hash = '';
solves the problem.
Another way to reproduce this is when clicking an anchor that leads to another URL:
http://example.com/page-1
http://example.com/page-9#something
Clicking the back button returns to:
Thanks.
Thanks for reporting! I almost forgot this script😂
It was a hack to force browsers scroll to anchor after reloading page, since TOC ids are initialized after page is rendered.
I'll fix it soon. Hope the gulp scripts could still work after two years 🤣
0.0.6 is out
Thanks @idiotWu it's working great now.