View source for TimedText/WebVTT Implementation Report

[[Category:WebVTT]]
== Introduction ==
The following is the  Implementation Report for the [https://www.w3.org/TR/webvtt/ WebVTT specification] and [https://github.com/web-platform-tests/wpt/tree/master/webvtt WebVTT test suite].
The tests in the spreadsheet only reference the features that are in the current CR of the specification excluding those marked at-risk.
None of the test failures below are a problem for the question "is this implementable?".
== Tests ==
=== API and Parsing Tests ===
Text results can also be found on [https://wpt.fyi/results/webvtt?label=master&product=chrome%5Bexperimental%5D&product=edge&product=firefox%5Bexperimental%5D&product=safari%5Bexperimental%5D&aligned wpt.fyi], which runs the Web Platform Tests automatically on a regular basis.
The API and Parsing tests deal with the VTTCue and VTTRegion classes and being able to parse vtt files properly. These test files are HTML files with the WPT testhardness embedded and assertions made.
==== VTTCue ====
===== region =====
Safari is failing due to its non-standard region implementation. It can pass if the standard API is shimmed or if the test is modified to use Safari's implementation.
Firefox is failing due to throwing an error when `cue.region` is set to a value other than a `VTTRegion` or `null`. An error is not supposed to be thrown.
===== Test Results =====
{| class="wikitable"
! Test Name !! Chrome 74 !! Firefox 67 !! Safari 77 Preview !! iOS 12.0.1 !! Video.js + vtt.js !! Total passes
|-
! VTTCue Align
| P || P || P ||  ||  || <span style="background-color: lime;">3</span>
|-
! script-created cue
| P || P || F || F ||  || <span style="background-color: lime;">2</span>
|-
! parsed cue
| P || P || P || F ||  || <span style="background-color: lime;">3</span>
|-
! VTTCue Constructor Exceptions
|  ||  ||  ||  ||  || 
|-
! non-finite start time
| P || P || P || P ||  || <span style="background-color: lime;">4</span>
|-
! non-finite end time
| P || P || P || P ||  || <span style="background-color: lime;">4</span>
|-
! valueOf
| P || P || P || P ||  || <span style="background-color: lime;">4</span>
|-
! Constructor
|  ||  ||  ||  ||  || 
|-
! initial value
| F || P || F || F || P || <span style="background-color: lime;">2</span>
|-
! bad start time
| P || P || P || P ||  || <span style="background-color: lime;">4</span>
|-
! bad end time
| P || P || P || P ||  || <span style="background-color: lime;">4</span>
|-
! text formatting
| P || P || P || P ||  || <span style="background-color: lime;">4</span>
|-
! getCuesAsHTML
|  ||  ||  ||  ||  || 
|-
! creating the cue
| P || P || P || P ||  || <span style="background-color: lime;">4</span>
|-
! &lt;c>
| P || P || P || P ||  || <span style="background-color: lime;">4</span>
|-
! &lt;c.a.b>
| P || P || P || P ||  || <span style="background-color: lime;">4</span>
|-
! &lt;i>
| P || P || P || P ||  || <span style="background-color: lime;">4</span>
|-
! &lt;b>
| P || P || P || P ||  || <span style="background-color: lime;">4</span>
|-
! &lt;u>
| P || P || P || P ||  || <span style="background-color: lime;">4</span>
|-
! &lt;ruby>
| P || P || P || P ||  || <span style="background-color: lime;">4</span>
|-
! &lt;rt>
| P || P || P || P ||  || <span style="background-color: lime;">4</span>
|-
! &lt;v>
| P || P || P || P ||  || <span style="background-color: lime;">4</span>
|-
! &lt;v a b>
| P || P || P || P ||  || <span style="background-color: lime;">4</span>
|-
! &lt;1:00:00.500>
| P || P || P || F ||  || <span style="background-color: lime;">3</span>
|-
! x\0
| F || P || F || F || P || <span style="background-color: lime;">2</span>
|-
! line
|  ||  ||  ||  ||  || 
|-
! script created cue
| P || P || F || F ||  || <span style="background-color: lime;">2</span>
|-
! parsed cue
| P || P || F || F ||  || <span style="background-color: lime;">2</span>
|-
! lineAlign
| F || P || F || F || P || <span style="background-color: lime;">2</span>
|-
! position
| P || F || P || F ||  || <span style="background-color: lime;">2</span>
|-
! positionAlign
| F || P || F || F || P || <span style="background-color: lime;">2</span>
|-
! region
| F || F || F || F ||  || <span style="background-color: red; color: white;">0</span>
|-
! size
| P || P || F || F ||  || <span style="background-color: lime;">2</span>
|-
! snapToLines
|  ||  ||  ||  ||  || 
|-
! script created cue
| P || P || P || P ||  || <span style="background-color: lime;">4</span>
|-
! parsed cue
| P || P || F || F ||  || <span style="background-color: lime;">2</span>
|-
! text
|  ||  ||  ||  ||  || 
|-
! script created cue
| P || P || P || P ||  || <span style="background-color: lime;">4</span>
|-
! parsed cue
| P || P || P || P ||  || <span style="background-color: lime;">4</span>
|-
! vertical cue
|  ||  ||  ||  ||  || 
|-
! script created cue
| P || P || F || F ||  || <span style="background-color: lime;">2</span>
|-
! parsed cue
| P || P || P || P ||  || <span style="background-color: lime;">4</span>
|}
==== VTTRegion ====
===== lines =====
Browsers implemented this field as an int but it is specified as a long.
===== Test Results =====
{| class="wikitable"
! Test Name !! Chrome 74 !! Firefox 67 !! Safari 77 Preview !! iOS 12.0.1 !! Video.js + vtt.js !! Total passes
|-
! constructor
|  ||  ||  ||  ||  || 
|-
! initial values
| F || P || P || F || P || <span style="background-color: lime;">3</span>
|-
! mutations
| F || P || F || F || P || <span style="background-color: lime;">2</span>
|-
! id
| F || P || P || P ||  || <span style="background-color: lime;">3</span>
|-
! lines
| F || F || F || F ||  || <span style="background-color: red; color: white;">0</span>
|-
! non-visible cue with region
| F || P || P || P/requires playback ||  || <span style="background-color: lime;">2</span>
|-
! region anchor X
| F || P || P || P ||  || <span style="background-color: lime;">3</span>
|-
! region anchor Y
| F || P || P || P ||  || <span style="background-color: lime;">3</span>
|-
! scroll
| F || P || P || F ||  || <span style="background-color: lime;">2</span>
|-
! viewport anchor X
| F || P || P || P ||  || <span style="background-color: lime;">3</span>
|-
! viewport anchor Y
| F || P || P || P ||  || <span style="background-color: lime;">3</span>
|-
! width
| F || P || P || P ||  || <span style="background-color: lime;">3</span>
|}
==== Historical Tests ====
===== Test Results =====
{| class="wikitable"
! Test Name !! Chrome 74 !! Firefox 67 !! Safari 77 Preview !! iOS 12.0.1 !! Total passes
|-
! VTTCue regionId member must be nuked
| P || P || F || F || <span style="background-color: lime;">2</span>
|-
! texttrack regions member must be nucked
| P || P || F || F || <span style="background-color: lime;">2</span>
|-
! texttrack addRegion member must be nuked
| P || P || F || F || <span style="background-color: lime;">2</span>
|-
! texttrack removeRegion member must be nuked
| P || P || F || F || <span style="background-color: lime;">2</span>
|-
! VTTRegion track member must be nuked
| P || P || F || F || <span style="background-color: lime;">2</span>
|-
! VTTRegionList interface must be nuked
| P || P || P || P || <span style="background-color: lime;">4</span>
|}
==== Parsing Tests ====
===== cue text parsing =====
====== entities ======
This refers to HTML character entities, a standard set of HTML character entities is available in all browsers and an older version of the spec only included a couple of allowed characters. Currently, all HTML character entities are allowed. There is an [oustanding bug against Safari](https://bugs.webkit.org/show_bug.cgi?id=176225) for implementing this and there is a POC for vtt.js.
===== File Parsing =====
====== region edge cases ======
This is failing in Firefox because it ends up stopping parsing the regions at the first edge case so only the first region is available.
Safari fails due to its non-standard region implementation. It can pass if accounting for it.
====== region ids ======
This is failing in Safari due to its non-standard region implementation. It can pass if the standard API is shimmed or if the test is modified to use Safari's implementation.
====== region lines ======
Both Safari and Firefox are failing here due to implementation dependent versions of "interpret value as integer". Safari is clamping the value to the max integer value while Firefox returns a 0.
Also, Firefox's very strict parser and Safari's non-standard region implementation is making this test fail.
====== settings line ======
Chrome and Safari fail because it is parsing `.5` and `5.`, which are explicitly disallowed, as `0.5` and `5.0`. Chrome and Safari do not support line align.
Safari defaults to the value `-1` rather than `auto`. Safari also sets a really small value to zero rather than Number.MIN_VALUE.
====== settings position ======
Chrome and Safari don't support position align, excluding that piece from the test makes it pass.
===== Test Results =====
====== Cue Text Parsing ======
{| class="wikitable"
! Test Name !! Chrome 74 !! Firefox 67 !! Safari 77 Preview !! iOS 12.0.1 !! Total passes
|-
! entities
| P || 14/26 || 14/26 || 13/25 || <span style="background-color: red; color: white;">1</span>
|-
! tags
| P || P || P || P || <span style="background-color: lime;">4</span>
|-
! text
| P || P || P || P || <span style="background-color: lime;">4</span>
|-
! timestamps
| P || P || 10/11 || 9/10 || <span style="background-color: lime;">2</span>
|-
! tree building
| P || 8/10 || P || P || <span style="background-color: lime;">3</span>
|}
====== File Parsing ======
{| class="wikitable"
! Test Name !! Chrome 74 !! Firefox 67 !! Safari 77 Preview !! iOS 12.0.1 !! Video.js + vtt.js !! Total passes
|-
! arrows
| P || P || P || P ||  || <span style="background-color: lime;">4</span>
|-
! header garbage
| P || P || P || P ||  || <span style="background-color: lime;">4</span>
|-
! header regions
| P || P || F || F ||  || <span style="background-color: lime;">2</span>
|-
! header space
| P || P || P || P ||  || <span style="background-color: lime;">4</span>
|-
! header tab
| P || P || P || P ||  || <span style="background-color: lime;">4</span>
|-
! header timings
| P || P || P || P ||  || <span style="background-color: lime;">4</span>
|-
! ids
| P || P || P || P ||  || <span style="background-color: lime;">4</span>
|-
! newlines
| P || P || P || P ||  || <span style="background-color: lime;">4</span>
|-
! nulls
| P || P || P || F ||  || <span style="background-color: lime;">3</span>
|-
! regions lines edge cases
| F || F || F || F ||  || <span style="background-color: red; color: white;">0</span>
|-
! regions ids
| F || P || F || F ||  || <span style="background-color: red; color: white;">1</span>
|-
! regions lines
| F || F || F || F ||  || <span style="background-color: red; color: white;">0</span>
|-
! regions old
| P || P || F || F ||  || <span style="background-color: lime;">2</span>
|-
! regions regionanchor
| P || P || F || F ||  || <span style="background-color: lime;">2</span>
|-
! regions scroll
| P || P || F || F ||  || <span style="background-color: lime;">2</span>
|-
! regions viewportanchor
| P || P || F || F ||  || <span style="background-color: lime;">2</span>
|-
! settings align
| P || P || P || F ||  || <span style="background-color: lime;">3</span>
|-
! settings line
| F || F || F || F || P || <span style="background-color: red; color: white;">1</span>
|-
! settings multiple
| P || P || P || F ||  || <span style="background-color: lime;">3</span>
|-
! settings position
| F || P || F || F ||  || <span style="background-color: red; color: white;">1</span>
|-
! settings region
| P || P || F || F ||  || <span style="background-color: lime;">2</span>
|-
! settings size
| P || P || F || F ||  || <span style="background-color: lime;">2</span>
|-
! settings vertical size
| P || P || P || P ||  || <span style="background-color: lime;">4</span>
|-
! signature bom
| P || P || P || P ||  || <span style="background-color: lime;">4</span>
|-
! signature no new line
| P || P || P || P ||  || <span style="background-color: lime;">4</span>
|-
! signature space no newline
| P || P || P || P ||  || <span style="background-color: lime;">4</span>
|-
! signature space
| P || P || P || P ||  || <span style="background-color: lime;">4</span>
|-
! signature tab no newline
| P || P || P || P ||  || <span style="background-color: lime;">4</span>
|-
! signature tab
| P || P || P || P ||  || <span style="background-color: lime;">4</span>
|-
! signatue timing
| P || P || P || P ||  || <span style="background-color: lime;">4</span>
|-
! stylesheets
| P || P || P || P ||  || <span style="background-color: lime;">4</span>
|-
! timings 60
| P || P || P || P ||  || <span style="background-color: lime;">4</span>
|-
! timings eof
| P || P || P || P ||  || <span style="background-color: lime;">4</span>
|-
! timings garbage
| P || P || P || P ||  || <span style="background-color: lime;">4</span>
|-
! timings negative
| P || P || P || P ||  || <span style="background-color: lime;">4</span>
|-
! timings omitted hours
| P || P || P || P ||  || <span style="background-color: lime;">4</span>
|-
! timings too long
| P || P || P || P ||  || <span style="background-color: lime;">4</span>
|-
! timings too short
| P || P || P || P ||  || <span style="background-color: lime;">4</span>
|-
! whitespace chars
| P || P || P || P ||  || <span style="background-color: lime;">4</span>
|}
=== Rendering Tests ===
The Rendering tests deal with the look of the captions. The tests are made up of two files. A reference file, with a `-ref.html` suffix, and a test file.
==== top level tests ====
===== align center wrapped =====
This is failing because `text-wrap: balance;` isn't available in any browser.
==== bidi tests ====
==== cue function, class object ====
==== Text combine upright ====
These are all implementation issues. The text-combine-upright CSS property hasn't been whitelisted by them.
==== Test Results ====
===== Top level =====
{| class="wikitable"
! Test Name !! Chrome 72.0.3626.96 !! STP Release 73 !! STP Release 75 !! Firefox 65 !! VLC 3.0.6 !! vtt.js !! Edge 25/EdgeHTML 13 !! Number of passes
|-
! 2_tracks.html
| P ||  || P || P ||  ||  ||  || <span style="background-color: lime;">3</span>
|-
! 3_tracks.html
| P ||  || P || P ||  ||  ||  || <span style="background-color: lime;">3</span>
|-
! align_center.html
| P ||  || P || P ||  ||  ||  || <span style="background-color: lime;">3</span>
|-
! align_center_position_50.html
| P ||  || P || P ||  ||  ||  || <span style="background-color: lime;">3</span>
|-
! align_center_position_gt_50.html
| P || P || P || P ||  ||  ||  || <span style="background-color: lime;">3</span>
|-
! align_center_position_lt_50.html
| P || P || P || P ||  ||  ||  || <span style="background-color: lime;">3</span>
|-
! align_center_position_lt_50_size_gt_maximum_size.html
| P || P || P || P ||  ||  ||  || <span style="background-color: lime;">3</span>
|-
! align_center_wrapped.html
| F || ? || F || F || P || F ||  || <span style="background-color: red; color: white;">1</span>
|-
! align_end.html
| P || ? || P || P ||  ||  ||  || <span style="background-color: lime;">3</span>
|-
! align_end_wrapped.html
| P || P || P || P ||  ||  ||  || <span style="background-color: lime;">3</span>
|-
! align_start.html
| P || P || P || P ||  ||  ||  || <span style="background-color: lime;">3</span>
|-
! align_start_wrapped.html
| P || P || P || P ||  ||  ||  || <span style="background-color: lime;">3</span>
|-
! audio_has_no_subtitles.html
| P || P || P || P ||  ||  ||  || <span style="background-color: lime;">4</span>
|-
! basic.html
| P || P || P || P ||  ||  ||  || <span style="background-color: lime;">4</span>
|-
! cue_too_long.html
| P || F || F || P || P ||  ||  || <span style="background-color: lime;">3</span>
|-
! decode_escaped_entities.html
| P || P || P || P ||  ||  ||  || <span style="background-color: lime;">4</span>
|-
! disable_controls_reposition.html
| P || P || P || P ||  ||  ||  || <span style="background-color: lime;">4</span>
|-
! dom_override_cue_align_position_line_size.html
| P || P || P || P ||  ||  ||  || <span style="background-color: lime;">4</span>
|-
! dom_override_cue_align_position_line_size_while_paused.html
| P || P || P || P ||  ||  ||  || <span style="background-color: lime;">4</span>
|-
! dom_override_cue_line.html
| P || P || P || P ||  ||  ||  || <span style="background-color: lime;">4</span>
|-
! dom_override_cue_text.html
| P || P || P || P ||  ||  ||  || <span style="background-color: lime;">4</span>
|-
! dom_override_cue_text_while_paused.html
| P || P || P || P ||  ||  ||  || <span style="background-color: lime;">4</span>
|-
! dom_override_remove_cue_while_paused.html
| P ||  || P || F ||  ||  ||  || <span style="background-color: lime;">2</span>
|-
! enable_controls_reposition.html
| P || P || P || P ||  ||  ||  || <span style="background-color: lime;">4</span>
|-
! line_-2_wrapped_cue_grow_upwards.html
| P || P || P || P ||  ||  ||  || <span style="background-color: lime;">4</span>
|-
! line_0_is_top.html
| P || P || P || P ||  ||  ||  || <span style="background-color: lime;">4</span>
|-
! line_1_wrapped_cue_grow_downwards.html
| P || P || P || P ||  ||  ||  || <span style="background-color: lime;">4</span>
|-
! line_50_percent.html
| P || P || P || P ||  ||  ||  || <span style="background-color: lime;">4</span>
|-
! line_integer_and_percent_mixed_overlap.html
| P || P || P || P ||  ||  ||  || <span style="background-color: lime;">3</span>
|-
! line_integer_and_percent_mixed_overlap_move_up.html
| P || P || P || F ||  ||  ||  || <span style="background-color: lime;">2</span>
|-
! line_percent_and_integer_mixed_overlap.html
| P || P || P || P ||  ||  ||  || <span style="background-color: lime;">3</span>
|-
! media_height400_with_controls.html
| P || P || P || P ||  ||  ||  || <span style="background-color: lime;">4</span>
|-
! media_with_controls.html
| P || P || P || P ||  ||  ||  || <span style="background-color: lime;">4</span>
|-
! navigate_cue_position.html
|  || P || P || P ||  ||  ||  || <span style="background-color: lime;">3</span>
|-
! one_line_cue_plus_wrapped_cue.html
| P || P || P || P ||  ||  ||  || <span style="background-color: lime;">3</span>
|-
! repaint.html
| P || P || P || P ||  ||  ||  || <span style="background-color: lime;">4</span>
|-
! size_50.html
| P || P || P || P ||  ||  ||  || <span style="background-color: lime;">4</span>
|-
! too_many_cues.html
| P || P || P || F ||  ||  ||  || <span style="background-color: lime;">2</span>
|}
===== bidi =====
{| class="wikitable"
! Test Name !! Chrome 72.0.3626.96 !! STP Release 73 !! STP Release 75 !! Firefox 65 !! VLC 3.0.6 !! vtt.js !! Edge 25/EdgeHTML 13 !! Number of passes
|-
! bidi_ruby.html
| F || F || F || P || F || P || P || <span style="background-color: lime;">3</span>
|-
! u002E_LF_u05D0.html
| P || F || F || F || P || P || P || <span style="background-color: lime;">4</span>
|-
! u002E_u2028_u05D0.html
| F || F || F || F || F || P || P || <span style="background-color: lime;">2</span>
|-
! u002E_u2029_u05D0.html
| F || F || F || F || F || P || P || <span style="background-color: lime;">2</span>
|-
! u0041_first.html
| P || P || P || P ||  ||  ||  || <span style="background-color: lime;">4</span>
|-
! u05D0_first.html
| P || P || P || P ||  ||  ||  || <span style="background-color: lime;">4</span>
|-
! u0628_first.html
| P || P || P || P ||  ||  ||  || <span style="background-color: lime;">4</span>
|-
! u06E9_no_strong_dir.html
| P || P || P || P ||  ||  ||  || <span style="background-color: lime;">4</span>
|-
! vertical_lr.html
| F ||  || P || F ||  || P ||  || <span style="background-color: lime;">2</span>
|-
! vertical_rl.html
| F ||  || P || F ||  || P ||  || <span style="background-color: lime;">2</span>
|}
===== evil =====
{| class="wikitable"
! Test Name !! Chrome 72.0.3626.96 !! STP Release 73 !! STP Release 75 !! Firefox 65 !! VLC 3.0.6 !! vtt.js !! Edge 25/EdgeHTML 13 !! Number of passes
|-
! media_404_omit_subtitles.html
| P || P || P || P ||  ||  ||  || <span style="background-color: lime;">4</span>
|-
! media_height_19.html
| P || P || P || P ||  ||  ||  || <span style="background-color: lime;">4</span>
|-
! single_quote.html
| P || P || P || P ||  ||  ||  || <span style="background-color: lime;">4</span>
|-
! size_90.html
| P || P || P || P ||  ||  ||  || <span style="background-color: lime;">4</span>
|-
! size_99.html
| P || P || P || P ||  ||  ||  || <span style="background-color: lime;">4</span>
|}
===== regions =====
{| class="wikitable"
! Test Name !! Chrome 72.0.3626.96 !! STP Release 73 !! STP Release 75 !! Firefox 65 !! VLC 3.0.6 !! vtt.js !! Edge 25/EdgeHTML 13 !! Number of passes
|-
! basic.html
| P || F || F || P || P || P ||  || <span style="background-color: lime;">4</span>
|-
! regionanchor_x_50_percent.html
| F || F || F || P || P || F ||  || <span style="background-color: lime;">2</span>
|-
! regionanchor_y_50_percent.html
|  || F ||  ||  ||  ||  ||  || 
|-
! scroll_up.html
| F || F || F || P || P || F ||  || <span style="background-color: lime;">2</span>
|-
! single_line_top_left.html
| F || F ||  || P || P || F ||  || <span style="background-color: lime;">2</span>
|-
! viewportanchor_x_50_percent.html
| F || F ||  || P || P || F ||  || <span style="background-color: lime;">2</span>
|-
! viewportanchor_y_50_percent.html
| F || F ||  || P || P || F ||  || <span style="background-color: lime;">2</span>
|-
! width_50_percent.html
| F || P ||  || P || P || F ||  || <span style="background-color: lime;">3</span>
|}
===== selectors =====
====== cue ======
{| class="wikitable"
! Test Name !! Chrome 72.0.3626.96 !! STP Release 73 !! STP Release 75 !! Firefox 65 !! VLC 3.0.6 !! vtt.js !! Edge 25/EdgeHTML 13 !! Number of passes
|-
! background_properties.html
| P ||  || P || P ||  ||  ||  || <span style="background-color: lime;">3</span>
|-
! background_shorthand.html
| P ||  || P || P ||  ||  ||  || <span style="background-color: lime;">3</span>
|-
! background_shorthand_css_relative_url.html
| P ||  || P || P ||  ||  ||  || <span style="background-color: lime;">3</span>
|-
! color_hex.html
| P ||  || P || P ||  ||  ||  || <span style="background-color: lime;">3</span>
|-
! color_hsla.html
| P ||  || P || P ||  ||  ||  || <span style="background-color: lime;">3</span>
|-
! color_rgba.html
| P ||  || P || P ||  ||  ||  || <span style="background-color: lime;">3</span>
|-
! cue_selector_single_colon.html
| P ||  || P || P ||  ||  ||  || <span style="background-color: lime;">3</span>
|-
! font_properties.html
| P ||  || P || P ||  ||  ||  || <span style="background-color: lime;">3</span>
|-
! font_shorthand.html
| P ||  || P || P ||  ||  ||  || <span style="background-color: lime;">3</span>
|-
! inherit_values_from_media_element.html
| P ||  || F || P ||  ||  ||  || <span style="background-color: lime;">2</span>
|-
! outline_properties.html
| F ||  || P || P ||  ||  ||  || <span style="background-color: lime;">2</span>
|-
! outline_shorthand.html
| F ||  || P || P ||  ||  ||  || <span style="background-color: lime;">2</span>
|-
! text-decoration_line-through.html
| P ||  || P || P ||  ||  ||  || <span style="background-color: lime;">3</span>
|-
! text-decoration_overline.html
| P ||  || P || P ||  ||  ||  || <span style="background-color: lime;">3</span>
|-
! text-decoration_overline_underline_line-through.html
| P ||  || P || P ||  ||  ||  || <span style="background-color: lime;">3</span>
|-
! text-decoration_underline.html
| P ||  || P || P ||  ||  ||  || <span style="background-color: lime;">3</span>
|-
! text-shadow.html
| P ||  || P || P ||  ||  ||  || <span style="background-color: lime;">3</span>
|-
! vertical_ruby-position.html
| F ||  || P || F ||  || P ||  || <span style="background-color: lime;">2</span>
|-
! vertical_text-combine-upright.html
| F ||  || P || F ||  || P ||  || <span style="background-color: lime;">2</span>
|-
! white-space_normal_wrapped.html
| P ||  || P || P ||  ||  ||  || <span style="background-color: lime;">3</span>
|-
! white-space_nowrap_wrapped.html
| P ||  || P || P ||  ||  ||  || <span style="background-color: lime;">3</span>
|-
! white-space_pre-line_wrapped.html
| P ||  || P || P ||  ||  ||  || <span style="background-color: lime;">3</span>
|-
! white-space_pre-wrap_wrapped.html
| P ||  || F || P ||  ||  ||  || <span style="background-color: lime;">2</span>
|-
! white-space_pre.html
| P ||  || F || P ||  ||  ||  || <span style="background-color: lime;">2</span>
|-
! white-space_pre_wrapped.html
| P ||  || P || P ||  ||  ||  || <span style="background-color: lime;">3</span>
|}
====== cue_function bold_object ======
{| class="wikitable"
! Test Name !! Chrome 72.0.3626.96 !! STP Release 73 !! STP Release 75 !! Firefox 65 !! VLC 3.0.6 !! vtt.js !! Edge 25/EdgeHTML 13 !! Number of passes
|-
! bold_background_properties.html
| P ||  || P || F ||  ||  ||  || <span style="background-color: lime;">2</span>
|-
! bold_background_shorthand.html
| P ||  || P || F ||  ||  ||  || <span style="background-color: lime;">2</span>
|-
! bold_color.html
| P ||  || P || F ||  ||  ||  || <span style="background-color: lime;">2</span>
|-
! bold_font_properties.html
| P ||  || P || F ||  ||  ||  || <span style="background-color: lime;">2</span>
|-
! bold_font_shorthand.html
| P ||  || P || F ||  ||  ||  || <span style="background-color: lime;">2</span>
|-
! bold_namespace.html
| P ||  || P || P ||  ||  ||  || <span style="background-color: lime;">3</span>
|-
! bold_outline_properties.html
| P ||  || P || F ||  ||  ||  || <span style="background-color: lime;">2</span>
|-
! bold_outline_shorthand.html
| P ||  || P || F ||  ||  ||  || <span style="background-color: lime;">2</span>
|-
! bold_text-decoration_line-through.html
| P ||  || P || F ||  ||  ||  || <span style="background-color: lime;">2</span>
|-
! bold_text-shadow.html
| P ||  || P || F ||  ||  ||  || <span style="background-color: lime;">2</span>
|-
! bold_timestamp_future.html
| P ||  || P || F ||  ||  ||  || <span style="background-color: lime;">2</span>
|-
! bold_timestamp_past.html
| P ||  || P || F ||  ||  ||  || <span style="background-color: lime;">2</span>
|-
! bold_transition_with_timestamp.html
| P ||  || P || F ||  ||  ||  || <span style="background-color: lime;">2</span>
|-
! bold_white-space_normal_wrapped.html
| P ||  || P || P ||  ||  ||  || <span style="background-color: lime;">3</span>
|-
! bold_white-space_nowrap.html
| P ||  || P || F ||  ||  ||  || <span style="background-color: lime;">2</span>
|-
! bold_white-space_pre-line_wrapped.html
| P ||  || P || P ||  ||  ||  || <span style="background-color: lime;">3</span>
|-
! bold_white-space_pre-wrap_wrapped.html
| P ||  || P || P ||  ||  ||  || <span style="background-color: lime;">3</span>
|-
! bold_white-space_pre_wrapped.html
| P ||  || P || F ||  ||  ||  || <span style="background-color: lime;">2</span>
|-
! bold_with_class.html
| P ||  || P || F ||  ||  ||  || <span style="background-color: lime;">2</span>
|-
! bold_with_class_object_specific_selector.html
| P ||  || P || F ||  ||  ||  || <span style="background-color: lime;">2</span>
|}
====== cue_function class_object ======
{| class="wikitable"
! Test Name !! Chrome 72.0.3626.96 !! STP Release 73 !! STP Release 75 !! Firefox 65 !! VLC 3.0.6 !! vtt.js !! Edge 25/EdgeHTML 13 !! Number of passes
|-
! class_background_properties.html
| P ||  || P || F ||  ||  ||  || <span style="background-color: lime;">2</span>
|-
! class_background_shorthand.html
| P ||  || P || F ||  ||  ||  || <span style="background-color: lime;">2</span>
|-
! class_color.html
| P ||  || P || F ||  ||  ||  || <span style="background-color: lime;">2</span>
|-
! class_font_properties.html
| P ||  || P || F ||  ||  ||  || <span style="background-color: lime;">2</span>
|-
! class_font_shorthand.html
| P ||  || P || F ||  ||  ||  || <span style="background-color: lime;">2</span>
|-
! class_namespace.html
| P ||  || P || P ||  ||  ||  || <span style="background-color: lime;">3</span>
|-
! class_outline_properties.html
| P ||  || P || F ||  ||  ||  || <span style="background-color: lime;">2</span>
|-
! class_outline_shorthand.html
| P ||  || P || F ||  ||  ||  || <span style="background-color: lime;">2</span>
|-
! class_text-decoration_line-through.html
| P ||  || P || F ||  ||  ||  || <span style="background-color: lime;">2</span>
|-
! class_text-shadow.html
| P ||  || P || F ||  ||  ||  || <span style="background-color: lime;">2</span>
|-
! class_timestamp_future.html
| P ||  || P || F ||  ||  ||  || <span style="background-color: lime;">2</span>
|-
! class_timestamp_past.html
| P ||  || P || F ||  ||  ||  || <span style="background-color: lime;">2</span>
|-
! class_transition_with_timestamp.html
| P ||  || P || F ||  ||  ||  || <span style="background-color: lime;">2</span>
|-
! class_vertical_text-combine-upright.html
| F ||  || F || F ||  || P ||  || <span style="background-color: red; color: white;">1</span>
|-
! class_white-space_normal_wrapped.html
| P ||  || P || P ||  ||  ||  || <span style="background-color: lime;">3</span>
|-
! class_white-space_nowrap.html
| P ||  || P || F ||  ||  ||  || <span style="background-color: lime;">2</span>
|-
! class_white-space_pre-line_wrapped.html
| P ||  || P || P ||  ||  ||  || <span style="background-color: lime;">3</span>
|-
! class_white-space_pre-wrap_wrapped.html
| P ||  || P || P ||  ||  ||  || <span style="background-color: lime;">3</span>
|-
! class_white-space_pre_wrapped.html
| P ||  || P || F ||  ||  ||  || <span style="background-color: lime;">2</span>
|-
! class_with_class.html
| P ||  || P || F ||  ||  ||  || <span style="background-color: lime;">2</span>
|-
! class_with_class_object_specific_selector.html
| P ||  || P || F ||  ||  ||  || <span style="background-color: lime;">2</span>
|}
====== cue_function italic_object ======
{| class="wikitable"
! Test Name !! Chrome 72.0.3626.96 !! STP Release 73 !! STP Release 75 !! Firefox 65 !! VLC 3.0.6 !! vtt.js !! Edge 25/EdgeHTML 13 !! Number of passes
|-
! italic_background_properties.html
| P ||  || P || F ||  ||  ||  || <span style="background-color: lime;">2</span>
|-
! italic_background_shorthand.html
| P ||  || P || F ||  ||  ||  || <span style="background-color: lime;">2</span>
|-
! italic_color.html
| P ||  || P || F ||  ||  ||  || <span style="background-color: lime;">2</span>
|-
! italic_font_properties.html
| P ||  || P || F ||  ||  ||  || <span style="background-color: lime;">2</span>
|-
! italic_font_shorthand.html
| P ||  || P || F ||  ||  ||  || <span style="background-color: lime;">2</span>
|-
! italic_namespace.html
| P ||  || P || P ||  ||  ||  || <span style="background-color: lime;">3</span>
|-
! italic_outline_properties.html
| P ||  || P || F ||  ||  ||  || <span style="background-color: lime;">2</span>
|-
! italic_outline_shorthand.html
| P ||  || P || F ||  ||  ||  || <span style="background-color: lime;">2</span>
|-
! italic_text-decoration_line-through.html
| P ||  || P || F ||  ||  ||  || <span style="background-color: lime;">2</span>
|-
! italic_text-shadow.html
| P ||  || P || F ||  ||  ||  || <span style="background-color: lime;">2</span>
|-
! italic_timestamp_future.html
| P ||  || P || F ||  ||  ||  || <span style="background-color: lime;">2</span>
|-
! italic_timestamp_past.html
| P ||  || P || F ||  ||  ||  || <span style="background-color: lime;">2</span>
|-
! italic_transition_with_timestamp.html
| P ||  || P || F ||  ||  ||  || <span style="background-color: lime;">2</span>
|-
! italic_white-space_normal_wrapped.html
| P ||  || P || P ||  ||  ||  || <span style="background-color: lime;">3</span>
|-
! italic_white-space_nowrap.html
| P ||  || P || F ||  ||  ||  || <span style="background-color: lime;">2</span>
|-
! italic_white-space_pre-line_wrapped.html
| P ||  || P || P ||  ||  ||  || <span style="background-color: lime;">3</span>
|-
! italic_white-space_pre-wrap_wrapped.html
| P ||  || P || P ||  ||  ||  || <span style="background-color: lime;">3</span>
|-
! italic_white-space_pre_wrapped.html
| P ||  || P || F ||  ||  ||  || <span style="background-color: lime;">2</span>
|-
! italic_with_class.html
| P ||  || P || F ||  ||  ||  || <span style="background-color: lime;">2</span>
|-
! italic_with_class_object_specific_selector.html
| P ||  || P || F ||  ||  ||  || <span style="background-color: lime;">2</span>
|}
====== cue_function underline_object ======
{| class="wikitable"
! Test Name !! Chrome 72.0.3626.96 !! STP Release 73 !! STP Release 75 !! Firefox 65 !! VLC 3.0.6 !! vtt.js !! Edge 25/EdgeHTML 13 !! Number of passes
|-
! underline_background_properties.html
| P ||  || P || F ||  ||  ||  || <span style="background-color: lime;">2</span>
|-
! underline_background_shorthand.html
| P ||  || P || F ||  ||  ||  || <span style="background-color: lime;">2</span>
|-
! underline_color.html
| P ||  || P || F ||  ||  ||  || <span style="background-color: lime;">2</span>
|-
! underline_font_properties.html
| P ||  || P || F ||  ||  ||  || <span style="background-color: lime;">2</span>
|-
! underline_font_shorthand.html
| P ||  || P || F ||  ||  ||  || <span style="background-color: lime;">2</span>
|-
! underline_namespace.html
| P ||  || P || P ||  ||  ||  || <span style="background-color: lime;">3</span>
|-
! underline_outline_properties.html
| P ||  || P || F ||  ||  ||  || <span style="background-color: lime;">2</span>
|-
! underline_outline_shorthand.html
| P ||  || P || F ||  ||  ||  || <span style="background-color: lime;">2</span>
|-
! underline_text-decoration_line-through.html
| P ||  || P || F ||  ||  ||  || <span style="background-color: lime;">2</span>
|-
! underline_text-shadow.html
| P ||  || P || F ||  ||  ||  || <span style="background-color: lime;">2</span>
|-
! underline_timestamp_future.html
| P ||  || P || F ||  ||  ||  || <span style="background-color: lime;">2</span>
|-
! underline_timestamp_past.html
| P ||  || P || F ||  ||  ||  || <span style="background-color: lime;">2</span>
|-
! underline_transition_with_timestamp.html
| P ||  || P || F ||  ||  ||  || <span style="background-color: lime;">2</span>
|-
! underline_white-space_normal_wrapped.html
| P ||  || P || P ||  ||  ||  || <span style="background-color: lime;">3</span>
|-
! underline_white-space_nowrap.html
| P ||  || P || F ||  ||  ||  || <span style="background-color: lime;">2</span>
|-
! underline_white-space_pre-line_wrapped.html
| P ||  || P || P ||  ||  ||  || <span style="background-color: lime;">3</span>
|-
! underline_white-space_pre-wrap_wrapped.html
| P ||  || P || P ||  ||  ||  || <span style="background-color: lime;">3</span>
|-
! underline_white-space_pre_wrapped.html
| P ||  || P || F ||  ||  ||  || <span style="background-color: lime;">2</span>
|-
! underline_with_class.html
| P ||  || P || F ||  ||  ||  || <span style="background-color: lime;">2</span>
|-
! underline_with_class_object_specific_selector.html
| P ||  || P || F ||  ||  ||  || <span style="background-color: lime;">2</span>
|}
====== cue_function voice_object ======
{| class="wikitable"
! Test Name !! Chrome 72.0.3626.96 !! STP Release 73 !! STP Release 75 !! Firefox 65 !! VLC 3.0.6 !! vtt.js !! Edge 25/EdgeHTML 13 !! Number of passes
|-
! voice_background_properties.html
| P ||  || P || F ||  ||  ||  || <span style="background-color: lime;">2</span>
|-
! voice_background_shorthand.html
| P ||  || P || F ||  ||  ||  || <span style="background-color: lime;">2</span>
|-
! voice_color.html
| P ||  || P || F ||  ||  ||  || <span style="background-color: lime;">2</span>
|-
! voice_font_properties.html
| P ||  || P || F ||  ||  ||  || <span style="background-color: lime;">2</span>
|-
! voice_font_shorthand.html
| P ||  || P || F ||  ||  ||  || <span style="background-color: lime;">2</span>
|-
! voice_namespace.html
| P ||  || P || P ||  ||  ||  || <span style="background-color: lime;">3</span>
|-
! voice_outline_properties.html
| P ||  || P || F ||  ||  ||  || <span style="background-color: lime;">2</span>
|-
! voice_outline_shorthand.html
| P ||  || P || F ||  ||  ||  || <span style="background-color: lime;">2</span>
|-
! voice_text-decoration_line-through.html
| P ||  || P || F ||  ||  ||  || <span style="background-color: lime;">2</span>
|-
! voice_text-shadow.html
| P ||  || P || F ||  ||  ||  || <span style="background-color: lime;">2</span>
|-
! voice_timestamp_future.html
| P ||  || P || F ||  ||  ||  || <span style="background-color: lime;">2</span>
|-
! voice_timestamp_past.html
| P ||  || P || F ||  ||  ||  || <span style="background-color: lime;">2</span>
|-
! voice_transition_with_timestamp.html
| P ||  || P || F ||  ||  ||  || <span style="background-color: lime;">2</span>
|-
! voice_voice_attribute.html
| P ||  || P || F ||  ||  ||  || <span style="background-color: lime;">2</span>
|-
! voice_white-space_normal_wrapped.html
| P ||  || P || P ||  ||  ||  || <span style="background-color: lime;">3</span>
|-
! voice_white-space_nowrap.html
| P ||  || P || F ||  ||  ||  || <span style="background-color: lime;">2</span>
|-
! voice_white-space_pre-line_wrapped.html
| P ||  || P || P ||  ||  ||  || <span style="background-color: lime;">3</span>
|-
! voice_white-space_pre-wrap_wrapped.html
| P ||  || P || P ||  ||  ||  || <span style="background-color: lime;">3</span>
|-
! voice_white-space_pre_wrapped.html
| P ||  || P || F ||  ||  ||  || <span style="background-color: lime;">2</span>
|-
! voice_with_class.html
| P ||  || P || F ||  ||  ||  || <span style="background-color: lime;">2</span>
|-
! voice_with_class_object_specific_selector.html
| P ||  || P || F ||  ||  ||  || <span style="background-color: lime;">2</span>
|}
====== default_styles ======
{| class="wikitable"
! Test Name !! Chrome 72.0.3626.96 !! STP Release 73 !! STP Release 75 !! Firefox 65 !! VLC 3.0.6 !! vtt.js !! Edge 25/EdgeHTML 13 !! Number of passes
|-
! bold_object_default_font-style.html
| P ||  || P || P ||  ||  ||  || <span style="background-color: lime;">3</span>
|-
! inherit_as_default_value_inherits_values_from_media_element.html
| P ||  || P || P ||  ||  ||  || <span style="background-color: lime;">3</span>
|-
! italic_object_default_font-style.html
| P ||  || P || P ||  ||  ||  || <span style="background-color: lime;">3</span>
|-
! underline_object_default_font-style.html
| P ||  || P || P ||  ||  ||  || <span style="background-color: lime;">3</span>
|}
== References ==
See also [[TimedText/EffortsAndSpecifications#WebVTT-based_efforts_and_specifications|WebVTT-based_efforts_and_specifications]].