canalplus · peaBerberian · Aug 6, 2026
diff --git a/src/main_thread/init/directfile_content_initializer.ts b/src/main_thread/init/directfile_content_initializer.ts
@@ -20,9 +20,7 @@
  */
 
 import type { IMediaElement } from "../../compat/browser_compatibility_types.ts";
-import clearElementSrc from "../../compat/clear_element_src.ts";
 import getStartDate from "../../compat/get_start_date.ts";
-import type { MediaError } from "../../errors/index.ts";
 import log from "../../log.ts";
 import type { IMediaElementPlaybackObserver } from "../../playback_observer/index.ts";
 import type { IKeySystemOption, IPlayerError } from "../../public_types.ts";
@@ -33,12 +31,12 @@ import type { IReadOnlySharedReference } from "../../utils/reference.ts";
 import type { CancellationSignal } from "../../utils/task_canceller.ts";
 import TaskCanceller from "../../utils/task_canceller.ts";
 import { ContentInitializer } from "./types.ts";
+import formatMediaError from "./utils/format_media_error.ts";
 import type { IInitialTimeOptions } from "./utils/get_initial_time.ts";
 import getLoadedReference from "./utils/get_loaded_reference.ts";
 import performInitialSeekAndPlay from "./utils/initial_seek_and_play.ts";
 import initializeContentDecryption from "./utils/initialize_content_decryption.ts";
 import RebufferingController from "./utils/rebuffering_controller.ts";
-import listenToMediaError from "./utils/throw_on_media_error.ts";
 
 /**
  * `ContentIntializer` which will load contents by putting their URL in the
@@ -93,8 +91,6 @@ export default class DirectFileContentInitializer extends ContentInitializer {
     const cancelSignal = this._initCanceller.signal;
     const { keySystems, speed, url } = this._settings;
 
-    clearElementSrc(mediaElement);
-
     // Set the autoplay attribute on the mediaElement.
     // On Apple devices, the native HLS player needs autoplay to be set
     // in order to start buffering,which is required for our API's autoplay to work.
@@ -113,11 +109,9 @@ export default class DirectFileContentInitializer extends ContentInitializer {
     );
 
     /** Translate errors coming from the media element into RxPlayer errors. */
-    listenToMediaError(
-      mediaElement,
-      (error: MediaError) => this._onFatalError(error),
-      cancelSignal,
-    );
+    playbackObserver.addMediaErrorListener((mediaError) => {
+      this._onFatalError(formatMediaError(mediaError));
+    }, cancelSignal);
 
     /**
      * Class trying to avoid various stalling situations, emitting "stalled"
@@ -151,13 +145,7 @@ export default class DirectFileContentInitializer extends ContentInitializer {
 
         // Start everything! (Just put the URL in the element's src).
         log.info("Init", "Setting URL to HTMLMediaElement", { url });
-        mediaElement.src = url;
-        cancelSignal.register(() => {
-          log.info("Init", "Removing directfile src from media element", {
-            src: mediaElement.src,
-          });
-          clearElementSrc(mediaElement);
-        });
+        playbackObserver.linkUrl(url, false, cancelSignal);
 
         if (evt.initializationState.type === "awaiting-media-link") {
           evt.initializationState.value.isMediaLinked.setValue(true);
@@ -227,7 +215,6 @@ export default class DirectFileContentInitializer extends ContentInitializer {
     };
     performInitialSeekAndPlay(
       {
-        mediaElement,
         playbackObserver,
         startTime: initialTime,
         mustAutoPlay: autoPlay,

diff --git a/src/main_thread/init/media_source_content_initializer.ts b/src/main_thread/init/media_source_content_initializer.ts
@@ -18,7 +18,6 @@ import type {
   ISentLogValue,
 } from "../../core/types.ts";
 import { CoreMessageType } from "../../core/types.ts";
-import type { MediaError } from "../../errors/index.ts";
 import {
   deserializeMediaError,
   EncryptedMediaError,
@@ -72,13 +71,13 @@ import type { ITextDisplayerOptions } from "./types.ts";
 import { ContentInitializer } from "./types.ts";
 import type { ICorePlaybackObservation } from "./utils/create_core_playback_observer.ts";
 import createCorePlaybackObserver from "./utils/create_core_playback_observer.ts";
+import formatMediaError from "./utils/format_media_error.ts";
 import type { IInitialTimeOptions } from "./utils/get_initial_time.ts";
 import getInitialTime from "./utils/get_initial_time.ts";
 import getLoadedReference from "./utils/get_loaded_reference.ts";
 import performInitialSeekAndPlay from "./utils/initial_seek_and_play.ts";
 import RebufferingController from "./utils/rebuffering_controller.ts";
 import StreamEventsEmitter from "./utils/stream_events_emitter/stream_events_emitter.ts";
-import listenToMediaError from "./utils/throw_on_media_error.ts";
 import { updateManifestCodecSupport } from "./utils/update_manifest_codec_support.ts";
 
 const generateContentId = idGenerator();
@@ -385,11 +384,9 @@ export default class MediaSourceContentInitializer extends ContentInitializer {
     });
 
     /** Translate errors coming from the media element into RxPlayer errors. */
-    listenToMediaError(
-      mediaElement,
-      (error: MediaError) => this._onFatalError(error),
-      this._initCanceller.signal,
-    );
+    playbackObserver.addMediaErrorListener((mediaError) => {
+      this._onFatalError(formatMediaError(mediaError));
+    }, this._initCanceller.signal);
 
     /**
      * Send content protection initialization data.
@@ -1684,7 +1681,6 @@ export default class MediaSourceContentInitializer extends ContentInitializer {
     const {
       initialTime,
       autoPlay,
-      mediaElement,
       textDisplayer,
       playbackObserver,
       streamEventsEmitter,
@@ -1695,7 +1691,6 @@ export default class MediaSourceContentInitializer extends ContentInitializer {
 
     const { autoPlayResult, initialPlayPerformed } = performInitialSeekAndPlay(
       {
-        mediaElement,
         playbackObserver,
         startTime: initialTime,
         mustAutoPlay: autoPlay,

diff --git a/src/main_thread/init/utils/format_media_error.ts b/src/main_thread/init/utils/format_media_error.ts
@@ -0,0 +1,47 @@
+import { MediaError as RxPlayerMediaError } from "../../../errors/index.ts";
+import isNullOrUndefined from "../../../utils/is_null_or_undefined.ts";
+
+/**
+ * Format a `MediaError` as linked to an `HMTLMediaElement` into the
+ * corresponding RxPlayer's `MediaError`.
+ * @param {MediaError|null} mediaError - The media error currently linked to
+ * the media element.
+ * @returns {Object} - RxPlayer's `MediaError` instance corresponding to this
+ * error.
+ */
+export default function formatMediaError(
+  mediaError: MediaError | null,
+): RxPlayerMediaError {
+  let errorCode: number | undefined;
+  let errorMessage: string | undefined;
+  if (!isNullOrUndefined(mediaError)) {
+    errorCode = mediaError.code;
+    errorMessage = mediaError.message;
+  }
+
+  switch (errorCode) {
+    case 1:
+      errorMessage =
+        errorMessage ??
+        "The fetching of the associated resource was aborted by the user's request.";
+      return new RxPlayerMediaError("MEDIA_ERR_ABORTED", errorMessage);
+    case 2:
+      errorMessage =
+        errorMessage ??
+        "A network error occurred which prevented the media from being " +
+          "successfully fetched";
+      return new RxPlayerMediaError("MEDIA_ERR_NETWORK", errorMessage);
+    case 3:
+      errorMessage =
+        errorMessage ?? "An error occurred while trying to decode the media resource";
+      return new RxPlayerMediaError("MEDIA_ERR_DECODE", errorMessage);
+    case 4:
+      errorMessage =
+        errorMessage ?? "The media resource has been found to be unsuitable.";
+      return new RxPlayerMediaError("MEDIA_ERR_SRC_NOT_SUPPORTED", errorMessage);
+    default:
+      errorMessage =
+        errorMessage ?? "The HTMLMediaElement errored due to an unknown reason.";
+      return new RxPlayerMediaError("MEDIA_ERR_UNKNOWN", errorMessage);
+  }
+}
diff --git a/src/main_thread/init/utils/initial_seek_and_play.ts b/src/main_thread/init/utils/initial_seek_and_play.ts
@@ -62,14 +62,12 @@ export interface IInitialSeekAndPlayObject {
  */
 export default function performInitialSeekAndPlay(
   {
-    mediaElement,
     playbackObserver,
     startTime,
     mustAutoPlay,
     isDirectfile,
     onWarning,
   }: {
-    mediaElement: IMediaElement;
     playbackObserver: IMediaElementPlaybackObserver;
     startTime: number | (() => number | undefined);
     mustAutoPlay: boolean;
@@ -178,6 +176,11 @@ export default function performInitialSeekAndPlay(
         let hasStartedSeeking = false;
         playbackObserver.listen(
           (obs, stopListening) => {
+            const mediaElement = playbackObserver.getMediaElement();
+            if (mediaElement === null) {
+              // media element not yet attached
+              return;
+            }
             if (
               !hasStartedSeeking &&
               (obs.seeking !== SeekingState.None ||
@@ -201,7 +204,7 @@ export default function performInitialSeekAndPlay(
             if (cancelSignal.isCancelled()) {
               return;
             }
-            waitForPlayable();
+            waitForPlayable(mediaElement);
           },
           { includeLastObservation: false, clearSignal: cancelSignal },
         );
@@ -214,7 +217,7 @@ export default function performInitialSeekAndPlay(
        * if asked. Potentially send warning if a minor issue has been detected while
        * doing so.
        */
-      function waitForPlayable() {
+      function waitForPlayable(mediaElement: IMediaElement) {
         playbackObserver.listen(
           (observation, stopListening) => {
             if (
@@ -223,7 +226,7 @@ export default function performInitialSeekAndPlay(
               observation.readyState >= 1
             ) {
               stopListening();
-              onPlayable();
+              onPlayable(mediaElement);
             }
           },
           { includeLastObservation: true, clearSignal: cancelSignal },
@@ -237,7 +240,7 @@ export default function performInitialSeekAndPlay(
        * Promise when done.
        * Might also send warnings if minor issues arise.
        */
-      function onPlayable() {
+      function onPlayable(mediaElement: IMediaElement) {
         log.info("Init", "Can begin to play content");
         if (!mustAutoPlay) {
           if (mediaElement.autoplay) {

diff --git a/src/main_thread/init/utils/throw_on_media_error.ts b/src/main_thread/init/utils/throw_on_media_error.ts