fix(app): add error handling to PdfViewer renderPage and VideoPlayer initHls

Prevents unhandled promise rejections from async watchers and lifecycle hooks.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

packages/app/src/components/renderers/PdfViewer.vue

@@ -124,20 +124,24 @@ async function renderPage() {
   const canvas = canvasRef.value
   if (!doc || !canvas) return
 
-  const page = await doc.getPage(currentPage.value)
+  try {
-  const viewport = page.getViewport({ scale: scale.value })
+    const page = await doc.getPage(currentPage.value)
+    const viewport = page.getViewport({ scale: scale.value })
 
-  canvas.height = viewport.height
+    canvas.height = viewport.height
-  canvas.width = viewport.width
+    canvas.width = viewport.width
 
-  const ctx = canvas.getContext('2d')
+    const ctx = canvas.getContext('2d')
-  if (!ctx) return
+    if (!ctx) return
 
-  await page.render({
+    await page.render({
-    canvasContext: ctx,
+      canvasContext: ctx,
-    canvas: canvas,
+      canvas: canvas,
-    viewport,
+      viewport,
-  }).promise
+    }).promise
+  } catch (e) {
+    error.value = `Failed to render page: ${e instanceof Error ? e.message : 'Unknown error'}`
+  }
 }
 
 function goToPage(page: number) {

packages/app/src/components/renderers/VideoPlayer.vue

@@ -58,24 +58,30 @@ const isHls = computed(() =>
 type HlsInstance = import('hls.js').default
 const hls = shallowRef<HlsInstance | null>(null)
 
+const hlsError = ref('')
+
 async function initHls() {
   if (!isHls.value || !videoRef.value || youtubeId.value) return
 
-  const HlsModule = await import('hls.js')
+  try {
-  const Hls = HlsModule.default
+    const HlsModule = await import('hls.js')
+    const Hls = HlsModule.default
 
-  if (!Hls.isSupported()) {
+    if (!Hls.isSupported()) {
-    // Try native HLS support (Safari)
+      // Try native HLS support (Safari)
-    if (videoRef.value.canPlayType('application/vnd.apple.mpegurl')) {
+      if (videoRef.value.canPlayType('application/vnd.apple.mpegurl')) {
-      videoRef.value.src = props.url
+        videoRef.value.src = props.url
+      }
+      return
     }
-    return
-  }
 
-  const instance = new Hls()
+    const instance = new Hls()
-  instance.loadSource(props.url)
+    instance.loadSource(props.url)
-  instance.attachMedia(videoRef.value)
+    instance.attachMedia(videoRef.value)
-  hls.value = instance
+    hls.value = instance
+  } catch (e) {
+    hlsError.value = `Failed to initialize video: ${e instanceof Error ? e.message : 'Unknown error'}`
+  }
 }
 
 onMounted(() => {