video-dev / video-dev/hls.js

Support for colors in WebVTT subtitles

Open
#4,897 5 comments 1 reaction 0 assignees View on GitHub

Nobody has claimed this yet.

Browser issue Feature proposal good-first-issue
Dominant language
TypeScript
Stars
16.9k
Forks
2.8k
Avg merge
1d 12h
Merged PRs (30d)
27

Description

Is your feature request related to a problem? Please describe.

Here is a test HLS stream that uses colors in its WebVTT subtitles:
https://www.kaltura.com/p/0/playManifest/entryId/0_z79l0t8f/format/applehttp/protocol/https/deliveryProfileId/20322/x.m3u8
(for example - <c.magenta.bg_black>This is magenta text on a black background</c>)

The colors are displayed correctly on the upcoming iOS 16 beta version, but they are ignored in hls.js (other styles, such as bold/italics, are working as expected). I also tested Shaka player, and the colors work fine there.

Describe the solution you'd like

Requested solution: I'd like to see colors :)

Additional context

No response

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start by reproducing the linked HLS stream in hls.js and tracing how its WebVTT subtitles are parsed and rendered; the issue provides no source file or test entry point. Done means the magenta text and black background in the example render in hls.js, while existing bold and italic styling continues to work.

Written by the indexing model from the issue text.

Assessment

Tech stack
typescript
Domain
frontend
Issue type
Feature
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Needs clarification
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.