Captions being added to DOM multiple times

Created by: physicsforpoets

Environment

• The MPD passes the DASH-IF Conformance Tool on http://dashif.org/conformance.html
• 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://dash-vod.cdn1.showtimeanytime.com/dash/v2/affairffetvma_3437300_20180101_20180630_122717/tv_master_sdk.mpd

• Widevine License: https://www.showtimeanytime.com/common/drm-certs/cert_license_widevine_com.bin?refid=XPPK0001513852719000&authToken=0:f3b6c81d-67eb-4c59-8f2b-93b2f22f87f8&sd=true

• Playready License: https://www.qa-maint.sho.com/api/drm/playready/license (I could not get video playback working in the reference player - I assume it's a license issue - but if you scrub to 38:02 you can see the issue occuring)

• Dash.js version: 2.6.7

• Browser name/version: Chrome 65...

• OS name/version: MacOS 10.13.3

Steps to reproduce

Playback video with captions where any cue contains multiple simultaneous captions.

Observed behaviour

Caption text is being added twice to the DOM in two separate cue_TTML_xxx div's. Pulling down the debug player, the errant code appears to be here:

for (j = 0; j < isd.contents.length; j++) {
    if (isd.contents[j].contents.length >= 1) {
        startTime = mediaTimeEvents[i] + offsetTime < startTimeSegment ? startTimeSegment : mediaTimeEvents[i] + offsetTime;
        endTime = mediaTimeEvents[i + 1] + offsetTime > endTimeSegment ? endTimeSegment : mediaTimeEvents[i + 1] + offsetTime;

        if (startTime < endTime) {
            captionArray.push({
                start: startTime,
                end: endTime,
                type: 'html',
                cueID: getCueID(),
                isd: isd,
                images: images,
                embeddedImages: embeddedImages
            });
        }
    }
}

Removing the for(j) loop and skipping right to if (startTime < endTime) appears to fix the issue - I do not understand the original intent behind adding the entire isd object to the captionArray X times, where X is the length of the isd.contents array.

Console output

Output

``` Paste the contents of the browser console here. You may need to enable debug logging in dash.js by calling player.getDebug().setLogToBrowserConsole(true) if you are using your own page. ```

EDIT: Updated to fix code snippet readability