feat: add ErrorBoundary component with onErrorCaptured (BUG-F5)

Catches runtime errors in child components, displays user-friendly
error message with reload button. Wired into App.vue wrapping
router-view. Tests verify error capture and button rendering.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Dorian
2026-03-12 23:15:28 +00:00
co-authored by Claude Opus 4.6
parent 74cb5cc728
commit e7d3cab85a
3 changed files with 93 additions and 1 deletions
+4 -1
View File
@@ -2,6 +2,7 @@
import { onMounted } from 'vue'
import { RouterView } from 'vue-router'
import NavBar from './components/NavBar.vue'
import ErrorBoundary from './components/ErrorBoundary.vue'
import { ensureAudioContext } from './game/audio'
// Unlock AudioContext + SpeechSynthesis on first user interaction (mobile requires gesture)
@@ -21,7 +22,9 @@ onMounted(() => {
<div class="fixed inset-0 crt-overlay z-40" />
<NavBar />
<main class="flex-1 min-h-0 relative z-10 overflow-y-auto pb-14 md:pb-0">
<RouterView />
<ErrorBoundary>
<RouterView />
</ErrorBoundary>
</main>
</div>
</template>