Files
weirsoe-party-protocol/docs/ISSUE-200-SPA-HOST-PLAYER-PHASE-SYNC-ARTIFACT.md
Asger Geel Weirsoee abe0d91080
All checks were successful
CI / test-and-quality (push) Successful in 2m57s
CI / test-and-quality (pull_request) Successful in 2m58s
docs(issue-200): align artifact test list with head
2026-03-01 19:48:26 +00:00

2.2 KiB

Issue #200 Artifact — SPA host→player phase sync (no reload)

Scope

Acceptance for [READY][SPA][P14] Gameplay MVP-del 5:

  1. Host handlinger (start round / næste fase) propagere korrekt til player-ruter i SPA.
  2. Happy-path artefakt for én fuld faseovergang uden page reload.
  3. 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:

  1. Host starter runde/fase

    • Host action kalder backend endpoint (POST /lobby/sessions/:code/start eller 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()
  2. 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()
  3. Ingen page reload

    • Routing sker med window.history.replaceState(...)
    • URL opdateres i eksisterende SPA instans (ingen template-hop, ingen full refresh)

Kontrolleret fallback ved sync-fejl

Når player-sync fejler (netværk/fetch/session-refresh):

  • UI går i kontrolleret connection-state:
    • reconnecting ved online netværksfejl
    • offline nå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.ts
  • src/app/session-route-context.spec.ts

Kommando:

npm test -- --reporter=dot

Resultat: 4/4 testfiler grønne, 22/22 tests bestået.