// A custom chapter list, not a claim of native chapter UI in every browser.
async function installTeachingChapters(media, trackElement, container) {
  if (!(Number.isFinite(media.duration) && media.duration > 0))
    throw new Error('metadata duration required');
  const cues = Array.from(trackElement.track.cues || []);
  if (!cues.length || cues.length > 100) throw new Error('1..100 loaded cues required');
  let previousEnd = 0;
  for (const c of cues) {
    if (!(c.startTime >= previousEnd && c.endTime > c.startTime &&
          c.endTime <= media.duration && c.text.trim()))
      throw new Error('ordered non-overlapping chapters inside media duration required');
    previousEnd = c.endTime;
  }
  container.replaceChildren();
  for (const c of cues) {
    const b = document.createElement('button'); b.type = 'button';
    b.textContent = c.text;
    b.addEventListener('click', () => {media.currentTime = c.startTime;});
    container.append(b);
  }
  return cues.map(c => ({id:c.id, start:c.startTime, end:c.endTime, text:c.text}));
}