addChaptersTrack() promise resolves before the chapters file has been downloaded and parsed by the browser

[hochhaus]

Have you read the FAQ and checked for duplicate open issues?

Yes

What version of Shaka Player are you using?

v3.3.4

Can you reproduce the issue with our latest release version?

Yes (tested against v4.0.0)

Can you reproduce the issue with the latest code from main?

Yes (tested against c2f1fb5)

Are you using the demo app or your own custom app?

Custom app

If custom app, can you reproduce the issue using our demo app?

The demo app does not use chapters to the best of my understanding so no I cannot reproduce using the demo app

What browser and OS are you using?

FF 99 on Debian Linux

For embedded devices (smart TVs, etc.), what model and firmware version are you using?

N/A

What are the manifest and license server URIs?

Sent via email.

What configuration are you using? What is the output of player.getConfiguration()?

Send via email.

What did you do?

Call addChaptersTrack() and wait for the promise to resolve (successfully).

What did you expect to happen?

The browser to download and parse the chapters VTT file before resolving the promise (similar to the captions behavior).

What actually happened?

When shaka downloads a chapters VTT file it appears to do so by appending a <track> element to the DOM and then resolving the addChaptersTrack() promise. The problem is that the <text> element downloads and parses the VTT file asynchronously meaning that the calling code can't safely use the chapters VTT immediately after the promise resolves.

Note that when shaka downloads a captions VTT file it (correctly) appears to do so from a JS fetch().

As a work around we are using the following code to parse our own chapters VTT files and avoid calling
addChaptersTrack() / getChapters()

  const resp = await fetch(url);
  // error handling for !resp.ok

  const data = new Uint8Array(await resp.arrayBuffer());
  const time = {periodStart: 0, segmentStart: 0, segmentEnd: 0};
  const result = new shaka.text.VttTextParser().parseMedia(data, time);

  const chapters = [];
  for (const item of result) {
    const chapter = {
      id: item.id,
      title: item.payload,
      startTime: item.startTime,
      endTime: item.endTime,
    };
    chapters.push(chapter);
  }

References #3895

[joeyparrish]

Inside addChaptersTrack(), we await this.addSrcTrackElement_(), but that resolves as soon as the Track element is appended to the media element as a child. We could await some other event that would indicate the track has been parsed. Let me look into it.

[joeyparrish]

I never received an email with your content URLs, but I am going to experiment with some arbitrary chapter tracks and see if there is a useful event on the Track element that will resolve this.

[joeyparrish]

With a little refactoring around the addition of a track element, it looks like the load event on the HTML element will do the trick.

[hochhaus]

Thanks @joeyparrish