2.2 KiB
2.2 KiB
Issue #200 Artifact — SPA host→player phase sync (no reload)
Scope
Acceptance for [READY][SPA][P14] Gameplay MVP-del 5:
- Host handlinger (
start round/næste fase) propagere korrekt til player-ruter i SPA. - Happy-path artefakt for én fuld faseovergang uden page reload.
- Sync-fejl giver kontrolleret fallback/error state.
Afgrænsning overholdt: ingen nye spilregler og ingen redesign af backend event-model.
Happy-path faseovergang (uden page reload)
Reference-flow i Angular shell:
-
Host starter runde/fase
- Host action kalder backend endpoint (
POST /lobby/sessions/:code/starteller fase-endpoint) - Host shell hydrerer session igen (
GET /lobby/sessions/:code) - Host route synkes via hash-rewrite i samme SPA shell:
#/host/<phase>/<CODE>- Implementeret i
HostShellComponent.syncRouteFromSession()
- Host action kalder backend endpoint (
-
Player modtager ny fase via state sync
- Player shell kører periodisk session-refresh (3s), uden hard reload
- Når
session.statusændrer sig, synkes hash-route i samme SPA shell:#/player/<phase>/<CODE>- Implementeret i
PlayerShellComponent.syncRouteFromSession()
-
Ingen page reload
- Routing sker med
window.history.replaceState(...) - URL opdateres i eksisterende SPA instans (ingen template-hop, ingen full refresh)
- Routing sker med
Kontrolleret fallback ved sync-fejl
Når player-sync fejler (netværk/fetch/session-refresh):
- UI går i kontrolleret connection-state:
reconnectingved online netværksfejlofflinenår browser rapporterer offline
- Fejl vises med retry/back-to-join handlinger
- Reconnect forsøges igen via timer (
scheduleReconnect) uden at crashe shell
Verifikation (tests)
Kørt i frontend/angular med Vitest:
src/app/features/host/host-shell.component.spec.ts- Verificerer host-faseflow og hash-route sync uden reload
src/app/features/player/player-shell.component.spec.ts- Verificerer periodisk player state sync + hash-route sync
- Verificerer reconnect/offline fallback ved sync-fejl
src/app/api-contract-smoke.spec.tssrc/app/session-route-context.spec.ts
Kommando:
npm test -- --reporter=dot
Resultat: 4/4 testfiler grønne, 22/22 tests bestået.