From bcc492f63f8d3e248b3cbba67cbc516420270920 Mon Sep 17 00:00:00 2001
From: Wesley Luyten <me@wesleyluyten.com>
Date: Fri, 6 Mar 2026 11:22:55 -0600
Subject: [PATCH] fix: ssr issue with hls.js (#758)

---
 packages/core/src/dom/media/hls/index.ts       | 14 +++++++-------
 packages/core/src/dom/media/hls/text-tracks.ts |  4 +++-
 2 files changed, 10 insertions(+), 8 deletions(-)

diff --git a/packages/core/src/dom/media/hls/index.ts b/packages/core/src/dom/media/hls/index.ts
index 178a9322..7f8906e4 100644
--- a/packages/core/src/dom/media/hls/index.ts
+++ b/packages/core/src/dom/media/hls/index.ts
@@ -14,30 +14,30 @@ const defaultConfig = {
 };
 
 export class HlsMediaDelegateBase implements MediaDelegate {
-  #engine = new Hls(defaultConfig);
+  #engine = Hls.isSupported() ? new Hls(defaultConfig) : null;
 
-  get engine(): Hls {
+  get engine(): Hls | null {
     return this.#engine;
   }
 
   attach(target: EventTarget): void {
-    this.#engine.attachMedia(target as HTMLMediaElement);
+    this.#engine?.attachMedia(target as HTMLMediaElement);
   }
 
   detach(): void {
-    this.#engine.detachMedia();
+    this.#engine?.detachMedia();
   }
 
   destroy(): void {
-    this.#engine.destroy();
+    this.#engine?.destroy();
   }
 
   set src(src: string) {
-    this.#engine.loadSource(src);
+    this.#engine?.loadSource(src);
   }
 
   get src(): string {
-    return this.#engine.url ?? '';
+    return this.#engine?.url ?? '';
   }
 }
 
diff --git a/packages/core/src/dom/media/hls/text-tracks.ts b/packages/core/src/dom/media/hls/text-tracks.ts
index a7caab85..16b357c2 100644
--- a/packages/core/src/dom/media/hls/text-tracks.ts
+++ b/packages/core/src/dom/media/hls/text-tracks.ts
@@ -4,7 +4,7 @@ import type { CuesParsedData, NonNativeTextTracksData } from 'hls.js';
 import Hls from 'hls.js';
 
 interface HlsEngineHost {
-  readonly engine: Hls;
+  readonly engine: Hls | null;
   attach?(target: EventTarget): void;
   detach?(): void;
 }
@@ -43,6 +43,8 @@ export function HlsMediaTextTracksMixin<Base extends Constructor<HlsEngineHost>>
 
       const { signal } = this.#disconnect;
       const { engine } = this;
+      if (!engine) return;
+
       const media = this.#target!;
 
       const onTracksFound = (_event: string, data: NonNativeTextTracksData) => {