Navigieren zu lokalen URL-Fragmenten ändert den Browserverlauf nicht

Wenn ich einen Link zu einem Abschnitt auf einer Seite einfüge, wird der Browserverlauf beim Klicken auf diesen Link nicht geändert. Das Zurücknavigieren führt dazu, dass man von der Seite weg navigiert, anstatt zur Position auf der Seite zurückzukehren, an der der Link definiert ist.

Edit: Nun, auf diesem Discourse kann ich kein Element mit einer ID erstellen, sodass ich dies hier nicht demonstrieren kann. Der folgende Quellcode ist das, was ich gerne tun würde – dies dient jedoch nur der Veranschaulichung und hat keinen Einfluss auf den Kern meines Problems:

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

*Dieser Abschnitt ist von oben verlinkt. Hier gibt es nichts zu sehen.*

Das ist gewissermaßen zu erwarten. Wenn du auf einen Link zu einem anderen Beitrag im selben Thema klickst, wird dieser ebenfalls nicht in den Verlaufstapel übernommen, und es handelt sich um einen vollständigen Link ohne Fragmente. Daher fügen wir keine in-Thema-Links in den Verlauf ein.

Ich finde dieses Verhalten extrem unerwartet :slight_smile:

Hier ist eine Beispielseite ohne JavaScript. In Chromium führt das Klicken auf diesen Link ans Ende der Seite. Ein Klick auf „Zurück

Hier ist ein Beispiel, wo dieses Verhalten problematisch ist:

https://meta.discourse.org/tos

Wenn Sie auf einen der Links im Inhaltsverzeichnis klicken und dann über den Browserverlauf zu Ihrem Ausgangspunkt zurückkehren möchten, ist das nicht möglich.

Warum überhaupt ein Inhaltsverzeichnis bereitstellen?

Für diejenigen Seiten, die die Standard-Browsernavigation unterstützen möchten: Gibt es Vorschläge?

Ich untersuche derzeit das „Monkeypatching

Je nachdem, in welchem Kontext Sie Ihre Anker verwenden werden, könnte dieses Inhaltsverzeichnis-Plugin nützlich sein (und meiner Meinung nach würde es gut auf die Seite mit den AGB und den FAQ passen)?
Beispiel hier.

Ich habe erst bemerkt, dass mich das gestört hat, als du es erwähnt hast. Ich habe oft versucht, zurück zu dem Punkt zu gelangen, an dem ich in Discourse auf einen Link geklickt habe, und landete stattdessen auf einer vorherigen Seite. Das ist sehr ärgerlich. Ich habe das immer auf eine Kombination aus der iOS-App, da ich sie für fast alles in Discourse nutze, und auf eigene Fehler geschoben.

Diese TOC-Komponente ist wirklich hervorragend umgesetzt und wir nutzen sie auf jeder Dokumentationsseite – wir sind sehr dankbar für die darin investierte Arbeit!

Das Problem der Navigation bleibt jedoch bestehen. Beim Klicken auf einen Link in der TOC wird der Browserverlauf nicht aktualisiert, sodass das Zurück-Navigieren dazu führt, dass man die Seite verlässt.

Das ist definitiv der Fall. Es wäre schön, dies zu beheben, @Johani, aber ich habe das Gefühl, dass es sehr kompliziert ist. Vielleicht nutzen wir einfach pushstate, wenn man auf einen Link im Inhaltsverzeichnis klickt.

Ich habe einen Workaround implementiert (der aus der Perspektive von Discourse zur Anpassung einer Website im Hinblick auf die Link-Navigation durchaus als angemessener Ansatz gelten könnte) über eine Theme-Komponente. Dies folgt dem Muster von DiscoTOC, bei dem ein Marker zu einem Beitrag hinzugefügt wird, um das Verhalten auszulösen. Der entsprechende Code befindet sich hier.

Ich finde, es wäre eine gute Idee, DiscoTOC so anzupassen, dass es URL-Fragmente und den Browserverlauf nutzt. Dies erfordert eine Änderung des Navigationsansatzes der Komponente, was keine geringfügige Änderung ist. DiscoTOC verwendet Datenattribute, um Ziele weiterzugeben, anstatt Link-Hrefs. Es wird nicht versucht, den neuen Seitenstandort in der Browser-URL (window.location) widerzuspiegeln.

Ich denke, dass das oben von mir verwendete Muster auch für DiscoTOC funktionieren könnte, aber dies hat aufgrund des aktuellen Ansatzes dieser Komponente weitreichendere Auswirkungen.

Vorsicht mit pushstate dort… was du wahrscheinlich brauchst, ist replacestate.

Ich denke, in diesem Fall ist es pushState. Das Ziel ist es, das Zurück zum vorherigen Standort zu ermöglichen, was einen Eintrag in den Verlauf erfordert, da das Ereignis verhindert wird.

Deshalb gab es früher unten bei jedem (für dieses Beispiel angepassten) Eintrag der AGB einen kleinen „Nach oben