refactor(packages)!: replace DelegateMixin & ProxyMixin with MediaHost base classes (#1292)

packages/utils/src/dom/attributes.ts

@@ -1,3 +1,6 @@
+/**
+ * Convert a NamedNodeMap to a plain object.
+ */
 export function namedNodeMapToObject(namedNodeMap: NamedNodeMap) {
   const obj: Record<string, string> = {};
   for (const attr of namedNodeMap) {
@@ -5,3 +8,16 @@ export function namedNodeMapToObject(namedNodeMap: NamedNodeMap) {
   }
   return obj;
 }
+
+/**
+ * Helper function to serialize attributes into a string.
+ */
+export function serializeAttributes(attrs: Record<string, string>) {
+  let html = '';
+  for (const key in attrs) {
+    const value = attrs[key];
+    if (value === '') html += ` ${key}`;
+    else html += ` ${key}="${value}"`;
+  }
+  return html;
+}

packages/utils/src/dom/index.ts

@@ -1,5 +1,5 @@
 export { animationFrame } from './animation-frame';
-export { namedNodeMapToObject } from './attributes';
+export { namedNodeMapToObject, serializeAttributes } from './attributes';
 export { isRTL } from './direction';
 export { type OnEventOptions, onEvent, resolveEventTarget } from './event';
 export { idleCallback } from './idle-callback';

packages/utils/src/dom/text-track.ts

@@ -1,16 +1,20 @@
 /** Find the `<track>` element that owns the given `TextTrack`. */
-export function findTrackElement(media: HTMLMediaElement, track: TextTrack): HTMLTrackElement | null {
-  for (const el of media.querySelectorAll?.('track') ?? []) {
+export function findTrackElement(media: EventTarget, track: unknown): HTMLTrackElement | null {
+  if (!(media instanceof HTMLElement)) return null;
+  for (const el of media.querySelectorAll('track')) {
     if (el.track === track) return el;
   }
   return null;
 }
 
-export function getTextTrackList(media: HTMLMediaElement, filterPred: (textTrack: TextTrack) => boolean): TextTrack[] {
-  if (!media?.textTracks) return [];
-  return (Array.from(media.textTracks) as TextTrack[]).filter(filterPred).sort(sortByTextTrackKind);
+export function getTextTrackList<Track extends { kind: string; mode: string }>(
+  media: { textTracks?: Iterable<Track> },
+  filterPred: (textTrack: Track) => boolean
+): Track[] {
+  if (!media.textTracks) return [];
+  return Array.from(media.textTracks).filter(filterPred).sort(sortByKind);
 }
 
-function sortByTextTrackKind(a: TextTrack, b: TextTrack): number {
+function sortByKind(a: { kind: string }, b: { kind: string }): number {
   return a.kind > b.kind ? 1 : a.kind < b.kind ? -1 : 0;
 }