Skip to content

Duplicate Captions Rendered from Segmented WebVTT in HLS Streams #7

@gjdipietro

Description

@gjdipietro

Summary
When playing HLS streams with WebVTT subtitle tracks, the same caption text appears twice in the <Captions> component. This occurs because segmented WebVTT files contain duplicate cues across segment boundaries, and Vidstack's caption renderer displays all active cues without deduplication.

Environment
Vidstack Version: 1.12.13
Browser: Tested on Chrome
Platform: Web

Steps to Reproduce
Load an HLS stream with segmented WebVTT subtitle tracks
Enable captions using the component
Play the video and observe caption rendering
Notice that some captions appear duplicated

See the segmented WebVTT responses may include the same cue on two different segments, notice the id of "1" on both
https://github.com/user-attachments/assets/fa623d95-de59-450f-97c1-84b1993d2bfc

Both captions are drawn in the "non-native" way, this is not a case where HLS captions and non-native are both appearing together.
Image

Turning on HLS captions using renderTextTracksNatively: true fixes the issue but would prefer non-native captions

Expected Behavior
Each caption should appear only once, even when the same cue exists in multiple WebVTT segments.

Technical Details
Root Cause Analysis
Segmented WebVTT: HLS streams split WebVTT files into segments for streaming
Overlapping Segments: When cues span segment boundaries, they appear in multiple segments
Multiple Active Cues: The same cue (same ID, timing, text) becomes active multiple times

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions