⚙️ 🤖 SPA-Navigation: Player überlebt Seitenwechsel (nahtloses Weiterspielen, Ansatz B) #58
Labels
No labels
Compat/Breaking
Kind/Bug
Kind/Documentation
Kind/Enhancement
Kind/Feature
Kind/Security
Kind/Testing
Priority/Critical
Priority/High
Priority/Low
Priority/Medium
Reviewed/Confirmed
Reviewed/Duplicate
Reviewed/Invalid
Reviewed/Won't Fix
Status/Abandoned
Status/Blocked
Status/Need More Info
Status/Needs-v00-Abnahme
No milestone
No project
No assignees
1 participant
Notifications
Due date
No due date set.
Dependencies
No dependencies set.
Reference
Zentonic/zentonic-publisher#58
Loading…
Add table
Add a link
Reference in a new issue
No description provided.
Delete branch "%!s()"
Deleting a branch is permanent. Although the deleted branch may continue to exist for a short time before it actually gets removed, it CANNOT be undone in most cases. Continue?
███████░░░████████░░██████░░░░████████░░███████░░░Ziel
Nahtloses Weiterspielen ueber Seitenwechsel. Ansatz A (statische Multi-Page + sessionStorage) kann das prinzipiell nicht — bei jedem Full-Page-Load stirbt das
<audio>+ Autoplay ist geblockt. Holm-Entscheidung: Ansatz B (SPA-Navigation). Loest zugleich #53 (nahtlose Persistenz) und macht den Cross-Episode-Bug (#2, sessionStorage-Rehydrate-Handler) obsolet.Architektur — JS-Enhancement ueber statischer Basis
Kein No-JS-Player-Fallback noetig (Holm-Vorgabe): Fuer den rohen/statischen Zugang gibt es den Download-Button. Die Seiten sind statisch generierte
.htmlmit echten<a href>-Links — Deep-Links, SEO und Direktaufruf funktionieren dadurch automatisch, ohne Extra-Aufwand. Ohne JS: normale Full-Page-Navigation, KEIN Player (Download deckt den Audio-Zugang ab). Player + nahtlose Navigation sind bewusst reines JS-Enhancement — kein Aufwand fuer No-JS-Player-UX. Mit JS: Klick-Interception + Content-Swap.<audio>+ Header liegen im<body>AUSSERHALB des geswappten Bereichs (bereits so: Sticky am Body-Ende in base.html.j2). Nur<main>wird ausgetauscht → Player-Element bleibt am Leben, Audio laeuft durch..html) ab:preventDefault→fetch(href)→ aus der Antwort das neue<main>extrahieren → aktuelles<main>ersetzen →document.title+ og/meta updaten →history.pushState.play-from,folge abspielen) fuer den NEUEN<main>-Inhalt neu verdrahten. Ein idempotentesinitPage(root)statt einmaligemDOMContentLoaded. Episode-Daten (slug/src/title) aus data-Attributen im geswappten Content lesen (z.B.data-ep-src/-title/-slugam play-btn oder<main>).folge abspielen+ Kapitel steuern den durchlaufenden Sticky-Player direkt (src wechseln nur wenn andere Folge; sonst nur play/seek). Bei Wechsel auf andere Folge: src neu + currentTime=0 (sauber, da kein Rehydrate-Handler mehr).<main>),aria-liveoptional; kein Scroll-Sprung-Bug.Verify-PFLICHT (Worker + v00)
Real testen (CDP/Browser), nicht statisch:
folge abspielen→ B ab 0 (NICHT A's Position auf B — #2 darf nicht wiederkommen)..html), Download-Button vorhanden — kein Player erwartet.v00-Abnahme #58 — SPA nahtlos, ein Rest (bleibt offen)
CDP-verifiziert (echte Link-Klicks + Marker-Test, kein Page.navigate):
Funktioniert:
.html): SPA-Swap nahtlos —window-Marker ueberlebt (kein Reload),<main>getauscht, Player laeuft durch. Folgenwechsel +folge abspielensauber (B ab 0, kein Cross-Episode-Bug). Damit sind das Stocken (#1) und die falsche Position (#2) zwischen Folgen geloest.Rest-Bug:
../→/) macht einen Full-Page-Reload statt SPA-Swap (Marker WEG). Audio stockt nur beim Zurueckgehen zur Uebersicht.if (!/\.html$/.test(url.pathname)) return false;— der Index-Link endet auf/, nicht.html, wird also nicht als SPA-Ziel erkannt.fix/58b-index-link-spa): Filter um Verzeichnis-Index (/$) erweitern bzw.navigateTo('/')das index-<main>fetchen lassen.Bleibt offen bis der Index-Link ebenfalls per SPA laeuft.
SPA-Navigation gemerged — Player überlebt Seitenwechsel nahtlos (Ansatz B)
Gemerged nach
dev(28ec849, Branchfeat/58-spa-player).Architektur:
<audio>+ Header) außerhalb<main#main-content>— nur<main>wird geswappt, Audio läuft durch..html-Links →fetch()+ DOMParser →<main>-Ersatz +document.title/OG-Meta-Update +history.pushState;popstatefür Back/Forward (Fehler fallen sauber auf echte Navigation zurück).initPage(root, isInitialLoad): Play/Kapitel via einmaliger Event-Delegation andocument(keine Doppel-Handler); Episode-Daten viadata-ep-src/-title/-slug. SPA-Swap lädt NICHT automatisch (würde laufende Wiedergabe abwürgen) — nur echter Doc-Load/Deep-Link bereitet vor.<script>im Fragment (Commento) viareviveScripts()nach Swap neu ausgeführt..html(SEO/Deep-Link), Download-Button deckt statisch.ECHTER CDP-Test (Headless-Chromium, node-Static-Server, Trusted-Input) — 14/14 grün:
srcbleibt A,paused:false,currentTimeläuft über den Swap ohne Reset (0.16→0.99s).folge abspielen→src→B,currentTime:0(NICHT A's Position — #2 kommt nicht wieder).history.back()→ korrekte Seite, Player läuft weiter (2.10s).Für v00-CDP-Abnahme: dasselbe Szenario + Stream/Chat (temporär
[stream]+chat_urlin Demo). Hinweise: (a) 2.history.back()über echten Full-Load-Eintrag triggert Chrome-BFCache (Browser-Mechanik, kein Router-Bug); (b)updateMetadeckt nicht og:audio/ld+json (Crawler-irrelevant); (c).zt-main→main#main-contentflex verschoben (Pixel-Gegencheck Index/Episode).Grün → #58 + #59 + #53 (Dach) schließbar.
P07 gemerged — Index-Link ist jetzt SPA (kein Reload mehr)
Gemerged nach
dev(d3e82a7, Branchfix/58b-index-link-spa).Root Cause: Der Router (
isInternalNavLink, base.html.j2) erkannte SPA-Ziele nur per/\.html$/. „zurück zur Übersicht" + Logo zeigen aufbase_href(..//./) → nachnew URL()endet der Pfad auf/→ fiel durch → Full-Reload.Fix (Ein-Zeiler):
if (!/\.html$/.test(url.pathname) && !/\/$/.test(url.pathname)) return false;—/-Verzeichnis-Ziele zählen jetzt als SPA.swapMain()extrahiertmain#main-contentgenerisch (auch aus index.html) → kein Template-Change nötig. Origin-/Download-/Anker-Checks unverändert davor.ECHTER CDP-Test (Headless-Chromium, HTTP-Server, Trusted-Input) — grün:
window.__markerüberlebt Klick auf „zurück zur Übersicht" ('alive', kein Reload) ✓audio.paused:false,currentTimenahtlos 1.43→2.40→3.60s (kein Reset) ✓<main>nach Swap = Index-Grid (gridCount:6), URL/Title=Index ✓kind:streamerhalten, Chat-iframe-src erhalten, Toggles funktional) ✓Bereit zur finalen v00-CDP-Abnahme → grün: #58 + #53 (Dach) schließbar.
v00-Abnahme #58 — PASS (SPA vollständig, laufzeit-bewiesen)
Nach
fix/58b(Index-Link als SPA-Ziel) CDP-verifiziert am Standd3e82a7(echte Link-Klicks +window-Marker, kein Page.navigate):.html)../)folge abspielenmarker=YESdurchgehend = keine interne Navigation macht mehr einen Reload → echtes nahtloses Weiterspielen. #1 (Stocken) + #2 (Cross-Episode-Position) vollstaendig geloest.Regression-Check gruen: Live-Stream (
seek_disabled/times=live/kind=stream) + Chat (iframe lazy-loadkiwiirc) funktionieren nach dem SPA-Umbau weiter. Seekbar (#59) 18px.Kein Blocker. Geschlossen durch v00.