When custom rendering TTML a rendering div is still required

[WarrenMoore]

Environment

• The MPD passes the DASH-IF Conformance Tool on https://conformance.dashif.org/
• The stream has correct Access-Control-Allow-Origin headers (CORS)
• There are no network errors such as 404s in the browser console when trying to play the stream
• The issue observed is not mentioned on https://github.com/Dash-Industry-Forum/dash.js/wiki/FAQ
• The issue occurs in the latest reference client on http://reference.dashif.org/dash.js/ and not just on my page

• Link to playable MPD file: https://rdmedia.bbc.co.uk/elephants_dream/1/client_manifest-all.mpd
• Dash.js version: 4.7.3
• Browser name/version: Chrome v120.0.6099.234
• OS name/version: macOS 13.5

Steps to reproduce

1. Set the streaming.text.webvtt.customRenderingEnabled setting to true.
2. Do not call attachTTMLRenderingDiv.
3. Playback a stream with TTML captions.

Observed behavior

I would have expected that manualCueList was still populated, but there is a check for TTML-based captions that an element has been set for rendering TTML captions into c.f. src/streaming/text/TextTracks.js@addCaptions.

I attempted a quick check here to allow it to progress if custom rendering is enabled, but that caused other console errors so there must be some use for it I presume that I didn't delve any deeper into just yet. I will try and circle back to this later on however to see if I can provide a PR if can genuinely be decoupled from the div.

If you set both customRenderingEnabled and a TTML div then manualCueList is correctly populated and your TTML div is left alone (other than to have the basic properties themselves set on the div, there are never any captions injected into it with customRenderingEnabled set to true).

Console output

If no TTML div is provide the following:

[664][TextTracks] Impossible to display subtitles. You might have missed setting a TTML rendering div via player.attachTTMLRenderingDiv(TTMLRenderingDiv)

If no TTML div is provided, but the check within src/streaming/text/TextTracks.js@addCaptions is changed to allow adding TTML cues (i.e. changing captionsContainer to captionsContainer || settings.get().streaming.text.webvtt.customRenderingEnabled) then there is another error:

[654][SourceBufferSink][text] SourceBuffer append failed "TypeError: Cannot read properties of undefined (reading 'remove')"

Expected behavior

I would have expected that manualCueList was still populated without the need for setting a TTML rendering div that goes unused.

Obviously just setting an empty div fixes the problem, but just wondering if this should really required.

[dsilhavy]

I don't quite understand what you want to achieve. The streaming.text.webvtt.customRenderingEnabled setting should only be used for WebVTT rendering and not for TTML rendering.

Is the problem that if you set streaming.text.webvtt.customRenderingEnabled to true no TTML captions are rendered?

[WarrenMoore]

The UI of our application is WebGL-based, not HTML, so we would prefer to render the captions ourselves into WebGL and just have the cues from which we can generate this ourselves.

If both streaming.text.webvtt.customRenderingEnabled is true and a TTML div is set, then dash.js populates the manualCueList property of the text track, without rendering anything, so I can check this list manually to convert the isd property into the appropriate WebGL.

The streaming.text.webvtt.customRenderingEnabled property does have an effect on TTML captions, it prevents them from being rendered (which is exactly what I want), it was just a point to note that custom rendering of TTML requires you to set a div even though it isn't used.

[dsilhavy]

I think this PR which will be part of the upcoming release would solve your problem in the intended way: #4360

streaming.text.webvtt.customRenderingEnabled should not stop the rendering of the TTML captions, this sounds like a bug. It should only trigger a custom rendering of the WebVTT subtitles.

[dsilhavy]

@WarrenMoore Did you have the chance to check #4360 . It is included in the last release: https://reference.dashif.org/dash.js/latest/samples/dash-if-reference-player/index.html