# Navigating to local URL fragment doesn't modify browser history

**URL:** https://meta.discourse.org/t/navigating-to-local-url-fragment-doesnt-modify-browser-history/155624
**Category:** Support
**Created:** [June 22, 2020, 9:35pm UTC](https://meta.discourse.org/t/navigating-to-local-url-fragment-doesnt-modify-browser-history/155624 "2020-06-22T21:35:49Z")
**Posts on this page:** 12
**Page:** 1

<div class="post-metadata">

### Author: ![gar1t](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/gar1t/32/380142_2.png) [@gar1t](https://meta.discourse.org/u/gar1t)
#### Post date: [June 22, 2020, 9:35pm UTC](https://meta.discourse.org/t/navigating-to-local-url-fragment-doesnt-modify-browser-history/155624/1 "2020-06-22T21:35:49Z")

</div>

When I include a [link to a section in a page](#link-target) - that link, when clicked, does not modify the browser history. Navigating back proceeds to navigate away from the pager, rather than return to page position where the link is defined.

Edit: Well on this Discourse I’m unable to create an element with an ID, so I can’t demo this here. The source here is what I’d like to be doing - but this is just to illustrate and doesn’t impact the gist of my issue:

```plaintext
<div id="link-target"></div>

*This section is linked to from above. Nothing to see here.*

```

---

<div class="post-metadata">

### Author: ![Falco](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/falco/32/179432_2.png) [@Falco](https://meta.discourse.org/u/Falco)
#### Post date: [June 22, 2020, 9:42pm UTC](https://meta.discourse.org/t/navigating-to-local-url-fragment-doesnt-modify-browser-history/155624/2 "2020-06-22T21:42:59Z")

</div>

This is kinda of expected. If you click a link to another post in the same topic it is also not pushed into the history stack, and it is a full link without fragments, so we never push in-topic into the history.

---

<div class="post-metadata">

### Author: ![gar1t](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/gar1t/32/380142_2.png) [@gar1t](https://meta.discourse.org/u/gar1t)
#### Post date: [June 22, 2020, 10:04pm UTC](https://meta.discourse.org/t/navigating-to-local-url-fragment-doesnt-modify-browser-history/155624/3 "2020-06-22T22:04:20Z")

</div>

I find this behavior extremely unexpected 🙂

Here’s a sample page with no JavaScript. On Chromium, clicking that link takes you to the bottom of the page. Clicking back takes you back to where you clicked from. That’s expected behavior that you’ll see on every other website that doesn’t eat this history.

```html
<a href="#target">link</a>

<div style="height:2000px"></div>

<div id="target">Hello</div>

```

I assume Discourse is handling URL fragments in JavaScript by scrolling to the location and therefore the history would have to be explicitly pushed.

@codinghorror expresses a strong and final opinion about this [here](https://meta.discourse.org/t/push-browser-history-when-navigating-within-a-topic/109613/6). It’s surprising to see such a strong opinion about a change to standard web browser behavior. In fairness I haven’t yet used Discourse for heavy duty topic navigation and therefore can’t appreciate the obviousness of his argument.

I’m using Discourse in part for [documentation](https://my.guild.ai) and this behavior is extremely disruptive to the point that I’m afraid to click a link and lose my place on a page.

---

<div class="post-metadata">

### Author: ![gar1t](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/gar1t/32/380142_2.png) [@gar1t](https://meta.discourse.org/u/gar1t)
#### Post date: [June 22, 2020, 10:43pm UTC](https://meta.discourse.org/t/navigating-to-local-url-fragment-doesnt-modify-browser-history/155624/4 "2020-06-22T22:43:26Z")

</div>

Here’s an example of where this behavior is problematic:

[https://meta.discourse.org/tos](https://meta.discourse.org/tos)

If you’re tempted to click any of the TOC links and then return to your starting point via browser history, you can’t.

Why provide a TOC in the first place?

For those sites that would like to support the standard browser navigation, any suggestions?

I’m looking into monkeypatching the scroll-to-element behavior that I suspect is behind this but I’m starting with literally no knowledge of the codebase 🙂 I’ll get there eventually but if someone has some pointers, I appreciate the help!

---

<div class="post-metadata">

### Author: ![Canapin](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/canapin/32/119591_2.png) [@Canapin](https://meta.discourse.org/u/Canapin)
#### Post date: [June 22, 2020, 10:53pm UTC](https://meta.discourse.org/t/navigating-to-local-url-fragment-doesnt-modify-browser-history/155624/5 "2020-06-22T22:53:17Z")

</div>

Depending on the context which you’ll use your anchors in, maybe this [table of content](https://meta.discourse.org/t/discotoc-automatic-table-of-contents/111143) plugin could be useful (and in my opinion that would fit well on the TOS and FAQ page)?  
Example [here](https://meta.discourse.org/t/developer-s-guide-to-discourse-themes/93648).

---

<div class="post-metadata">

### Author: ![jtbayly](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/jtbayly/32/119510_2.png) [@jtbayly](https://meta.discourse.org/u/jtbayly)
#### Post date: [June 22, 2020, 10:56pm UTC](https://meta.discourse.org/t/navigating-to-local-url-fragment-doesnt-modify-browser-history/155624/6 "2020-06-22T22:56:43Z")

</div>

I never realized this was bothering me until you pointed it out. I’ve often tried to go back to where I clicked a link in Discourse and instead ended up on a previous page. Very irritating. I always chalked it up to a combination of the iOS app, since I use it for almost all Discourse stuff, and user error.

---

<div class="post-metadata">

### Author: ![gar1t](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/gar1t/32/380142_2.png) [@gar1t](https://meta.discourse.org/u/gar1t)
#### Post date: [June 22, 2020, 11:06pm UTC](https://meta.discourse.org/t/navigating-to-local-url-fragment-doesnt-modify-browser-history/155624/7 "2020-06-22T23:06:22Z")

</div>

This TOC component is really well done and we’re using it in every docs page - very grateful for the work put into it!

The issue of navigation remains however. Clicking a link in the TOC does not modify the browser history and therefore navigating back navigates off the page.

---

<div class="post-metadata">

### Author: ![sam](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/sam/32/102149_2.png) [@sam](https://meta.discourse.org/u/sam)
#### Post date: [June 23, 2020, 6:15am UTC](https://meta.discourse.org/t/navigating-to-local-url-fragment-doesnt-modify-browser-history/155624/8 "2020-06-23T06:15:22Z")

</div>

> [@gar1t](#):
>
> The issue of navigation remains however. Clicking a link in the TOC does not modify the browser history and therefore navigating back navigates off the page.

This is certainly the case, It would be nice to fix this @Johani but I have a feeling it is very complicated. Maybe we just pushstate when you click on a TOC link

---

<div class="post-metadata">

### Author: ![gar1t](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/gar1t/32/380142_2.png) [@gar1t](https://meta.discourse.org/u/gar1t)
#### Post date: [June 23, 2020, 1:52pm UTC](https://meta.discourse.org/t/navigating-to-local-url-fragment-doesnt-modify-browser-history/155624/9 "2020-06-23T13:52:53Z")

</div>

I implemented a work-around (arguably a proper approach to customize a site given Discourse’s point-of-view on link navigation) via a theme component. This follows the pattern used by DiscoTOC where a marker is added to a post to trigger the behavior. The applicable code is [here](https://github.com/guildai/my-guild-ai-tweaks/blob/915cd2378896e9bb4cf636718bd4976b347b2e7f/common/header.html#L18-L33).

I think modifying DiscoTOC to use URL fragments and browser history is a good idea. This requires changing the component’s approach to navigation, which is not a minor change. DiscoTOC uses data attributes to pass along targets rather than link href’s. There’s no attempt to reflect the new page location in the browser URL (window.location).

I think the pattern I’m using above could work for DiscoTOC but that has broader implications for that component given its current approach.

---

<div class="post-metadata">

### Author: ![sam](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/sam/32/102149_2.png) [@sam](https://meta.discourse.org/u/sam)
#### Post date: [June 24, 2020, 12:24am UTC](https://meta.discourse.org/t/navigating-to-local-url-fragment-doesnt-modify-browser-history/155624/10 "2020-06-24T00:24:12Z")

</div>

careful with pushstate there… what you probably want is replacestate.

---

<div class="post-metadata">

### Author: ![gar1t](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/gar1t/32/380142_2.png) [@gar1t](https://meta.discourse.org/u/gar1t)
#### Post date: [June 24, 2020, 12:41am UTC](https://meta.discourse.org/t/navigating-to-local-url-fragment-doesnt-modify-browser-history/155624/11 "2020-06-24T00:41:41Z")

</div>

I think pushState in this case. The goal is to enable back-to-previous-position, which requires a push to history because the event is prevented.

---

<div class="post-metadata">

### Author: ![deltamotion](https://avatars.discourse-cdn.com/v4/letter/d/73ab20/32.png) [@deltamotion](https://meta.discourse.org/u/deltamotion)
#### Post date: [June 25, 2020, 6:12am UTC](https://meta.discourse.org/t/navigating-to-local-url-fragment-doesnt-modify-browser-history/155624/12 "2020-06-25T06:12:10Z")

</div>

This is why there used to be little “return to top” links at the bottom of each (adapting for this example) TOS entry… 🤔
