rx-player 4.1.0 → 4.2.0-dev.2024080600

package/src/parsers/manifest/dash/common/__tests__/manifest_bounds_calculator.test.ts

@@ -9,9 +9,9 @@ describe("DASH parsers - ManifestBoundsCalculator", () => {
       availabilityStartTime: 0,
       serverTimestampOffset: undefined,
     });
-    expect(manifestBoundsCalculator.getEstimatedMinimumSegmentTime()).toEqual(undefined);
-    expect(manifestBoundsCalculator.getEstimatedMinimumSegmentTime()).toEqual(undefined);
-    expect(manifestBoundsCalculator.getEstimatedMinimumSegmentTime()).toEqual(undefined);
+    expect(manifestBoundsCalculator.getEstimatedMinimumSegmentTime(0)).toEqual(undefined);
+    expect(manifestBoundsCalculator.getEstimatedMinimumSegmentTime(3)).toEqual(undefined);
+    expect(manifestBoundsCalculator.getEstimatedMinimumSegmentTime(5)).toEqual(undefined);
   });
 
   it("should return 0 through `getEstimatedMinimumSegmentTime` for a static content", () => {
@@ -21,10 +21,10 @@ describe("DASH parsers - ManifestBoundsCalculator", () => {
       availabilityStartTime: 0,
       serverTimestampOffset: 555555,
     });
-    expect(manifestBoundsCalculator.getEstimatedMinimumSegmentTime()).toEqual(0);
+    expect(manifestBoundsCalculator.getEstimatedMinimumSegmentTime(0)).toEqual(0);
     manifestBoundsCalculator.setLastPosition(5555, 2135);
-    expect(manifestBoundsCalculator.getEstimatedMinimumSegmentTime()).toEqual(0);
-    expect(manifestBoundsCalculator.getEstimatedMinimumSegmentTime()).toEqual(0);
+    expect(manifestBoundsCalculator.getEstimatedMinimumSegmentTime(4)).toEqual(0);
+    expect(manifestBoundsCalculator.getEstimatedMinimumSegmentTime(5)).toEqual(0);
   });
 
   it("should return 0 through `getEstimatedMinimumSegmentTime` if the `serverTimestampOffset` was never set nor the last position for a dynamic content with no timeShiftBufferDepth", () => {
@@ -34,9 +34,9 @@ describe("DASH parsers - ManifestBoundsCalculator", () => {
       availabilityStartTime: 0,
       serverTimestampOffset: undefined,
     });
-    expect(manifestBoundsCalculator.getEstimatedMinimumSegmentTime()).toEqual(0);
-    expect(manifestBoundsCalculator.getEstimatedMinimumSegmentTime()).toEqual(0);
-    expect(manifestBoundsCalculator.getEstimatedMinimumSegmentTime()).toEqual(0);
+    expect(manifestBoundsCalculator.getEstimatedMinimumSegmentTime(0)).toEqual(0);
+    expect(manifestBoundsCalculator.getEstimatedMinimumSegmentTime(5)).toEqual(0);
+    expect(manifestBoundsCalculator.getEstimatedMinimumSegmentTime(28)).toEqual(0);
   });
 
   it("should return `false` through `lastPositionIsKnown` if `setLastPositionOffset` was never called", () => {
@@ -47,7 +47,7 @@ describe("DASH parsers - ManifestBoundsCalculator", () => {
       serverTimestampOffset: undefined,
     });
     expect(manifestBoundsCalculator.lastPositionIsKnown()).toEqual(false);
-    expect(manifestBoundsCalculator.getEstimatedMinimumSegmentTime()).toEqual(undefined);
+    expect(manifestBoundsCalculator.getEstimatedMinimumSegmentTime(0)).toEqual(undefined);
     expect(manifestBoundsCalculator.lastPositionIsKnown()).toEqual(false);
   });
 
@@ -86,9 +86,10 @@ describe("DASH parsers - ManifestBoundsCalculator", () => {
     });
     manifestBoundsCalculator.setLastPosition(1000, 10);
     performanceNow = 25000;
-    expect(manifestBoundsCalculator.getEstimatedMinimumSegmentTime()).toEqual(1010);
+    expect(manifestBoundsCalculator.getEstimatedMinimumSegmentTime(0)).toEqual(1010);
+    expect(manifestBoundsCalculator.getEstimatedMinimumSegmentTime(50)).toEqual(960);
     performanceNow = 35000;
-    expect(manifestBoundsCalculator.getEstimatedMinimumSegmentTime()).toEqual(1020);
+    expect(manifestBoundsCalculator.getEstimatedMinimumSegmentTime(0)).toEqual(1020);
     mockPerformanceNow.mockRestore();
   });
 
@@ -104,18 +105,27 @@ describe("DASH parsers - ManifestBoundsCalculator", () => {
       serverTimestampOffset: 7000,
     });
     manifestBoundsCalculator.setLastPosition(3000, 10);
-    expect(manifestBoundsCalculator.getEstimatedMinimumSegmentTime()).toEqual(
+    expect(manifestBoundsCalculator.getEstimatedMinimumSegmentTime(0)).toEqual(
       7 + 5 - 4 - 3,
     );
+    expect(manifestBoundsCalculator.getEstimatedMinimumSegmentTime(4)).toEqual(
+      7 + 5 - 4 - 3 - 4,
+    );
     performanceNow = 25000;
-    expect(manifestBoundsCalculator.getEstimatedMinimumSegmentTime()).toEqual(
+    expect(manifestBoundsCalculator.getEstimatedMinimumSegmentTime(0)).toEqual(
       7 + 25 - 4 - 3,
     );
+    expect(manifestBoundsCalculator.getEstimatedMinimumSegmentTime(10)).toEqual(
+      7 + 25 - 4 - 3 - 10,
+    );
     performanceNow = 35000;
     manifestBoundsCalculator.setLastPosition(84546464, 5642);
-    expect(manifestBoundsCalculator.getEstimatedMinimumSegmentTime()).toEqual(
+    expect(manifestBoundsCalculator.getEstimatedMinimumSegmentTime(0)).toEqual(
       7 + 35 - 4 - 3,
     );
+    expect(manifestBoundsCalculator.getEstimatedMinimumSegmentTime(5)).toEqual(
+      7 + 35 - 4 - 3 - 5,
+    );
     mockPerformanceNow.mockRestore();
   });
 
@@ -132,10 +142,12 @@ describe("DASH parsers - ManifestBoundsCalculator", () => {
     });
     manifestBoundsCalculator.setLastPosition(1000, 0);
     performanceNow = 50000;
-    expect(manifestBoundsCalculator.getEstimatedMinimumSegmentTime()).toEqual(1045);
+    expect(manifestBoundsCalculator.getEstimatedMinimumSegmentTime(0)).toEqual(1045);
+    expect(manifestBoundsCalculator.getEstimatedMinimumSegmentTime(40)).toEqual(1005);
     manifestBoundsCalculator.setLastPosition(0, 0);
     performanceNow = 55000;
-    expect(manifestBoundsCalculator.getEstimatedMinimumSegmentTime()).toEqual(50);
+    expect(manifestBoundsCalculator.getEstimatedMinimumSegmentTime(0)).toEqual(50);
+    expect(manifestBoundsCalculator.getEstimatedMinimumSegmentTime(40)).toEqual(10);
     mockPerformanceNow.mockRestore();
   });
 

package/src/parsers/manifest/dash/common/indexes/template.ts

@@ -557,7 +557,9 @@ export default class TemplateRepresentationIndex implements IRepresentationIndex
     }
 
     const { duration, timescale } = this._index;
-    const firstPosition = this._manifestBoundsCalculator.getEstimatedMinimumSegmentTime();
+    const firstPosition = this._manifestBoundsCalculator.getEstimatedMinimumSegmentTime(
+      duration / timescale,
+    );
     if (firstPosition === undefined) {
       return undefined;
     }

package/src/parsers/manifest/dash/common/indexes/timeline/timeline_representation_index.ts

@@ -796,7 +796,9 @@ export default class TimelineRepresentationIndex implements IRepresentationIndex
     if (!this._isDynamic) {
       return;
     }
-    const firstPosition = this._manifestBoundsCalculator.getEstimatedMinimumSegmentTime();
+    const firstPosition = this._manifestBoundsCalculator.getEstimatedMinimumSegmentTime(
+      (this._index.timeline[0]?.duration ?? 0) / this._index.timescale,
+    );
     if (isNullOrUndefined(firstPosition)) {
       return; // we don't know yet
     }

package/src/parsers/manifest/dash/common/manifest_bounds_calculator.ts

@@ -109,10 +109,14 @@ export default class ManifestBoundsCalculator {
   /**
    * Estimate a minimum bound for the content from the last set segment time
    * and buffer depth.
-   * Consider that it is only an estimation, not the real value.
+   * Consider that it is only an estimate, not the real value.
+   * @param {number} segmentDuration - In DASH, the buffer depth actually also
+   * depend on a corresponding's segment duration (e.g. a segment become
+   * unavailable once the `timeShiftBufferDepth` + its duration has elapsed).
+   * This argument can thus be set the approximate duration of a segment.
    * @return {number|undefined}
    */
-  getEstimatedMinimumSegmentTime(): number | undefined {
+  getEstimatedMinimumSegmentTime(segmentDuration: number): number | undefined {
     if (!this._isDynamic || this._timeShiftBufferDepth === null) {
       return 0;
     }
@@ -121,7 +125,7 @@ export default class ManifestBoundsCalculator {
     if (maximumBound === undefined) {
       return undefined;
     }
-    const minimumBound = maximumBound - this._timeShiftBufferDepth;
+    const minimumBound = maximumBound - (this._timeShiftBufferDepth + segmentDuration);
     return minimumBound;
   }
 

package/src/parsers/manifest/dash/common/parse_mpd.ts

@@ -258,6 +258,7 @@ function parseCompleteIntermediateRepresentation(
     args.referenceDateTime,
   );
   const timeShiftBufferDepth = rootAttributes.timeShiftBufferDepth;
+  const maxSegmentDuration = rootAttributes.maxSegmentDuration;
   const { externalClockOffset: clockOffset, unsafelyBaseOnPreviousManifest } = args;
 
   const { externalClockOffset } = args;
@@ -279,7 +280,6 @@ function parseCompleteIntermediateRepresentation(
     manifestBoundsCalculator,
     manifestProfiles: mpdIR.attributes.profiles,
     receivedTime: args.manifestReceivedTime,
-    timeShiftBufferDepth,
     unsafelyBaseOnPreviousManifest,
     xlinkInfos,
     xmlNamespaces: mpdIR.attributes.namespaces,
@@ -381,6 +381,20 @@ function parseCompleteIntermediateRepresentation(
     // can go even lower in terms of depth
     minimumTime = minimumSafePosition;
     timeshiftDepth = timeShiftBufferDepth ?? null;
+    if (timeshiftDepth !== null) {
+      // The DASH spec implies that a segment is still available after a given
+      // `timeShiftBufferDepth` for a time equal to its duration
+      // (What I interpret from "ISO/IEC 23009-1 fifth edition 2022-08
+      // A.3.4 Media Segment list restrictions).
+      //
+      // This `timeshiftDepth` property is global for the whole Manifest (and
+      // not per segment), thus we cannot do exactly that, but we can take the
+      // anounced `maxSegmentDuration` by default instead. This may be a little
+      // too optimistic, but would in reality not lead to a lot of issues as
+      // this `timeshiftDepth` property is not the one that should be relied on
+      // to know which segment can or cannot be requested anymore.
+      timeshiftDepth += maxSegmentDuration ?? 0;
+    }
     if (
       timeshiftDepth !== null &&
       minimumTime !== undefined &&

package/src/parsers/manifest/utils/__tests__/update_segment_timeline.test.ts

@@ -9,7 +9,7 @@ import type { IIndexSegment } from "../index_helpers";
 /* eslint-disable @typescript-eslint/no-explicit-any */
 
 describe("Manifest Parsers utils - updateSegmentTimeline", () => {
-  let mockLogWarn: MockInstance<unknown[], void> | undefined;
+  let mockLogWarn: MockInstance | undefined;
   let updateSegmentTimeline:
     | ((a: IIndexSegment[], b: IIndexSegment[]) => boolean)
     | undefined;

package/src/parsers/texttracks/ttml/html/__tests__/__global__/html_ttml_parser.test.ts

@@ -167,7 +167,9 @@ describe("Global TTML HTML parsing tests", () => {
       for (let i = 0; i < textNodes.length; i++) {
         const parentElement = textNodes[i].parentElement;
         if (parentElement !== null) {
-          expect(globalScope.getComputedStyle(parentElement).color).toEqual("yellow");
+          expect(globalScope.getComputedStyle(parentElement).color).toEqual(
+            "rgb(255, 255, 0)",
+          );
           nbTextNodes++;
         }
       }
@@ -177,7 +179,9 @@ describe("Global TTML HTML parsing tests", () => {
       for (let i = 0; i < textNodes.length; i++) {
         const parentElement = textNodes[i].parentElement;
         if (parentElement !== null) {
-          expect(globalScope.getComputedStyle(parentElement).color).toEqual("white");
+          expect(globalScope.getComputedStyle(parentElement).color).toEqual(
+            "rgb(255, 255, 255)",
+          );
           nbTextNodes++;
         }
       }

package/src/playback_observer/media_element_playback_observer.ts

@@ -14,6 +14,7 @@
  * limitations under the License.
  */
 
+import type { IMediaElement } from "../compat/browser_compatibility_types";
 import isSeekingApproximate from "../compat/is_seeking_approximate";
 import config from "../config";
 import log from "../log";
@@ -40,9 +41,8 @@ import ObservationPosition from "./utils/observation_position";
 /**
  * HTMLMediaElement Events for which playback observations are calculated and
  * emitted.
- * @type {Array.<string>}
  */
-const SCANNED_MEDIA_ELEMENTS_EVENTS: IPlaybackObserverEventType[] = [
+const SCANNED_MEDIA_ELEMENTS_EVENTS = [
   "canplay",
   "ended",
   "play",
@@ -51,7 +51,7 @@ const SCANNED_MEDIA_ELEMENTS_EVENTS: IPlaybackObserverEventType[] = [
   "seeked",
   "loadedmetadata",
   "ratechange",
-];
+] as const;
 
 /**
  * Class allowing to "observe" current playback conditions so the RxPlayer is
@@ -68,7 +68,7 @@ const SCANNED_MEDIA_ELEMENTS_EVENTS: IPlaybackObserverEventType[] = [
  */
 export default class PlaybackObserver {
   /** HTMLMediaElement which we want to observe. */
-  private _mediaElement: HTMLMediaElement;
+  private _mediaElement: IMediaElement;
 
   /** If `true`, a `MediaSource` object is linked to `_mediaElement`. */
   private _withMediaSource: boolean;
@@ -141,7 +141,7 @@ export default class PlaybackObserver {
    * @param {HTMLMediaElement} mediaElement
    * @param {Object} options
    */
-  constructor(mediaElement: HTMLMediaElement, options: IPlaybackObserverOptions) {
+  constructor(mediaElement: IMediaElement, options: IPlaybackObserverOptions) {
     this._internalSeeksIncoming = [];
     this._mediaElement = mediaElement;
     this._withMediaSource = options.withMediaSource;
@@ -342,19 +342,19 @@ export default class PlaybackObserver {
       this._generateObservationForEvent("timeupdate");
     };
     let intervalId = setInterval(onInterval, interval);
-    const removeEventListeners = SCANNED_MEDIA_ELEMENTS_EVENTS.map((eventName) => {
+    SCANNED_MEDIA_ELEMENTS_EVENTS.map((eventName) => {
       const onMediaEvent = () => {
         restartInterval();
         this._generateObservationForEvent(eventName);
       };
+
       this._mediaElement.addEventListener(eventName, onMediaEvent);
-      return () => {
+      this._canceller.signal.register(() => {
         this._mediaElement.removeEventListener(eventName, onMediaEvent);
-      };
+      });
     });
     this._canceller.signal.register(() => {
       clearInterval(intervalId);
-      removeEventListeners.forEach((cb) => cb());
       returnedSharedReference.finish();
     });
     return returnedSharedReference;
@@ -610,7 +610,7 @@ function hasLoadedUntilTheEnd(
  * @param {HTMLMediaElement} mediaElement
  * @returns {Object}
  */
-function getMediaInfos(mediaElement: HTMLMediaElement): IMediaInfos {
+function getMediaInfos(mediaElement: IMediaElement): IMediaInfos {
   const {
     buffered,
     currentTime,
@@ -933,7 +933,7 @@ function prettyPrintBuffered(buffered: TimeRanges, currentTime: number): string
  * @param {HTMLMediaElement} mediaElement
  * @returns {Object}
  */
-function getInitialObservation(mediaElement: HTMLMediaElement): IPlaybackObservation {
+function getInitialObservation(mediaElement: IMediaElement): IPlaybackObservation {
   const mediaTimings = getMediaInfos(mediaElement);
   return objectAssign(mediaTimings, {
     rebuffering: null,

package/src/public_types.ts

@@ -29,6 +29,26 @@ export interface IWorkerSettings {
   dashWasmUrl?: string | ArrayBuffer | undefined;
 }
 
+/** Object that defines Common Media Client Data (CMCD) options. */
+export interface ICmcdOptions {
+  /**
+   * Content ID delivered by CMCD metadata for that content.
+   * If not specified, a default one will be generated.
+   */
+  contentId?: string;
+  /**
+   * Session ID delivered by CMCD metadata.
+   * If not specified, a default one will be generated.
+   */
+  sessionId?: string;
+  /**
+   * Allow to force the way in which the CMCD payload should be communicated.
+   *
+   * If not set, the most appropriate type will be relied on.
+   */
+  communicationType?: "headers" | "query";
+}
+
 /** Every options that can be given to the RxPlayer's constructor. */
 export interface IConstructorOptions {
   maxBufferAhead?: number;
@@ -38,6 +58,7 @@ export interface IConstructorOptions {
   videoResolutionLimit?: "videoElement" | "screen" | "none";
   throttleVideoBitrateWhenHidden?: boolean;
 
+  /* eslint-disable-next-line @typescript-eslint/no-restricted-types */
   videoElement?: HTMLMediaElement;
   baseBandwidth?: number;
 }
@@ -124,6 +145,12 @@ export interface ILoadVideoOptions {
    */
   checkMediaSegmentIntegrity?: boolean;
 
+  /**
+   * Whether we should check that an obtained Manifest is truncated and retry
+   * the request if that's the case.
+   */
+  checkManifestIntegrity?: boolean | undefined;
+
   /** Manifest object that may be used initially. */
   initialManifest?: IInitialManifest;
 
@@ -150,6 +177,11 @@ export interface ILoadVideoOptions {
    * in "multithread" mode) for that content.
    */
   mode?: IRxPlayerMode | undefined;
+
+  /**
+   * When set to an object, enable "Common Media Client Data", or "CMCD".
+   */
+  cmcd?: ICmcdOptions | undefined;
 }
 
 /** Value of the `serverSyncInfos` transport option. */
@@ -404,11 +436,59 @@ export interface ISegmentLoaderContext {
   byteRanges?: Array<[number, number]> | undefined;
   /** Type of the corresponding track. */
   trackType: ITrackType;
+  /**
+   * Optional "Common Media Client Data" (CMCD) payload that may be added to
+   * the request.
+   */
+  cmcdPayload?: ICmcdPayload | undefined;
 }
 
 /** Every possible value for the Adaptation's `type` property. */
 export type ITrackType = "video" | "audio" | "text";
 
+/**
+ * Payload to add to a request to provide CMCD metadata through HTTP request
+ * headers.
+ *
+ * This is an object where keys are header names and values are header contents.
+ */
+export type ICmcdHeadersData = Record<string, string>;
+
+/**
+ * Payload to add to a request to provide CMCD metadata through an URL's query
+ * string.
+ *
+ * This is an array of all fields and corresponding values that should be
+ * added to the query string, the order should be kept.
+ *
+ * `null` indicates that the field has no value and should be added as is.
+ */
+export type ICmcdQueryData = Array<[string, string | null]>;
+
+/**
+ * Type when CMCD metadata should be added through headers to the HTTP request
+ * for the corresponding resource.
+ */
+export interface ICmcdHeadersPayload {
+  type: "headers";
+  value: ICmcdHeadersData;
+}
+
+/**
+ * Type when CMCD metadata should be added through the query string to the HTTP
+ * request for the corresponding resource.
+ */
+export interface ICmcdQueryPayload {
+  type: "query";
+  value: ICmcdQueryData;
+}
+
+/**
+ * Type to indicate that CMCD metadata should be added to the request for the
+ * corresponding resource.
+ */
+export type ICmcdPayload = ICmcdHeadersPayload | ICmcdQueryPayload;
+
 export type ILoadedManifestFormat = IInitialManifest;
 
 export type IManifestLoader = (
@@ -433,8 +513,14 @@ export type IManifestLoader = (
 (() => void) | void;
 
 export interface IManifestLoaderInfo {
+  /** URL at which the wanted Manifest can be accessed. */
   url: string | undefined;
   timeout: number | undefined;
+  /**
+   * Optional "Common Media Client Data" (CMCD) payload that may be added to
+   * the request.
+   */
+  cmcdPayload: ICmcdPayload | undefined;
 }
 
 /** Options related to a single key system. */

package/src/tools/TextTrackRenderer/text_track_renderer.ts

@@ -60,6 +60,7 @@ export default class TextTrackRenderer {
     videoElement,
     textTrackElement,
   }: {
+    /* eslint-disable-next-line @typescript-eslint/no-restricted-types */
     videoElement: HTMLMediaElement;
     textTrackElement: HTMLElement;
   }) {

package/src/transports/dash/init_segment_loader.ts

@@ -25,11 +25,12 @@ import type {
   ISegmentLoaderResultSegmentCreated,
   ISegmentLoaderResultSegmentLoaded,
 } from "../types";
+import addQueryString from "../utils/add_query_string";
 import byteRange from "../utils/byte_range";
 
 /**
  * Perform a request for an initialization segment, agnostic to the container.
- * @param {string} url
+ * @param {string} initialUrl
  * @param {Object} segment
  * @param {Object} options
  * @param {CancellationSignal} cancelSignal
@@ -37,7 +38,7 @@ import byteRange from "../utils/byte_range";
  * @returns {Promise}
  */
 export default function initSegmentLoader(
-  url: string,
+  initialUrl: string,
   segment: ISegment,
   options: ISegmentLoaderOptions,
   cancelSignal: CancellationSignal,
@@ -47,10 +48,17 @@ export default function initSegmentLoader(
   | ISegmentLoaderResultSegmentCreated<ArrayBuffer | Uint8Array>
   | ISegmentLoaderResultChunkedComplete
 > {
+  let url = initialUrl;
+  if (options.cmcdPayload?.type === "query") {
+    url = addQueryString(url, options.cmcdPayload.value);
+  }
+  const cmcdHeaders =
+    options.cmcdPayload?.type === "headers" ? options.cmcdPayload.value : undefined;
   if (segment.range === undefined) {
     return request({
       url,
       responseType: "arraybuffer",
+      headers: cmcdHeaders,
       timeout: options.timeout,
       connectionTimeout: options.connectionTimeout,
       cancelSignal,
@@ -61,7 +69,10 @@ export default function initSegmentLoader(
   if (segment.indexRange === undefined) {
     return request({
       url,
-      headers: { Range: byteRange(segment.range) },
+      headers: {
+        ...cmcdHeaders,
+        Range: byteRange(segment.range),
+      },
       responseType: "arraybuffer",
       timeout: options.timeout,
       connectionTimeout: options.connectionTimeout,
@@ -74,7 +85,10 @@ export default function initSegmentLoader(
   if (segment.range[1] + 1 === segment.indexRange[0]) {
     return request({
       url,
-      headers: { Range: byteRange([segment.range[0], segment.indexRange[1]]) },
+      headers: {
+        ...cmcdHeaders,
+        Range: byteRange([segment.range[0], segment.indexRange[1]]),
+      },
       responseType: "arraybuffer",
       timeout: options.timeout,
       connectionTimeout: options.connectionTimeout,
@@ -85,7 +99,10 @@ export default function initSegmentLoader(
 
   const rangeRequest$ = request({
     url,
-    headers: { Range: byteRange(segment.range) },
+    headers: {
+      ...cmcdHeaders,
+      Range: byteRange(segment.range),
+    },
     responseType: "arraybuffer",
     timeout: options.timeout,
     connectionTimeout: options.connectionTimeout,
@@ -94,7 +111,10 @@ export default function initSegmentLoader(
   });
   const indexRequest$ = request({
     url,
-    headers: { Range: byteRange(segment.indexRange) },
+    headers: {
+      ...cmcdHeaders,
+      Range: byteRange(segment.indexRange),
+    },
     responseType: "arraybuffer",
     timeout: options.timeout,
     connectionTimeout: options.connectionTimeout,