shaka-player 3.2.1 → 3.3.1

package/test/text/ttml_text_parser_unit.js

@@ -4,6 +4,7 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
+goog.require('shaka.test.TtmlUtils');
 goog.require('shaka.test.Util');
 goog.require('shaka.text.Cue');
 goog.require('shaka.text.CueRegion');
@@ -21,20 +22,23 @@ describe('TtmlTextParser', () => {
   it('supports no cues', () => {
     verifyHelper([],
         '<tt></tt>',
-        {periodStart: 0, segmentStart: 0, segmentEnd: 0});
+        {periodStart: 0, segmentStart: 0, segmentEnd: 0},
+        {});
   });
 
   it('supports empty text string', () => {
     verifyHelper([],
         '',
-        {periodStart: 0, segmentStart: 0, segmentEnd: 0});
+        {periodStart: 0, segmentStart: 0, segmentEnd: 0},
+        {});
   });
 
   it('supports div with no cues but whitespace', () => {
     verifyHelper(
         [],
         '<tt><body><div>  \r\n </div></body></tt>',
-        {periodStart: 0, segmentStart: 0, segmentEnd: 0});
+        {periodStart: 0, segmentStart: 0, segmentEnd: 0},
+        {});
   });
 
   it('supports xml:space', () => {
@@ -60,7 +64,8 @@ describe('TtmlTextParser', () => {
           },
         ],
         '<tt xml:space="default">' + ttBody + '</tt>',
-        {periodStart: 0, segmentStart: 0, segmentEnd: 0});
+        {periodStart: 0, segmentStart: 0, segmentEnd: 0},
+        {startTime: 62.03, endTime: 62.05});
     // When xml:space="preserve", take them into account.
     verifyHelper(
         [
@@ -85,7 +90,8 @@ describe('TtmlTextParser', () => {
           },
         ],
         '<tt xml:space="preserve">' + ttBody + '</tt>',
-        {periodStart: 0, segmentStart: 0, segmentEnd: 0});
+        {periodStart: 0, segmentStart: 0, segmentEnd: 0},
+        {startTime: 62.03, endTime: 62.05});
     // The default value for xml:space is "default".
     verifyHelper(
         [
@@ -100,7 +106,8 @@ describe('TtmlTextParser', () => {
           },
         ],
         '<tt>' + ttBody + '</tt>',
-        {periodStart: 0, segmentStart: 0, segmentEnd: 0});
+        {periodStart: 0, segmentStart: 0, segmentEnd: 0},
+        {startTime: 62.03, endTime: 62.05});
 
     // Any other value is rejected as an error.
     errorHelper(shaka.util.Error.Code.INVALID_XML,
@@ -130,7 +137,8 @@ describe('TtmlTextParser', () => {
           },
         ],
         '<tt>' + ttBody + '</tt>',
-        {periodStart: 0, segmentStart: 0, segmentEnd: 0});
+        {periodStart: 0, segmentStart: 0, segmentEnd: 0},
+        {startTime: 62.03, endTime: 62.05});
   });
 
   it('rejects invalid ttml', () => {
@@ -199,7 +207,8 @@ describe('TtmlTextParser', () => {
         '<span>First cue</span><br /><span>Second cue</span>' +
         '</p>' +
         '</div></body></tt>',
-        {periodStart: 0, segmentStart: 0, segmentEnd: 0});
+        {periodStart: 0, segmentStart: 0, segmentEnd: 0},
+        {startTime: 62.05, endTime: 3723.2});
   });
 
   it('supports anonymous spans as nestedCues of paragraphs', () => {
@@ -234,7 +243,8 @@ describe('TtmlTextParser', () => {
         'First cue<br />Second cue' +
         '</p>' +
         '</div></body></tt>',
-        {periodStart: 0, segmentStart: 0, segmentEnd: 0});
+        {periodStart: 0, segmentStart: 0, segmentEnd: 0},
+        {startTime: 62.05, endTime: 3723.2});
   });
 
   it('supports multiple levels of nestedCues', () => {
@@ -292,7 +302,8 @@ describe('TtmlTextParser', () => {
         '</span>' +
         '</p>' +
         '</div></body></tt>',
-        {periodStart: 0, segmentStart: 0, segmentEnd: 0});
+        {periodStart: 0, segmentStart: 0, segmentEnd: 0},
+        {startTime: 62.05, endTime: 3723.2});
   });
 
   it('inherits timing information of nested cues if unprovided', () => {
@@ -307,9 +318,11 @@ describe('TtmlTextParser', () => {
           },
         ],
         '<tt><body>' +
-        '<div><div begin="01:02.05" end="01:02:03.200">Test</div></div>' +
+        '<div><p begin="01:02.05" end="01:02:03.200">' +
+        '<span>Test</span></p></div>' +
         '</body></tt>',
-        {periodStart: 0, segmentStart: 0, segmentEnd: 0});
+        {periodStart: 0, segmentStart: 0, segmentEnd: 0},
+        {startTime: 62.05, endTime: 3723.2});
   });
 
   it('does not discard cues with image subcues', () => {
@@ -334,11 +347,12 @@ describe('TtmlTextParser', () => {
         '<metadata>' +
         '<smpte:image imageType="PNG" encoding="Base64" xml:id="img_0">' +
         'base64EncodedImage</smpte:image>' +
-        '</metadata><body>' +
-        '<div><div begin="01:02.05" end="01:02:03.200" ' +
-        'smpte:backgroundImage="#img_0"></div></div>' +
-        '</body></tt>',
-        {periodStart: 0, segmentStart: 0, segmentEnd: 0});
+        '</metadata><body><div>' +
+        '<p><div begin="01:02.05" end="01:02:03.200" ' +
+        'smpte:backgroundImage="#img_0"></div></p>' +
+        '</div></body></tt>',
+        {periodStart: 0, segmentStart: 0, segmentEnd: 0},
+        {startTime: 62.05, endTime: 3723.2});
   });
 
   it('supports colon formatted time', () => {
@@ -349,7 +363,8 @@ describe('TtmlTextParser', () => {
         '<tt><body><div>' +
         '<p begin="01:02.05" end="01:02:03.200">Test</p>' +
         '</div></body></tt>',
-        {periodStart: 0, segmentStart: 0, segmentEnd: 0});
+        {periodStart: 0, segmentStart: 0, segmentEnd: 0},
+        {startTime: 62.05, endTime: 3723.2});
   });
 
   it('accounts for offset', () => {
@@ -360,7 +375,8 @@ describe('TtmlTextParser', () => {
         '<tt><body><div>' +
         '<p begin="01:02.05" end="01:02:03.200">Test</p>' +
         '</div></body></tt>',
-        {periodStart: 7, segmentStart: 0, segmentEnd: 0});
+        {periodStart: 7, segmentStart: 0, segmentEnd: 0},
+        {startTime: 69.05, endTime: 3730.2});
   });
 
   it('supports nested cues with an offset', () => {
@@ -382,7 +398,8 @@ describe('TtmlTextParser', () => {
         '<tt><body><div>' +
         '<p begin="01:02.05" end="01:02:03.200"><span>Nested cue</span></p>' +
         '</div></body></tt>',
-        {periodStart: 7, segmentStart: 0, segmentEnd: 0});
+        {periodStart: 7, segmentStart: 0, segmentEnd: 0},
+        {startTime: 69.05, endTime: 3730.2});
   });
 
   it('supports time in 0.00h 0.00m 0.00s format', () => {
@@ -393,7 +410,8 @@ describe('TtmlTextParser', () => {
         '<tt><body><div>' +
         '<p begin="59.45m30ms" end="1.5h2.3s">Test</p>' +
         '</div></body></tt>',
-        {periodStart: 0, segmentStart: 0, segmentEnd: 0});
+        {periodStart: 0, segmentStart: 0, segmentEnd: 0},
+        {startTime: 3567.03, endTime: 5402.3});
   });
 
   it('supports time with frame rate', () => {
@@ -406,7 +424,8 @@ describe('TtmlTextParser', () => {
         '<body><div>' +
         '<p begin="00:10:15:15" end="00:11:02:30">Test</p>' +
         '</div></body></tt>',
-        {periodStart: 0, segmentStart: 0, segmentEnd: 0});
+        {periodStart: 0, segmentStart: 0, segmentEnd: 0},
+        {startTime: 615.5, endTime: 663});
   });
 
   it('supports time with frame rate multiplier', () => {
@@ -419,7 +438,8 @@ describe('TtmlTextParser', () => {
         '<body><div>' +
         '<p begin="00:10:15:15" end="00:11:02:30">Test</p>' +
         '</div></body></tt>',
-        {periodStart: 0, segmentStart: 0, segmentEnd: 0});
+        {periodStart: 0, segmentStart: 0, segmentEnd: 0},
+        {startTime: 615.5, endTime: 663});
   });
 
   it('supports time with subframes', () => {
@@ -436,7 +456,8 @@ describe('TtmlTextParser', () => {
         '<body><div>' +
         '<p begin="00:10:15:15.1" end="00:11:02:29.2">Test</p>' +
         '</div></body></tt>',
-        {periodStart: 0, segmentStart: 0, segmentEnd: 0});
+        {periodStart: 0, segmentStart: 0, segmentEnd: 0},
+        {startTime: Util.closeTo(615.5 + 1 / 60), endTime: 663});
   });
 
   it('supports time in frame format', () => {
@@ -449,7 +470,8 @@ describe('TtmlTextParser', () => {
         '<body><div>' +
         '<p begin="75f" end="300.3f">Test</p>' +
         '</div></body></tt>',
-        {periodStart: 0, segmentStart: 0, segmentEnd: 0});
+        {periodStart: 0, segmentStart: 0, segmentEnd: 0},
+        {startTime: 2.5, endTime: Util.closeTo(10.01)});
   });
 
   it('supports time in tick format', () => {
@@ -462,7 +484,8 @@ describe('TtmlTextParser', () => {
         '<body><div>' +
         '<p begin="50t" end="60.2t">Test</p>' +
         '</div></body></tt>',
-        {periodStart: 0, segmentStart: 0, segmentEnd: 0});
+        {periodStart: 0, segmentStart: 0, segmentEnd: 0},
+        {startTime: 5, endTime: Util.closeTo(6.02)});
   });
 
   it('supports time with duration', () => {
@@ -473,7 +496,39 @@ describe('TtmlTextParser', () => {
         '<tt><body><div>' +
         '<p begin="01:02.05" dur="5s">Test</p>' +
         '</div></body></tt>',
-        {periodStart: 0, segmentStart: 0, segmentEnd: 0});
+        {periodStart: 0, segmentStart: 0, segmentEnd: 0},
+        {startTime: 62.05, endTime: 67.05});
+  });
+
+  it('supports comments in the body', () => {
+    verifyHelper(
+        [],
+        '<tt><body><div>' +
+        '<!-- text-based TTML -->' +
+        '</div></body></tt>',
+        {periodStart: 0, segmentStart: 0, segmentEnd: 0},
+        {});
+  });
+
+  it('does not inherit regions', () => {
+    verifyHelper(
+        [
+          {
+            startTime: 62.05,
+            endTime: 3723.2,
+            payload: 'Test',
+          },
+        ],
+        '<tt xmlns:tts="http://www.w3.org/ns/ttml#styling">' +
+        '<layout>' +
+        '<region xml:id="subtitleArea" />' +
+        '</layout>' +
+        '<body region="subtitleArea"><div>' +
+        '<p begin="01:02.05" end="01:02:03.200">Test</p>' +
+        '</div></body></tt>',
+        {periodStart: 0, segmentStart: 0, segmentEnd: 0},
+        {startTime: 62.05, endTime: 3723.2, region: {id: 'subtitleArea'}},
+        {startTime: 62.05, endTime: 3723.2});
   });
 
   it('parses alignment from textAlign attribute of a region', () => {
@@ -493,7 +548,9 @@ describe('TtmlTextParser', () => {
         '<body region="subtitleArea"><div>' +
         '<p begin="01:02.05" end="01:02:03.200">Test</p>' +
         '</div></body></tt>',
-        {periodStart: 0, segmentStart: 0, segmentEnd: 0});
+        {periodStart: 0, segmentStart: 0, segmentEnd: 0},
+        {startTime: 62.05, endTime: 3723.2, region: {id: 'subtitleArea'}},
+        {startTime: 62.05, endTime: 3723.2});
   });
 
   it('allows non-standard namespace names', () => {
@@ -513,7 +570,9 @@ describe('TtmlTextParser', () => {
         '<body region="subtitleArea"><div>' +
         '<p begin="01:02.05" end="01:02:03.200">Test</p>' +
         '</div></body></tt>',
-        {periodStart: 0, segmentStart: 0, segmentEnd: 0});
+        {periodStart: 0, segmentStart: 0, segmentEnd: 0},
+        {startTime: 62.05, endTime: 3723.2, region: {id: 'subtitleArea'}},
+        {startTime: 62.05, endTime: 3723.2});
   });
 
   it('parses alignment from <style> block with id on region', () => {
@@ -536,7 +595,9 @@ describe('TtmlTextParser', () => {
         '<body region="subtitleArea"><div>' +
         '<p begin="01:02.05" end="01:02:03.200">Test</p>' +
         '</div></body></tt>',
-        {periodStart: 0, segmentStart: 0, segmentEnd: 0});
+        {periodStart: 0, segmentStart: 0, segmentEnd: 0},
+        {startTime: 62.05, endTime: 3723.2, region: {id: 'subtitleArea'}},
+        {startTime: 62.05, endTime: 3723.2});
   });
 
   it('parses alignment from <style> block with id on p', () => {
@@ -559,7 +620,9 @@ describe('TtmlTextParser', () => {
         '<body region="subtitleArea"><div>' +
         '<p begin="01:02.05" end="01:02:03.200" style="s1">Test</p>' +
         '</div></body></tt>',
-        {periodStart: 0, segmentStart: 0, segmentEnd: 0});
+        {periodStart: 0, segmentStart: 0, segmentEnd: 0},
+        {startTime: 62.05, endTime: 3723.2, region: {id: 'subtitleArea'}},
+        {startTime: 62.05, endTime: 3723.2});
   });
 
   it('supports region settings for horizontal text', () => {
@@ -569,13 +632,6 @@ describe('TtmlTextParser', () => {
             startTime: 62.05,
             endTime: 3723.2,
             payload: 'Test',
-            region: {
-              id: 'subtitleArea',
-              viewportAnchorX: 50,
-              viewportAnchorY: 16,
-              width: 100,
-              height: 100,
-            },
           },
         ],
         '<tt xmlns:tts="http://www.w3.org/ns/ttml#styling">' +
@@ -585,7 +641,18 @@ describe('TtmlTextParser', () => {
         '<body region="subtitleArea"><div>' +
         '<p begin="01:02.05" end="01:02:03.200">Test</p>' +
         '</div></body></tt>',
-        {periodStart: 0, segmentStart: 0, segmentEnd: 0});
+        {periodStart: 0, segmentStart: 0, segmentEnd: 0},
+        {
+          region: {
+            id: 'subtitleArea',
+            viewportAnchorX: 50,
+            viewportAnchorY: 16,
+            width: 100,
+            height: 100,
+          },
+          startTime: 62.05,
+          endTime: 3723.2,
+        }, {startTime: 62.05, endTime: 3723.2});
 
     verifyHelper(
         [
@@ -593,12 +660,6 @@ describe('TtmlTextParser', () => {
             startTime: 62.05,
             endTime: 3723.2,
             payload: 'Test',
-            region: {
-              viewportAnchorX: 50,
-              viewportAnchorY: 16,
-              width: 100,
-              height: 100,
-            },
           },
         ],
         '<tt xmlns:tts="http://www.w3.org/ns/ttml#styling">' +
@@ -609,7 +670,17 @@ describe('TtmlTextParser', () => {
         '<body region="subtitleArea"><div>' +
         '<p begin="01:02.05" end="01:02:03.200">Test</p>' +
         '</div></body></tt>',
-        {periodStart: 0, segmentStart: 0, segmentEnd: 0});
+        {periodStart: 0, segmentStart: 0, segmentEnd: 0},
+        {
+          region: {
+            viewportAnchorX: 50,
+            viewportAnchorY: 16,
+            width: 100,
+            height: 100,
+          },
+          startTime: 62.05,
+          endTime: 3723.2,
+        }, {startTime: 62.05, endTime: 3723.2});
 
     verifyHelper(
         [
@@ -617,12 +688,6 @@ describe('TtmlTextParser', () => {
             startTime: 62.05,
             endTime: 3723.2,
             payload: 'Test',
-            region: {
-              viewportAnchorX: 50,
-              viewportAnchorY: 16,
-              width: 100,
-              height: 100,
-            },
           },
         ],
         '<tt xmlns:tts="http://www.w3.org/ns/ttml#styling">' +
@@ -633,7 +698,17 @@ describe('TtmlTextParser', () => {
         '<body region="subtitleArea"><div>' +
         '<p begin="01:02.05" end="01:02:03.200">Test</p>' +
         '</div></body></tt>',
-        {periodStart: 0, segmentStart: 0, segmentEnd: 0});
+        {periodStart: 0, segmentStart: 0, segmentEnd: 0},
+        {
+          region: {
+            viewportAnchorX: 50,
+            viewportAnchorY: 16,
+            width: 100,
+            height: 100,
+          },
+          startTime: 62.05,
+          endTime: 3723.2,
+        }, {startTime: 62.05, endTime: 3723.2});
   });
 
   it('supports region settings in pixels (origin)', () => {
@@ -643,19 +718,6 @@ describe('TtmlTextParser', () => {
             startTime: 62.05,
             endTime: 3723.2,
             payload: 'Test',
-            region: {
-              id: 'subtitleArea',
-              viewportAnchorX: 50,
-              viewportAnchorY: 16,
-              regionAnchorX: 0,
-              regionAnchorY: 0,
-              width: 100,
-              height: 100,
-              heightUnits: CueRegion.units.PERCENTAGE,
-              widthUnits: CueRegion.units.PERCENTAGE,
-              viewportAnchorUnits: CueRegion.units.PX,
-              scroll: CueRegion.scrollMode.NONE,
-            },
           },
         ],
         '<tt xmlns:tts="http://www.w3.org/ns/ttml#styling">' +
@@ -665,7 +727,24 @@ describe('TtmlTextParser', () => {
         '<body region="subtitleArea"><div>' +
         '<p begin="01:02.05" end="01:02:03.200">Test</p>' +
         '</div></body></tt>',
-        {periodStart: 0, segmentStart: 0, segmentEnd: 0});
+        {periodStart: 0, segmentStart: 0, segmentEnd: 0},
+        {
+          region: {
+            id: 'subtitleArea',
+            viewportAnchorX: 50,
+            viewportAnchorY: 16,
+            regionAnchorX: 0,
+            regionAnchorY: 0,
+            width: 100,
+            height: 100,
+            heightUnits: CueRegion.units.PERCENTAGE,
+            widthUnits: CueRegion.units.PERCENTAGE,
+            viewportAnchorUnits: CueRegion.units.PX,
+            scroll: CueRegion.scrollMode.NONE,
+          },
+          startTime: 62.05,
+          endTime: 3723.2,
+        }, {startTime: 62.05, endTime: 3723.2});
   });
 
   it('supports region settings in pixels (extent)', () => {
@@ -675,19 +754,6 @@ describe('TtmlTextParser', () => {
             startTime: 62.05,
             endTime: 3723.2,
             payload: 'Test',
-            region: {
-              id: 'subtitleArea',
-              viewportAnchorX: 0,
-              viewportAnchorY: 0,
-              regionAnchorX: 0,
-              regionAnchorY: 0,
-              width: 50,
-              height: 16,
-              heightUnits: CueRegion.units.PX,
-              widthUnits: CueRegion.units.PX,
-              viewportAnchorUnits: CueRegion.units.PERCENTAGE,
-              scroll: CueRegion.scrollMode.NONE,
-            },
           },
         ],
         '<tt xmlns:tts="http://www.w3.org/ns/ttml#styling">' +
@@ -697,7 +763,24 @@ describe('TtmlTextParser', () => {
         '<body region="subtitleArea"><div>' +
         '<p begin="01:02.05" end="01:02:03.200">Test</p>' +
         '</div></body></tt>',
-        {periodStart: 0, segmentStart: 0, segmentEnd: 0});
+        {periodStart: 0, segmentStart: 0, segmentEnd: 0},
+        {
+          region: {
+            id: 'subtitleArea',
+            viewportAnchorX: 0,
+            viewportAnchorY: 0,
+            regionAnchorX: 0,
+            regionAnchorY: 0,
+            width: 50,
+            height: 16,
+            heightUnits: CueRegion.units.PX,
+            widthUnits: CueRegion.units.PX,
+            viewportAnchorUnits: CueRegion.units.PERCENTAGE,
+            scroll: CueRegion.scrollMode.NONE,
+          },
+          startTime: 62.05,
+          endTime: 3723.2,
+        }, {startTime: 62.05, endTime: 3723.2});
   });
 
   it('supports region settings in pixels: origin (with global extent)', () => {
@@ -707,19 +790,6 @@ describe('TtmlTextParser', () => {
             startTime: 62.05,
             endTime: 3723.2,
             payload: 'Test',
-            region: {
-              id: 'subtitleArea',
-              viewportAnchorX: 10,
-              viewportAnchorY: 10,
-              regionAnchorX: 0,
-              regionAnchorY: 0,
-              width: 100,
-              height: 100,
-              heightUnits: CueRegion.units.PERCENTAGE,
-              widthUnits: CueRegion.units.PERCENTAGE,
-              viewportAnchorUnits: CueRegion.units.PERCENTAGE,
-              scroll: CueRegion.scrollMode.NONE,
-            },
           },
         ],
         '<tt xmlns:tts="http://www.w3.org/ns/ttml#styling" tts:extent="1920px 1080px">' +
@@ -729,7 +799,24 @@ describe('TtmlTextParser', () => {
         '<body region="subtitleArea"><div>' +
         '<p begin="01:02.05" end="01:02:03.200">Test</p>' +
         '</div></body></tt>',
-        {periodStart: 0, segmentStart: 0, segmentEnd: 0});
+        {periodStart: 0, segmentStart: 0, segmentEnd: 0},
+        {
+          region: {
+            id: 'subtitleArea',
+            viewportAnchorX: 10,
+            viewportAnchorY: 10,
+            regionAnchorX: 0,
+            regionAnchorY: 0,
+            width: 100,
+            height: 100,
+            heightUnits: CueRegion.units.PERCENTAGE,
+            widthUnits: CueRegion.units.PERCENTAGE,
+            viewportAnchorUnits: CueRegion.units.PERCENTAGE,
+            scroll: CueRegion.scrollMode.NONE,
+          },
+          startTime: 62.05,
+          endTime: 3723.2,
+        }, {startTime: 62.05, endTime: 3723.2});
   });
 
   it('supports region settings in pixels: extent (with global extent)', () => {
@@ -739,19 +826,6 @@ describe('TtmlTextParser', () => {
             startTime: 62.05,
             endTime: 3723.2,
             payload: 'Test',
-            region: {
-              id: 'subtitleArea',
-              viewportAnchorX: 0,
-              viewportAnchorY: 0,
-              regionAnchorX: 0,
-              regionAnchorY: 0,
-              width: 30,
-              height: 30,
-              heightUnits: CueRegion.units.PERCENTAGE,
-              widthUnits: CueRegion.units.PERCENTAGE,
-              viewportAnchorUnits: CueRegion.units.PERCENTAGE,
-              scroll: CueRegion.scrollMode.NONE,
-            },
           },
         ],
         '<tt xmlns:tts="http://www.w3.org/ns/ttml#styling" tts:extent="1920px 1080px">' +
@@ -762,7 +836,24 @@ describe('TtmlTextParser', () => {
         '<body region="subtitleArea"><div>' +
         '<p begin="01:02.05" end="01:02:03.200">Test</p>' +
         '</div></body></tt>',
-        {periodStart: 0, segmentStart: 0, segmentEnd: 0});
+        {periodStart: 0, segmentStart: 0, segmentEnd: 0},
+        {
+          region: {
+            id: 'subtitleArea',
+            viewportAnchorX: 0,
+            viewportAnchorY: 0,
+            regionAnchorX: 0,
+            regionAnchorY: 0,
+            width: 30,
+            height: 30,
+            heightUnits: CueRegion.units.PERCENTAGE,
+            widthUnits: CueRegion.units.PERCENTAGE,
+            viewportAnchorUnits: CueRegion.units.PERCENTAGE,
+            scroll: CueRegion.scrollMode.NONE,
+          },
+          startTime: 62.05,
+          endTime: 3723.2,
+        }, {startTime: 62.05, endTime: 3723.2});
   });
 
   it('supports region settings in percentage (origin)', () => {
@@ -772,29 +863,34 @@ describe('TtmlTextParser', () => {
             startTime: 62.05,
             endTime: 3723.2,
             payload: 'Test',
-            region: {
-              id: 'subtitleArea',
-              viewportAnchorX: 50,
-              viewportAnchorY: 16,
-              regionAnchorX: 0,
-              regionAnchorY: 0,
-              width: 100,
-              height: 100,
-              heightUnits: CueRegion.units.PERCENTAGE,
-              widthUnits: CueRegion.units.PERCENTAGE,
-              viewportAnchorUnits: CueRegion.units.PERCENTAGE,
-              scroll: CueRegion.scrollMode.NONE,
-            },
           },
         ],
-        '<tt xmlns:tts="http://www.w3.org/ns/ttml#styling" tts:extent="1920px 1080px">' +
+        '<tt xmlns:tts="http://www.w3.org/ns/ttml#styling" ' +
+        'tts:extent="1920px 1080px">' +
         '<layout>' +
         '<region xml:id="subtitleArea" tts:origin="50% 16%"/>' +
         '</layout>' +
         '<body region="subtitleArea"><div>' +
         '<p begin="01:02.05" end="01:02:03.200">Test</p>' +
         '</div></body></tt>',
-        {periodStart: 0, segmentStart: 0, segmentEnd: 0});
+        {periodStart: 0, segmentStart: 0, segmentEnd: 0},
+        {
+          region: {
+            id: 'subtitleArea',
+            viewportAnchorX: 50,
+            viewportAnchorY: 16,
+            regionAnchorX: 0,
+            regionAnchorY: 0,
+            width: 100,
+            height: 100,
+            heightUnits: CueRegion.units.PERCENTAGE,
+            widthUnits: CueRegion.units.PERCENTAGE,
+            viewportAnchorUnits: CueRegion.units.PERCENTAGE,
+            scroll: CueRegion.scrollMode.NONE,
+          },
+          startTime: 62.05,
+          endTime: 3723.2,
+        }, {startTime: 62.05, endTime: 3723.2});
   });
 
   it('supports region settings in percentage (extent)', () => {
@@ -804,22 +900,10 @@ describe('TtmlTextParser', () => {
             startTime: 62.05,
             endTime: 3723.2,
             payload: 'Test',
-            region: {
-              id: 'subtitleArea',
-              viewportAnchorX: 0,
-              viewportAnchorY: 0,
-              regionAnchorX: 0,
-              regionAnchorY: 0,
-              width: 50,
-              height: 16,
-              heightUnits: CueRegion.units.PERCENTAGE,
-              widthUnits: CueRegion.units.PERCENTAGE,
-              viewportAnchorUnits: CueRegion.units.PERCENTAGE,
-              scroll: CueRegion.scrollMode.NONE,
-            },
           },
         ],
-        '<tt xmlns:tts="http://www.w3.org/ns/ttml#styling" tts:extent="1920px 1080px">' +
+        '<tt xmlns:tts="http://www.w3.org/ns/ttml#styling" ' +
+        'tts:extent="1920px 1080px">' +
         '<layout>' +
         '<region xml:id="subtitleArea" tts:extent="50% 16%" ' +
         'tts:writingMode="lrtb" />' +
@@ -827,7 +911,24 @@ describe('TtmlTextParser', () => {
         '<body region="subtitleArea"><div>' +
         '<p begin="01:02.05" end="01:02:03.200">Test</p>' +
         '</div></body></tt>',
-        {periodStart: 0, segmentStart: 0, segmentEnd: 0});
+        {periodStart: 0, segmentStart: 0, segmentEnd: 0},
+        {
+          region: {
+            id: 'subtitleArea',
+            viewportAnchorX: 0,
+            viewportAnchorY: 0,
+            regionAnchorX: 0,
+            regionAnchorY: 0,
+            width: 50,
+            height: 16,
+            heightUnits: CueRegion.units.PERCENTAGE,
+            widthUnits: CueRegion.units.PERCENTAGE,
+            viewportAnchorUnits: CueRegion.units.PERCENTAGE,
+            scroll: CueRegion.scrollMode.NONE,
+          },
+          startTime: 62.05,
+          endTime: 3723.2,
+        }, {startTime: 62.05, endTime: 3723.2});
   });
 
   it('supports region settings for vertical text', () => {
@@ -837,13 +938,6 @@ describe('TtmlTextParser', () => {
             startTime: 62.05,
             endTime: 3723.2,
             payload: 'Test',
-            region: {
-              id: 'subtitleArea',
-              viewportAnchorX: 50,
-              viewportAnchorY: 16,
-              width: 100,
-              height: 100,
-            },
           },
         ],
         '<tt xmlns:tts="http://www.w3.org/ns/ttml#styling">' +
@@ -854,7 +948,18 @@ describe('TtmlTextParser', () => {
         '<body region="subtitleArea"><div>' +
         '<p begin="01:02.05" end="01:02:03.200">Test</p>' +
         '</div></body></tt>',
-        {periodStart: 0, segmentStart: 0, segmentEnd: 0});
+        {periodStart: 0, segmentStart: 0, segmentEnd: 0},
+        {
+          region: {
+            id: 'subtitleArea',
+            viewportAnchorX: 50,
+            viewportAnchorY: 16,
+            width: 100,
+            height: 100,
+          },
+          startTime: 62.05,
+          endTime: 3723.2,
+        }, {startTime: 62.05, endTime: 3723.2});
 
     verifyHelper(
         [
@@ -862,12 +967,6 @@ describe('TtmlTextParser', () => {
             startTime: 62.05,
             endTime: 3723.2,
             payload: 'Test',
-            region: {
-              viewportAnchorX: 50,
-              viewportAnchorY: 16,
-              width: 100,
-              height: 100,
-            },
           },
         ],
         '<tt xmlns:tts="http://www.w3.org/ns/ttml#styling">' +
@@ -878,7 +977,17 @@ describe('TtmlTextParser', () => {
         '<body region="subtitleArea"><div>' +
         '<p begin="01:02.05" end="01:02:03.200">Test</p>' +
         '</div></body></tt>',
-        {periodStart: 0, segmentStart: 0, segmentEnd: 0});
+        {periodStart: 0, segmentStart: 0, segmentEnd: 0},
+        {
+          region: {
+            viewportAnchorX: 50,
+            viewportAnchorY: 16,
+            width: 100,
+            height: 100,
+          },
+          startTime: 62.05,
+          endTime: 3723.2,
+        }, {startTime: 62.05, endTime: 3723.2});
 
     verifyHelper(
         [
@@ -886,12 +995,6 @@ describe('TtmlTextParser', () => {
             startTime: 62.05,
             endTime: 3723.2,
             payload: 'Test',
-            region: {
-              viewportAnchorX: 50,
-              viewportAnchorY: 16,
-              width: 100,
-              height: 100,
-            },
           },
         ],
         '<tt xmlns:tts="http://www.w3.org/ns/ttml#styling">' +
@@ -902,7 +1005,17 @@ describe('TtmlTextParser', () => {
         '<body region="subtitleArea"><div>' +
         '<p begin="01:02.05" end="01:02:03.200">Test</p>' +
         '</div></body></tt>',
-        {periodStart: 0, segmentStart: 0, segmentEnd: 0});
+        {periodStart: 0, segmentStart: 0, segmentEnd: 0},
+        {
+          region: {
+            viewportAnchorX: 50,
+            viewportAnchorY: 16,
+            width: 100,
+            height: 100,
+          },
+          startTime: 62.05,
+          endTime: 3723.2,
+        }, {startTime: 62.05, endTime: 3723.2});
   });
 
   it('supports percentages containing decimals', () => {
@@ -912,13 +1025,6 @@ describe('TtmlTextParser', () => {
             startTime: 62.05,
             endTime: 3723.2,
             payload: 'Test',
-            region: {
-              id: 'subtitleArea',
-              viewportAnchorX: 12.2,
-              viewportAnchorY: 50.005,
-              width: 100,
-              height: 100,
-            },
           },
         ],
         '<tt xmlns:tts="http://www.w3.org/ns/ttml#styling">' +
@@ -929,7 +1035,18 @@ describe('TtmlTextParser', () => {
         '<body region="subtitleArea"><div>' +
         '<p begin="01:02.05" end="01:02:03.200">Test</p>' +
         '</div></body></tt>',
-        {periodStart: 0, segmentStart: 0, segmentEnd: 0});
+        {periodStart: 0, segmentStart: 0, segmentEnd: 0},
+        {
+          region: {
+            id: 'subtitleArea',
+            viewportAnchorX: 12.2,
+            viewportAnchorY: 50.005,
+            width: 100,
+            height: 100,
+          },
+          startTime: 62.05,
+          endTime: 3723.2,
+        }, {startTime: 62.05, endTime: 3723.2});
   });
 
   it('supports writingMode setting', () => {
@@ -950,7 +1067,9 @@ describe('TtmlTextParser', () => {
         '<body region="subtitleArea"><div>' +
         '<p begin="01:02.05" end="01:02:03.200">Test</p>' +
         '</div></body></tt>',
-        {periodStart: 0, segmentStart: 0, segmentEnd: 0});
+        {periodStart: 0, segmentStart: 0, segmentEnd: 0},
+        {startTime: 62.05, endTime: 3723.2, region: {id: 'subtitleArea'}},
+        {startTime: 62.05, endTime: 3723.2});
 
     verifyHelper(
         [
@@ -969,7 +1088,9 @@ describe('TtmlTextParser', () => {
         '<body region="subtitleArea"><div>' +
         '<p begin="01:02.05" end="01:02:03.200">Test</p>' +
         '</div></body></tt>',
-        {periodStart: 0, segmentStart: 0, segmentEnd: 0});
+        {periodStart: 0, segmentStart: 0, segmentEnd: 0},
+        {startTime: 62.05, endTime: 3723.2, region: {id: 'subtitleArea'}},
+        {startTime: 62.05, endTime: 3723.2});
 
     verifyHelper(
         [
@@ -988,7 +1109,9 @@ describe('TtmlTextParser', () => {
         '<body region="subtitleArea"><div>' +
         '<p begin="01:02.05" end="01:02:03.200">Test</p>' +
         '</div></body></tt>',
-        {periodStart: 0, segmentStart: 0, segmentEnd: 0});
+        {periodStart: 0, segmentStart: 0, segmentEnd: 0},
+        {startTime: 62.05, endTime: 3723.2, region: {id: 'subtitleArea'}},
+        {startTime: 62.05, endTime: 3723.2});
 
     verifyHelper(
         [
@@ -1007,7 +1130,9 @@ describe('TtmlTextParser', () => {
         '<body region="subtitleArea"><div>' +
         '<p begin="01:02.05" end="01:02:03.200">Test</p>' +
         '</div></body></tt>',
-        {periodStart: 0, segmentStart: 0, segmentEnd: 0});
+        {periodStart: 0, segmentStart: 0, segmentEnd: 0},
+        {startTime: 62.05, endTime: 3723.2, region: {id: 'subtitleArea'}},
+        {startTime: 62.05, endTime: 3723.2});
 
     verifyHelper(
         [
@@ -1026,7 +1151,9 @@ describe('TtmlTextParser', () => {
         '<body region="subtitleArea"><div>' +
         '<p begin="01:02.05" end="01:02:03.200">Test</p>' +
         '</div></body></tt>',
-        {periodStart: 0, segmentStart: 0, segmentEnd: 0});
+        {periodStart: 0, segmentStart: 0, segmentEnd: 0},
+        {startTime: 62.05, endTime: 3723.2, region: {id: 'subtitleArea'}},
+        {startTime: 62.05, endTime: 3723.2});
   });
 
   it('disregards empty divs and ps', () => {
@@ -1042,7 +1169,8 @@ describe('TtmlTextParser', () => {
         '<div></div>' +
         '</body>' +
         '</tt>',
-        {periodStart: 0, segmentStart: 0, segmentEnd: 0});
+        {periodStart: 0, segmentStart: 0, segmentEnd: 0},
+        {startTime: 62.05, endTime: 3723.2});
 
     verifyHelper(
         [
@@ -1056,7 +1184,8 @@ describe('TtmlTextParser', () => {
         '</div>' +
         '</body>' +
         '</tt>',
-        {periodStart: 0, segmentStart: 0, segmentEnd: 0});
+        {periodStart: 0, segmentStart: 0, segmentEnd: 0},
+        {startTime: 62.05, endTime: 3723.2});
 
     verifyHelper(
         [],
@@ -1068,7 +1197,8 @@ describe('TtmlTextParser', () => {
         '<div></div>' +
         '</body>' +
         '</tt>',
-        {periodStart: 0, segmentStart: 0, segmentEnd: 0});
+        {periodStart: 0, segmentStart: 0, segmentEnd: 0},
+        {});
   });
 
   it('should let empty paragraphs with begin or end attributes through', () => {
@@ -1084,7 +1214,8 @@ describe('TtmlTextParser', () => {
         '</div>' +
         '</body>' +
         '</tt>',
-        {periodStart: 0, segmentStart: 0, segmentEnd: 0});
+        {periodStart: 0, segmentStart: 0, segmentEnd: 0},
+        {startTime: 62.05, endTime: 3723.2});
   });
 
   it('supports smpte:backgroundImage attribute', () => {
@@ -1094,7 +1225,6 @@ describe('TtmlTextParser', () => {
             startTime: 62.05,
             endTime: 3723.2,
             payload: '',
-            backgroundImage: 'data:image/png;base64,base64EncodedImage',
           },
         ],
         '<tt ' +
@@ -1107,19 +1237,19 @@ describe('TtmlTextParser', () => {
         '<body><div smpte:backgroundImage="#img_0">' +
         '<p begin="01:02.05" end="01:02:03.200"></p>' +
         '</div></body></tt>',
-        {periodStart: 0, segmentStart: 0, segmentEnd: 0});
+        {periodStart: 0, segmentStart: 0, segmentEnd: 0},
+        {startTime: 62.05, endTime: 3723.2},
+        {
+          startTime: 62.05,
+          endTime: 3723.2,
+          backgroundImage: 'data:image/png;base64,base64EncodedImage',
+          isContainer: false,
+        });
   });
 
   it('supports smpte:backgroundImage attribute in div element', () => {
     verifyHelper(
-        [
-          {
-            startTime: 0,
-            endTime: 62.05,
-            payload: '',
-            backgroundImage: 'data:image/png;base64,base64EncodedImage',
-          },
-        ],
+        [],
         '<tt ' +
         'xmlns:ttm="http://www.w3.org/ns/ttml#metadata" ' +
         'xmlns:smpte="http://www.smpte-ra.org/schemas/2052-1/2010/smpte-tt">' +
@@ -1130,7 +1260,14 @@ describe('TtmlTextParser', () => {
         '<body><div begin="00:00.00" end="01:02.05" '+
         'smpte:backgroundImage="#img_0"></div>' +
         '</body></tt>',
-        {periodStart: 0, segmentStart: 0, segmentEnd: 0});
+        {periodStart: 0, segmentStart: 0, segmentEnd: 0},
+        {startTime: 0, endTime: 62.05},
+        {
+          startTime: 0,
+          endTime: 62.05,
+          backgroundImage: 'data:image/png;base64,base64EncodedImage',
+          isContainer: false,
+        });
   });
 
   it('supports smpte:backgroundImage attribute alt namespace', () => {
@@ -1154,7 +1291,8 @@ describe('TtmlTextParser', () => {
         '<p begin="01:02.05" end="01:02:03.200" ' +
         'smpte:backgroundImage="#img_0" />' +
         '</div></body></tt>',
-        {periodStart: 0, segmentStart: 0, segmentEnd: 0});
+        {periodStart: 0, segmentStart: 0, segmentEnd: 0},
+        {startTime: 62.05, endTime: 3723.2});
   });
 
   it('inserts line breaks for <br> tags', () => {
@@ -1182,7 +1320,8 @@ describe('TtmlTextParser', () => {
         '<tt><body><div>' +
         '<p begin="01:02.05" end="01:02:03.200">Line1<br/>Line2</p>' +
         '</div></body></tt>',
-        {periodStart: 0, segmentStart: 0, segmentEnd: 0});
+        {periodStart: 0, segmentStart: 0, segmentEnd: 0},
+        {startTime: 62.05, endTime: 3723.2});
 
     verifyHelper(
         [{
@@ -1215,7 +1354,36 @@ describe('TtmlTextParser', () => {
         '<span>Line1<br/>Line2</span>' +
         '</p>' +
         '</div></body></tt>',
-        {periodStart: 0, segmentStart: 0, segmentEnd: 0});
+        {periodStart: 0, segmentStart: 0, segmentEnd: 0},
+        {startTime: 62.05, endTime: 3723.2});
+  });
+
+  it('allows old-standard namespace', () => {
+    verifyHelper(
+        [
+          {
+            startTime: 1,
+            endTime: 2,
+            payload: 'Test',
+            cellResolution: {
+              columns: 60,
+              rows: 20,
+            },
+            fontSize: '67%',
+          },
+        ],
+        '<tt ' +
+        'xmlns:ttp="http://www.w3.org/2006/10/ttaf1#parameter" ' +
+        'xmlns:tts="http://www.w3.org/2006/10/ttaf1#styling" ' +
+        'ttp:cellResolution="60 20">' +
+        '<styling>' +
+        '<style xml:id="s1" tts:fontSize="67%"/>' +
+        '</styling>' +
+        '<body><div>' +
+        '<p begin="00:01.00" end="00:02.00" style="s1">Test</p>' +
+        '</div></body></tt>',
+        {periodStart: 0, segmentStart: 0, segmentEnd: 0},
+        {startTime: 1, endTime: 2});
   });
 
   it('parses cue alignment from textAlign attribute', () => {
@@ -1240,7 +1408,9 @@ describe('TtmlTextParser', () => {
         '<body region="subtitleArea"><div>' +
         '<p begin="01:02.05" end="01:02:03.200" style="s1">Test</p>' +
         '</div></body></tt>',
-        {periodStart: 0, segmentStart: 0, segmentEnd: 0});
+        {periodStart: 0, segmentStart: 0, segmentEnd: 0},
+        {startTime: 62.05, endTime: 3723.2, region: {id: 'subtitleArea'}},
+        {startTime: 62.05, endTime: 3723.2});
   });
 
   it('parses text style information', () => {
@@ -1257,6 +1427,8 @@ describe('TtmlTextParser', () => {
             fontStyle: Cue.fontStyle.ITALIC,
             lineHeight: '20px',
             fontSize: '10em',
+            textStrokeColor: 'blue',
+            textStrokeWidth: '3px',
           },
           {
             startTime: 2,
@@ -1268,6 +1440,7 @@ describe('TtmlTextParser', () => {
         '<tt xmlns:tts="http://www.w3.org/ns/ttml#styling">' +
         '<styling>' +
         '<style xml:id="s1" tts:color="red" ' +
+        'tts:textOutline="blue 3px" ' +
         'tts:backgroundColor="blue" ' +
         'tts:fontWeight="bold" ' +
         'tts:fontFamily="Times New Roman" ' +
@@ -1283,7 +1456,55 @@ describe('TtmlTextParser', () => {
         '<p begin="00:01.00" end="00:02.00" style="s1">Test</p>' +
         '<p begin="00:02.00" end="00:04.00" style="s2">Test 2</p>' +
         '</div></body></tt>',
-        {periodStart: 0, segmentStart: 0, segmentEnd: 0});
+        {periodStart: 0, segmentStart: 0, segmentEnd: 0},
+        {startTime: 1, endTime: 4, region: {id: 'subtitleArea'}},
+        {startTime: 1, endTime: 4});
+  });
+
+  it('uses text color if tts:textOutline does not specify color', () => {
+    verifyHelper(
+        [
+          {
+            startTime: 1,
+            endTime: 2,
+            payload: 'Test',
+            color: 'red',
+            textStrokeColor: 'red',
+            textStrokeWidth: '3px',
+          },
+        ],
+        '<tt xmlns:tts="http://www.w3.org/ns/ttml#styling">' +
+        '<styling>' +
+        '<style xml:id="s1" tts:color="red" ' +
+        'tts:textOutline="3px" />' +
+        '</styling>' +
+        '<body region="subtitleArea"><div>' +
+        '<p begin="00:01.00" end="00:02.00" style="s1">Test</p>' +
+        '</div></body></tt>',
+        {periodStart: 0, segmentStart: 0, segmentEnd: 0},
+        {startTime: 1, endTime: 2});
+  });
+
+  it('does not add an outline if tts:textOutline only contains color', () => {
+    verifyHelper(
+        [
+          {
+            startTime: 1,
+            endTime: 2,
+            payload: 'Test',
+            color: 'red',
+          },
+        ],
+        '<tt xmlns:tts="http://www.w3.org/ns/ttml#styling">' +
+        '<styling>' +
+        '<style xml:id="s1" tts:color="red" ' +
+        'tts:textOutline="blue" />' +
+        '</styling>' +
+        '<body region="subtitleArea"><div>' +
+        '<p begin="00:01.00" end="00:02.00" style="s1">Test</p>' +
+        '</div></body></tt>',
+        {periodStart: 0, segmentStart: 0, segmentEnd: 0},
+        {startTime: 1, endTime: 2});
   });
 
   // Regression test for #2623
@@ -1319,7 +1540,8 @@ describe('TtmlTextParser', () => {
         '<span style="s1">Test</span>' +
         '</p>' +
         '</div></body></tt>',
-        {periodStart: 0, segmentStart: 0, segmentEnd: 0});
+        {periodStart: 0, segmentStart: 0, segmentEnd: 0},
+        {startTime: 1, endTime: 2});
   });
 
   it('parses wrapping option', () => {
@@ -1342,7 +1564,9 @@ describe('TtmlTextParser', () => {
         '<body region="subtitleArea"><div>' +
         '<p begin="01:02.05" end="01:02:03.200" style="s1">Test</p>' +
         '</div></body></tt>',
-        {periodStart: 0, segmentStart: 0, segmentEnd: 0});
+        {periodStart: 0, segmentStart: 0, segmentEnd: 0},
+        {startTime: 62.05, endTime: 3723.2, region: {id: 'subtitleArea'}},
+        {startTime: 62.05, endTime: 3723.2});
   });
 
   it('parses text decoration', () => {
@@ -1368,7 +1592,9 @@ describe('TtmlTextParser', () => {
         '<body region="subtitleArea"><div>' +
         '<p begin="01:02.05" end="01:02:03.200" style="s2">Test</p>' +
         '</div></body></tt>',
-        {periodStart: 0, segmentStart: 0, segmentEnd: 0});
+        {periodStart: 0, segmentStart: 0, segmentEnd: 0},
+        {startTime: 62.05, endTime: 3723.2, region: {id: 'subtitleArea'}},
+        {startTime: 62.05, endTime: 3723.2});
   });
 
   it('cues should have default cellResolution', () => {
@@ -1391,7 +1617,8 @@ describe('TtmlTextParser', () => {
         '<body><div>' +
         '<p begin="00:01.00" end="00:02.00" style="s1">Test</p>' +
         '</div></body></tt>',
-        {periodStart: 0, segmentStart: 0, segmentEnd: 0});
+        {periodStart: 0, segmentStart: 0, segmentEnd: 0},
+        {startTime: 1, endTime: 2});
   });
 
   it('parses cellResolution', () => {
@@ -1418,7 +1645,8 @@ describe('TtmlTextParser', () => {
         '<body><div>' +
         '<p begin="00:01.00" end="00:02.00" style="s1">Test</p>' +
         '</div></body></tt>',
-        {periodStart: 0, segmentStart: 0, segmentEnd: 0});
+        {periodStart: 0, segmentStart: 0, segmentEnd: 0},
+        {startTime: 1, endTime: 2});
   });
 
   it('parses line padding', () => {
@@ -1446,7 +1674,8 @@ describe('TtmlTextParser', () => {
         '<body><div>' +
         '<p begin="00:01.00" end="00:02.00" style="s1">Test</p>' +
         '</div></body></tt>',
-        {periodStart: 0, segmentStart: 0, segmentEnd: 0});
+        {periodStart: 0, segmentStart: 0, segmentEnd: 0},
+        {startTime: 1, endTime: 2});
   });
 
   it('chooses style on element over style on region', () => {
@@ -1470,7 +1699,9 @@ describe('TtmlTextParser', () => {
         '<body region="subtitleArea"><div>' +
         '<p begin="01:02.05" end="01:02:03.200" style="s2">Test</p>' +
         '</div></body></tt>',
-        {periodStart: 0, segmentStart: 0, segmentEnd: 0});
+        {periodStart: 0, segmentStart: 0, segmentEnd: 0},
+        {startTime: 62.05, endTime: 3723.2, region: {id: 'subtitleArea'}},
+        {startTime: 62.05, endTime: 3723.2});
   });
 
   it('can parse multiple cues', () => {
@@ -1483,7 +1714,8 @@ describe('TtmlTextParser', () => {
         '<p begin="00:01.00" end="00:02.00">First cue</p>' +
         '<p begin="00:03.00" end="00:04.00">Second cue</p>' +
         '</div></body></tt>',
-        {periodStart: 0, segmentStart: 0, segmentEnd: 0});
+        {periodStart: 0, segmentStart: 0, segmentEnd: 0},
+        {startTime: 1, endTime: 4});
   });
 
   // Regression test for https://github.com/google/shaka-player/issues/2478
@@ -1506,7 +1738,8 @@ describe('TtmlTextParser', () => {
         '<tt><body><div>' +
         '<p begin="01:02.05" end="01:02:03.200"><span>äöü</span></p>' +
         '</div></body></tt>',
-        {periodStart: 0, segmentStart: 0, segmentEnd: 0});
+        {periodStart: 0, segmentStart: 0, segmentEnd: 0},
+        {startTime: 62.05, endTime: 3723.2});
   });
 
   it('supports timing on multiple levels', () => {
@@ -1522,7 +1755,9 @@ describe('TtmlTextParser', () => {
         '<p begin="3s" end="4s">First cue</p>' +
         '<p begin="4s" end="5s">Second cue</p>' +
         '</div></body></tt>',
-        {periodStart: 0, segmentStart: 0, segmentEnd: 0});
+        {periodStart: 0, segmentStart: 0, segmentEnd: 0},
+        {startTime: 1, endTime: Infinity},
+        {startTime: 3, endTime: Infinity});
 
     verifyHelper(
         [{
@@ -1545,7 +1780,9 @@ describe('TtmlTextParser', () => {
         '<span begin="5s" end="6s">Second cue</span>' +
         '</p>' +
         '</div></body></tt>',
-        {periodStart: 0, segmentStart: 0, segmentEnd: 0});
+        {periodStart: 0, segmentStart: 0, segmentEnd: 0},
+        {startTime: 1, endTime: Infinity},
+        {startTime: 3, endTime: Infinity});
   });
 
   it('gets end time from parent directly if missing', () => {
@@ -1559,7 +1796,9 @@ describe('TtmlTextParser', () => {
         '<p begin="3s" end="4s">First cue</p>' +
         '<p begin="4s">Second cue</p>' +
         '</div></body></tt>',
-        {periodStart: 0, segmentStart: 0, segmentEnd: 0});
+        {periodStart: 0, segmentStart: 0, segmentEnd: 0},
+        {startTime: 1, endTime: 30},
+        {startTime: 3, endTime: 30});
   });
 
   it('supports never-ending cues', () => {
@@ -1572,7 +1811,8 @@ describe('TtmlTextParser', () => {
         '<p begin="1s">First cue</p>' +
         '<p begin="2s">Second cue</p>' +
         '</div></body></tt>',
-        {periodStart: 0, segmentStart: 0, segmentEnd: 0});
+        {periodStart: 0, segmentStart: 0, segmentEnd: 0},
+        {startTime: 1, endTime: Infinity});
   });
 
   // Regression test for b/159050711
@@ -1588,8 +1828,8 @@ describe('TtmlTextParser', () => {
             // Styles from regionStyle should apply only to the nested cue.
             backgroundColor: '',
             color: '',
-            displayAlign: Cue.displayAlign.AFTER, // displayAlign default value.
-            textAlign: Cue.textAlign.START, // textAlign default value.
+            displayAlign: Cue.displayAlign.CENTER,
+            textAlign: Cue.textAlign.CENTER,
 
             nestedCues: [
               {
@@ -1614,7 +1854,7 @@ describe('TtmlTextParser', () => {
                 // Styles inherited from backgroundStyle via regionStyle via
                 // spanStyle
                 displayAlign: Cue.displayAlign.CENTER,
-                textAlign: Cue.textAlign.CENTER,
+                textAlign: Cue.textAlign.END,
               },
             ],
           },
@@ -1628,7 +1868,7 @@ describe('TtmlTextParser', () => {
         // spanStyle inherits attributes from regionStyle
         '    <style xml:id="pStyle" tts:fontSize="15px" />' +
         '    <style xml:id="spanStyle" style="regionStyle" ' +
-        '           tts:backgroundColor="white" />' +
+        '           tts:backgroundColor="white" tts:textAlign="end" />' +
         // regionStyle inherits attributes from backgroundStyle
         '    <style xml:id="regionStyle" style="backgroundStyle" ' +
         '           tts:backgroundColor="transparent" tts:color="blue" />' +
@@ -1643,32 +1883,117 @@ describe('TtmlTextParser', () => {
         '    <span style="spanStyle">Test with spanStyle</span>' +
         '  </p>' +
         '</div></body></tt>',
-        {periodStart: 0, segmentStart: 0, segmentEnd: 0});
+        {periodStart: 0, segmentStart: 0, segmentEnd: 0},
+        {startTime: 0, endTime: 60});
+  });
+
+  it('inherits alignment from parent regions', () => {
+    verifyHelper(
+        [
+          {
+            startTime: 0,
+            endTime: 60,
+            payload: '',
+            fontSize: '',
+            textAlign: Cue.textAlign.END,
+            displayAlign: Cue.displayAlign.CENTER,
+            nestedCues: [
+              {
+                startTime: 0,
+                endTime: 60,
+                payload: 'Hello!',
+                textAlign: Cue.textAlign.END,
+                displayAlign: Cue.displayAlign.CENTER,
+              },
+            ],
+          },
+        ],
+        '<tt xmlns:tts="http://www.w3.org/ns/ttml#styling">' +
+        '<head><layout>' +
+        '<region xml:id="r1" tts:textAlign="end" tts:displayAlign="center" />' +
+        '</layout></head>' +
+        '<body><div><p begin="00:00" end="01:00" region="r1">' +
+        '<span>Hello!</span>' +
+        '</p></div></body></tt>',
+        {periodStart: 0, segmentStart: 0, segmentEnd: 0},
+        {startTime: 0, endTime: 60},
+    );
+  });
+
+  // Regression test for https://github.com/google/shaka-player/issues/3743
+  it('inherits styles from other styles on nestedCues', () => {
+    verifyHelper(
+        [
+          {
+            // p element
+            startTime: 0,
+            endTime: 60,
+            payload: '',
+            fontSize: '',
+            nestedCues: [
+              {
+                startTime: 0,
+                endTime: 60,
+                payload: 'A',
+                fontSize: '16px',
+              },
+              {
+                startTime: 0,
+                endTime: 60,
+                payload: '',
+                fontSize: '',
+              },
+              {
+                startTime: 0,
+                endTime: 60,
+                payload: 'B',
+                fontSize: '16px',
+              },
+            ],
+          },
+        ],
+        '<tt xmlns:tts="http://www.w3.org/ns/ttml#styling">' +
+        '<head>' +
+        '  <styling>' +
+        '   <style tts:backgroundColor="rgba(0,0,0,100)" ' +
+        '          tts:displayAlign="center" ' +
+        '          tts:extent="80% 10%" ' +
+        '          tts:fontFamily="proportionalSansSerif" ' +
+        '          tts:fontSize="16px" ' +
+        '          tts:origin="10% 85%" ' +
+        '          tts:textAlign="center" ' +
+        '          xml:id="backgroundStyle"/>' +
+        '   <style style="backgroundStyle" ' +
+        '          tts:backgroundColor="transparent" ' +
+        '          tts:color="white" ' +
+        '          xml:id="speakerStyle"/>' +
+        '  </styling>' +
+        '  <layout>' +
+        '    <region style="speakerStyle" tts:zIndex="1" xml:id="speaker"/>' +
+        '  </layout>' +
+        '</head>' +
+        '<body><div>' +
+        '  <p begin="00:00" end="01:00" region="speaker">' +
+        '    A<br/>B' +
+        '  </p>' +
+        '</div></body></tt>',
+        {periodStart: 0, segmentStart: 0, segmentEnd: 0},
+        {startTime: 0, endTime: 60});
   });
 
   /**
    * @param {!Array} cues
    * @param {string} text
    * @param {shaka.extern.TextParser.TimeContext} time
+   * @param {!Object} bodyProperties
+   * @param {Object=} divProperties
    */
-  function verifyHelper(cues, text, time) {
+  function verifyHelper(cues, text, time, bodyProperties, divProperties) {
     const data =
         shaka.util.BufferUtils.toUint8(shaka.util.StringUtils.toUTF8(text));
     const result = new shaka.text.TtmlTextParser().parseMedia(data, time);
-
-    const mapExpected = (cue) => {
-      if (cue.region) {
-        cue.region = jasmine.objectContaining(cue.region);
-      }
-
-      if (cue.nestedCues) {
-        cue.nestedCues = cue.nestedCues.map(mapExpected);
-      }
-
-      return jasmine.objectContaining(cue);
-    };
-    const expected = cues.map(mapExpected);
-    expect(result).toEqual(expected);
+    shaka.test.TtmlUtils.verifyHelper(
+        cues, result, bodyProperties, divProperties);
   }