Wie wird der Hauptmenü-Link/Panel (Hamburger) generiert?

[stance455 (Nader)]

Entschuldigen Sie meine mangelnde Fachkenntnis zu diesem Thema, aber wie verarbeitet Discourse das Klicken auf den Hamburger-Menü-Link?

Kontext: Ich verwende den prerender.io-Dienst, um eine HTML-Version der Hauptseite (JS-Version der Website) bereitzustellen.
Der Hamburger-Link <s class="menu"> funktioniert nicht.

Sie können (die Seite) testen, indem Sie die Chrome-Entwicklertools verwenden und den Agenten auf Googlebot-Smartphone ändern. Wenn Sie den Googlebot-User-Agent verwenden, erhalten Sie im Wesentlichen die HTML-Prerender-Version.

Nebenbemerkung: Laut diesem Blogbeitrag von prerender kann es Probleme mit Code wie

`<a>Anchor</a>`
`<a href="javascript:goTo('page')">Anchor</a>`
`<span onclick="goTo('page')">Anchor</span>`

Alle Links müssen sich zwischen <a></a>-Tags befinden und eine Ziel-URL im href-Attribut definieren, damit Google sie finden und verfolgen kann.

Vielleicht wird der Hauptmenü-Link mit dieser Methode generiert?

Jede Idee für eine Lösung wäre sehr willkommen.

Bearbeiten: Ich habe die Seite vorerst von prerender entfernt (behalte aber die JS-Version für Bots bei) – Überraschenderweise scheint Google Bot sie gelegentlich korrekt zu rendern. Ich habe auch keine Menüprobleme, wenn ich Google Bot als User-Agent in Chrome verwende. Ich werde dies eine Weile testen.

[stance455 (Nader)]

Entschuldigen Sie bitte, ich habe eine einfache Frage sehr verwirrend gemacht …

Die Links innerhalb des Menüs scheinen in Ordnung zu sein, mein Problem ist nur der eigentliche Hamburger-Link selbst – wenn er mit Prerender gerendert wird, öffnet er sich einfach nicht.

Dieser Beitrag von @Johani war sehr hilfreich bei der Diagnose.

Bin ich auf dem richtigen Weg bei der Betrachtung dieses Codeausschnitts (was die Funktionalität betrifft, wenn man auf das Hamburger-Menü klickt)?

[awesomerobot (Kris)]

Das Menü wird mit Javascript an das Dokument angehängt, wenn der Button geklickt wird, daher wird es nicht einfach in eine reine HTML-Version der Seite konvertiert werden können.

Hier wird der Button hinzugefügt, Sie können sehen, dass er eine Aktion namens toggleHamburger hat:

https://github.com/discourse/discourse/blob/main/app/assets/javascripts/discourse/app/widgets/header.js#L246

Die Aktion toggleHamburger ist später in derselben Datei definiert, hier:
https://github.com/discourse/discourse/blob/main/app/assets/javascripts/discourse/app/widgets/header.js#L483

toggleHamburger ändert den Zustand von hamburgerVisible, sodass das Menü letztendlich mit panels.push(this.attach("hamburger-menu")); hinzugefügt wird, was Sie hier sehen können:
https://github.com/discourse/discourse/blob/main/app/assets/javascripts/discourse/app/widgets/header.js#L379

[stance455 (Nader)]

Qualitativ hochwertige Antwort @awesomerobot, ich bin sicher, die Community weiß sie zu schätzen.

Ich werde das prüfen, um zu sehen, ob kundenspezifische Arbeit es wert ist.

Die Antwort, die ich von prerender.io erhielt, lautete im Grunde, dass es wahrscheinlich nicht funktionieren wird, wenn es „komplizierte JS“ verwendet. Ich bin mir jedoch nicht sicher, wie gut sie die Situation untersucht haben.