shaka-player 4.7.13 → 4.8.0

package/lib/text/ttml_text_parser.js

@@ -15,7 +15,7 @@ goog.require('shaka.text.TextEngine');
 goog.require('shaka.util.ArrayUtils');
 goog.require('shaka.util.Error');
 goog.require('shaka.util.StringUtils');
-goog.require('shaka.util.XmlUtils');
+goog.require('shaka.util.TXml');
 
 
 /**
@@ -53,7 +53,7 @@ shaka.text.TtmlTextParser = class {
    */
   parseMedia(data, time, uri) {
     const TtmlTextParser = shaka.text.TtmlTextParser;
-    const XmlUtils = shaka.util.XmlUtils;
+    const TXml = shaka.util.TXml;
     const ttpNs = TtmlTextParser.parameterNs_;
     const ttsNs = TtmlTextParser.styleNs_;
     const str = shaka.util.StringUtils.fromUTF8(data);
@@ -65,7 +65,7 @@ shaka.text.TtmlTextParser = class {
       return cues;
     }
 
-    const tt = XmlUtils.parseXmlString(str, 'tt');
+    const tt = TXml.parseXmlString(str, 'tt');
     if (!tt) {
       throw new shaka.util.Error(
           shaka.util.Error.Severity.CRITICAL,
@@ -74,23 +74,23 @@ shaka.text.TtmlTextParser = class {
           'Failed to parse TTML.');
     }
 
-    const body = tt.getElementsByTagName('body')[0];
+    const body = TXml.getElementsByTagName(tt, 'body')[0];
     if (!body) {
       return [];
     }
 
     // Get the framerate, subFrameRate and frameRateMultiplier if applicable.
-    const frameRate = XmlUtils.getAttributeNSList(tt, ttpNs, 'frameRate');
-    const subFrameRate = XmlUtils.getAttributeNSList(
+    const frameRate = TXml.getAttributeNSList(tt, ttpNs, 'frameRate');
+    const subFrameRate = TXml.getAttributeNSList(
         tt, ttpNs, 'subFrameRate');
     const frameRateMultiplier =
-        XmlUtils.getAttributeNSList(tt, ttpNs, 'frameRateMultiplier');
-    const tickRate = XmlUtils.getAttributeNSList(tt, ttpNs, 'tickRate');
+        TXml.getAttributeNSList(tt, ttpNs, 'frameRateMultiplier');
+    const tickRate = TXml.getAttributeNSList(tt, ttpNs, 'tickRate');
 
-    const cellResolution = XmlUtils.getAttributeNSList(
+    const cellResolution = TXml.getAttributeNSList(
         tt, ttpNs, 'cellResolution');
-    const spaceStyle = tt.getAttribute('xml:space') || 'default';
-    const extent = XmlUtils.getAttributeNSList(tt, ttsNs, 'extent');
+    const spaceStyle = tt.attributes['xml:space'] || 'default';
+    const extent = TXml.getAttributeNSList(tt, ttsNs, 'extent');
 
     if (spaceStyle != 'default' && spaceStyle != 'preserve') {
       throw new shaka.util.Error(
@@ -99,7 +99,7 @@ shaka.text.TtmlTextParser = class {
           shaka.util.Error.Code.INVALID_XML,
           'Invalid xml:space value: ' + spaceStyle);
     }
-    const whitespaceTrim = spaceStyle == 'default';
+    const collapseMultipleSpaces = spaceStyle == 'default';
 
     const rateInfo = new TtmlTextParser.RateInfo_(
         frameRate, subFrameRate, frameRateMultiplier, tickRate);
@@ -107,10 +107,10 @@ shaka.text.TtmlTextParser = class {
     const cellResolutionInfo =
       TtmlTextParser.getCellResolution_(cellResolution);
 
-    const metadata = tt.getElementsByTagName('metadata')[0];
-    const metadataElements = metadata ? XmlUtils.getChildren(metadata) : [];
-    const styles = Array.from(tt.getElementsByTagName('style'));
-    const regionElements = Array.from(tt.getElementsByTagName('region'));
+    const metadata = TXml.getElementsByTagName(tt, 'metadata')[0];
+    const metadataElements = metadata ? metadata.children : [];
+    const styles = TXml.getElementsByTagName(tt, 'style');
+    const regionElements = TXml.getElementsByTagName(tt, 'region');
 
     const cueRegions = [];
     for (const region of regionElements) {
@@ -125,7 +125,7 @@ shaka.text.TtmlTextParser = class {
     // elements.  We used to allow this, but it is non-compliant, and the
     // loose nature of our previous parser made it difficult to implement TTML
     // nesting more fully.
-    if (XmlUtils.findChildren(body, 'p').length) {
+    if (TXml.findChildren(body, 'p').length) {
       throw new shaka.util.Error(
           shaka.util.Error.Severity.CRITICAL,
           shaka.util.Error.Category.TEXT,
@@ -133,9 +133,9 @@ shaka.text.TtmlTextParser = class {
           '<p> can only be inside <div> in TTML');
     }
 
-    for (const div of XmlUtils.findChildren(body, 'div')) {
+    for (const div of TXml.findChildren(body, 'div')) {
       // A <div> element should only contain <p>, not <span>.
-      if (XmlUtils.findChildren(div, 'span').length) {
+      if (TXml.findChildren(div, 'span').length) {
         throw new shaka.util.Error(
             shaka.util.Error.Severity.CRITICAL,
             shaka.util.Error.Category.TEXT,
@@ -146,7 +146,7 @@ shaka.text.TtmlTextParser = class {
 
     const cue = TtmlTextParser.parseCue_(
         body, time, rateInfo, metadataElements, styles,
-        regionElements, cueRegions, whitespaceTrim,
+        regionElements, cueRegions, collapseMultipleSpaces,
         cellResolutionInfo, /* parentCueElement= */ null,
         /* isContent= */ false, uri);
     if (cue) {
@@ -165,16 +165,16 @@ shaka.text.TtmlTextParser = class {
   /**
    * Parses a TTML node into a Cue.
    *
-   * @param {!Node} cueNode
+   * @param {!shaka.extern.xml.Node} cueNode
    * @param {shaka.extern.TextParser.TimeContext} timeContext
    * @param {!shaka.text.TtmlTextParser.RateInfo_} rateInfo
-   * @param {!Array.<!Element>} metadataElements
-   * @param {!Array.<!Element>} styles
-   * @param {!Array.<!Element>} regionElements
+   * @param {!Array.<!shaka.extern.xml.Node>} metadataElements
+   * @param {!Array.<!shaka.extern.xml.Node>} styles
+   * @param {!Array.<!shaka.extern.xml.Node>} regionElements
    * @param {!Array.<!shaka.text.CueRegion>} cueRegions
-   * @param {boolean} whitespaceTrim
+   * @param {boolean} collapseMultipleSpaces
    * @param {?{columns: number, rows: number}} cellResolution
-   * @param {?Element} parentCueElement
+   * @param {?shaka.extern.xml.Node} parentCueElement
    * @param {boolean} isContent
    * @param {?(string|undefined)} uri
    * @return {shaka.text.Cue}
@@ -182,19 +182,16 @@ shaka.text.TtmlTextParser = class {
    */
   static parseCue_(
       cueNode, timeContext, rateInfo, metadataElements, styles, regionElements,
-      cueRegions, whitespaceTrim, cellResolution, parentCueElement, isContent,
-      uri) {
-    /** @type {Element} */
+      cueRegions, collapseMultipleSpaces, cellResolution, parentCueElement,
+      isContent, uri) {
+    const TXml = shaka.util.TXml;
+    const StringUtils = shaka.util.StringUtils;
+    /** @type {shaka.extern.xml.Node} */
     let cueElement;
-    /** @type {Element} */
-    let parentElement = /** @type {Element} */ (cueNode.parentNode);
+    /** @type {?shaka.extern.xml.Node} */
+    let parentElement = parentCueElement;
 
-    if (cueNode.nodeType == Node.COMMENT_NODE) {
-      // The comments do not contain information that interests us here.
-      return null;
-    }
-
-    if (cueNode.nodeType == Node.TEXT_NODE) {
+    if (TXml.isText(cueNode)) {
       if (!isContent) {
         // Ignore text elements outside the content. For example, whitespace
         // on the same lexical level as the <p> elements, in a document with
@@ -205,13 +202,16 @@ shaka.text.TtmlTextParser = class {
       // So pretend the element was a <span>.  parentElement was set above, so
       // we should still be able to correctly traverse up for timing
       // information later.
-      const span = document.createElement('span');
-      span.textContent = cueNode.textContent;
+      /** @type {shaka.extern.xml.Node} */
+      const span = {
+        tagName: 'span',
+        children: [TXml.getTextContents(cueNode)],
+        attributes: {},
+        parent: null,
+      };
       cueElement = span;
     } else {
-      goog.asserts.assert(cueNode.nodeType == Node.ELEMENT_NODE,
-          'nodeType should be ELEMENT_NODE!');
-      cueElement = /** @type {!Element} */(cueNode);
+      cueElement = cueNode;
     }
     goog.asserts.assert(cueElement, 'cueElement should be non-null!');
 
@@ -226,7 +226,7 @@ shaka.text.TtmlTextParser = class {
     }
 
     let imageUri = null;
-    const backgroundImage = shaka.util.XmlUtils.getAttributeNSList(
+    const backgroundImage = TXml.getAttributeNSList(
         cueElement,
         shaka.text.TtmlTextParser.smpteNsList_,
         'backgroundImage');
@@ -239,27 +239,24 @@ shaka.text.TtmlTextParser = class {
       }
     }
 
-    if (cueNode.nodeName == 'p' || imageElement || imageUri) {
+    if (cueNode.tagName == 'p' || imageElement || imageUri) {
       isContent = true;
     }
 
     const parentIsContent = isContent;
 
-    const spaceStyle = cueElement.getAttribute('xml:space') ||
-        (whitespaceTrim ? 'default' : 'preserve');
+    const spaceStyle = cueElement.attributes['xml:space'] ||
+        (collapseMultipleSpaces ? 'default' : 'preserve');
 
-    const localWhitespaceTrim = spaceStyle == 'default';
+    const localCollapseMultipleSpaces = spaceStyle == 'default';
 
     // Parse any nested cues first.
-    const isTextNode = (node) => {
-      return node.nodeType == Node.TEXT_NODE;
-    };
-    const isLeafNode = Array.from(cueElement.childNodes).every(isTextNode);
+    const isLeafNode = cueElement.children.every(TXml.isText);
     const nestedCues = [];
     if (!isLeafNode) {
       // Otherwise, recurse into the children.  Text nodes will convert into
       // anonymous spans, which will then be leaf nodes.
-      for (const childNode of cueElement.childNodes) {
+      for (const childNode of cueElement.children) {
         const nestedCue = shaka.text.TtmlTextParser.parseCue_(
             childNode,
             timeContext,
@@ -268,7 +265,7 @@ shaka.text.TtmlTextParser = class {
             styles,
             regionElements,
             cueRegions,
-            localWhitespaceTrim,
+            localCollapseMultipleSpaces,
             cellResolution,
             cueElement,
             isContent,
@@ -284,12 +281,16 @@ shaka.text.TtmlTextParser = class {
 
     const isNested = /** @type {boolean} */ (parentCueElement != null);
 
+    const textContent = TXml.getTextContents(cueElement);
     // In this regex, "\S" means "non-whitespace character".
-    const hasTextContent = /\S/.test(cueElement.textContent);
+    const hasTextContent = cueElement.children.length &&
+        textContent &&
+        /\S/.test(textContent);
+
     const hasTimeAttributes =
-        cueElement.hasAttribute('begin') ||
-        cueElement.hasAttribute('end') ||
-        cueElement.hasAttribute('dur');
+        cueElement.attributes['begin'] ||
+        cueElement.attributes['end'] ||
+        cueElement.attributes['dur'];
 
     if (!hasTimeAttributes && !hasTextContent && cueElement.tagName != 'br' &&
         nestedCues.length == 0) {
@@ -299,7 +300,7 @@ shaka.text.TtmlTextParser = class {
         // as some information could be held by its attributes.
         // <p /> won't, as it would not be displayed.
         return null;
-      } else if (localWhitespaceTrim) {
+      } else if (localCollapseMultipleSpaces) {
         // Disregards empty anonymous spans when (local) trim is true.
         return null;
       }
@@ -310,11 +311,12 @@ shaka.text.TtmlTextParser = class {
         cueElement, rateInfo);
     // Resolve local time relative to parent elements.  Time elements can appear
     // all the way up to 'body', but not 'tt'.
-    while (parentElement && parentElement.nodeType == Node.ELEMENT_NODE &&
+    while (parentElement && TXml.isNode(parentElement) &&
         parentElement.tagName != 'tt') {
       ({start, end} = shaka.text.TtmlTextParser.resolveTime_(
           parentElement, rateInfo, start, end));
-      parentElement = /** @type {Element} */(parentElement.parentNode);
+      parentElement =
+        /** @type {shaka.extern.xml.Node} */ (parentElement.parent);
     }
 
     if (start == null) {
@@ -357,10 +359,9 @@ shaka.text.TtmlTextParser = class {
     let payload = '';
     if (isLeafNode) {
       // If the childNodes are all text, this is a leaf node.  Get the payload.
-      payload = cueElement.textContent;
-      if (localWhitespaceTrim) {
-        // Trim leading and trailing whitespace.
-        payload = payload.trim();
+      payload = StringUtils.htmlUnescape(
+          shaka.util.TXml.getTextContents(cueElement) || '');
+      if (localCollapseMultipleSpaces) {
         // Collapse multiple spaces into one.
         payload = payload.replace(/\s+/g, ' ');
       }
@@ -386,16 +387,16 @@ shaka.text.TtmlTextParser = class {
     // Do not actually apply that region unless it is non-inherited, though.
     // This makes it so that, if a parent element has a region, the children
     // don't also all independently apply the positioning of that region.
-    if (cueElement.hasAttribute('region')) {
-      if (regionElement && regionElement.getAttribute('xml:id')) {
-        const regionId = regionElement.getAttribute('xml:id');
+    if (cueElement.attributes['region']) {
+      if (regionElement && regionElement.attributes['xml:id']) {
+        const regionId = regionElement.attributes['xml:id'];
         cue.region = cueRegions.filter((region) => region.id == regionId)[0];
       }
     }
 
     let regionElementForStyle = regionElement;
-    if (parentCueElement && isNested && !cueElement.getAttribute('region') &&
-      !cueElement.getAttribute('style')) {
+    if (parentCueElement && isNested && !cueElement.attributes['region'] &&
+      !cueElement.attributes['style']) {
       regionElementForStyle =
           shaka.text.TtmlTextParser.getElementsFromCollection_(
               parentCueElement, 'region', regionElements, /* prefix= */ '')[0];
@@ -405,7 +406,7 @@ shaka.text.TtmlTextParser = class {
         cue,
         cueElement,
         regionElementForStyle,
-        imageElement,
+        /** @type {!shaka.extern.xml.Node} */(imageElement),
         imageUri,
         styles,
         /** isNested= */ parentIsContent, // "nested in a <div>" doesn't count.
@@ -417,9 +418,9 @@ shaka.text.TtmlTextParser = class {
   /**
    * Parses an Element into a TextTrackCue or VTTCue.
    *
-   * @param {!Element} regionElement
-   * @param {!Array.<!Element>} styles Defined in the top of tt  element and
-   * used principally for images.
+   * @param {!shaka.extern.xml.Node} regionElement
+   * @param {!Array.<!shaka.extern.xml.Node>} styles
+   * Defined in the top of tt element and used principally for images.
    * @param {?string} globalExtent
    * @return {shaka.text.CueRegion}
    * @private
@@ -427,7 +428,7 @@ shaka.text.TtmlTextParser = class {
   static parseCueRegion_(regionElement, styles, globalExtent) {
     const TtmlTextParser = shaka.text.TtmlTextParser;
     const region = new shaka.text.CueRegion();
-    const id = regionElement.getAttribute('xml:id');
+    const id = regionElement.attributes['xml:id'];
     if (!id) {
       shaka.log.warning('TtmlTextParser parser encountered a region with ' +
                         'no id. Region will be ignored.');
@@ -511,11 +512,11 @@ shaka.text.TtmlTextParser = class {
    * Adds applicable style properties to a cue.
    *
    * @param {!shaka.text.Cue} cue
-   * @param {!Element} cueElement
-   * @param {Element} region
-   * @param {Element} imageElement
+   * @param {!shaka.extern.xml.Node} cueElement
+   * @param {shaka.extern.xml.Node} region
+   * @param {shaka.extern.xml.Node} imageElement
    * @param {?string} imageUri
-   * @param {!Array.<!Element>} styles
+   * @param {!Array.<!shaka.extern.xml.Node>} styles
    * @param {boolean} isNested
    * @param {boolean} isLeaf
    * @private
@@ -524,6 +525,7 @@ shaka.text.TtmlTextParser = class {
       cue, cueElement, region, imageElement, imageUri, styles,
       isNested, isLeaf) {
     const TtmlTextParser = shaka.text.TtmlTextParser;
+    const TXml = shaka.util.TXml;
     const Cue = shaka.text.Cue;
 
     // Styles should be inherited from regions, if a style property is not
@@ -681,10 +683,10 @@ shaka.text.TtmlTextParser = class {
       // in PR #1859, in April 2019, and first released in v2.5.0.
       // Now we check for both, although only imageType (camelCase) is to spec.
       const backgroundImageType =
-          imageElement.getAttribute('imageType') ||
-          imageElement.getAttribute('imagetype');
-      const backgroundImageEncoding = imageElement.getAttribute('encoding');
-      const backgroundImageData = imageElement.textContent.trim();
+          imageElement.attributes['imageType'] ||
+          imageElement.attributes['imagetype'];
+      const backgroundImageEncoding = imageElement.attributes['encoding'];
+      const backgroundImageData = (TXml.getTextContents(imageElement)).trim();
       if (backgroundImageType == 'PNG' &&
           backgroundImageEncoding == 'Base64' &&
           backgroundImageData) {
@@ -823,9 +825,9 @@ shaka.text.TtmlTextParser = class {
    * Finds a specified attribute on either the original cue element or its
    * associated region and returns the value if the attribute was found.
    *
-   * @param {!Element} cueElement
-   * @param {Element} region
-   * @param {!Array.<!Element>} styles
+   * @param {!shaka.extern.xml.Node} cueElement
+   * @param {shaka.extern.xml.Node} region
+   * @param {!Array.<!shaka.extern.xml.Node>} styles
    * @param {string} attribute
    * @param {boolean=} shouldInheritRegionStyles
    * @return {?string}
@@ -853,21 +855,21 @@ shaka.text.TtmlTextParser = class {
    * Finds a specified attribute on the element's associated region
    * and returns the value if the attribute was found.
    *
-   * @param {Element} region
-   * @param {!Array.<!Element>} styles
+   * @param {shaka.extern.xml.Node} region
+   * @param {!Array.<!shaka.extern.xml.Node>} styles
    * @param {string} attribute
    * @return {?string}
    * @private
    */
   static getStyleAttributeFromRegion_(region, styles, attribute) {
-    const XmlUtils = shaka.util.XmlUtils;
+    const TXml = shaka.util.TXml;
     const ttsNs = shaka.text.TtmlTextParser.styleNs_;
 
     if (!region) {
       return null;
     }
 
-    const attr = XmlUtils.getAttributeNSList(region, ttsNs, attribute);
+    const attr = TXml.getAttributeNSList(region, ttsNs, attribute);
     if (attr) {
       return attr;
     }
@@ -880,19 +882,19 @@ shaka.text.TtmlTextParser = class {
    * Finds a specified attribute on the cue element and returns the value
    * if the attribute was found.
    *
-   * @param {!Element} cueElement
-   * @param {!Array.<!Element>} styles
+   * @param {!shaka.extern.xml.Node} cueElement
+   * @param {!Array.<!shaka.extern.xml.Node>} styles
    * @param {string} attribute
    * @return {?string}
    * @private
    */
   static getStyleAttributeFromElement_(cueElement, styles, attribute) {
-    const XmlUtils = shaka.util.XmlUtils;
+    const TXml = shaka.util.TXml;
     const ttsNs = shaka.text.TtmlTextParser.styleNs_;
 
     // Styling on elements should take precedence
     // over the main styling attributes
-    const elementAttribute = XmlUtils.getAttributeNSList(
+    const elementAttribute = TXml.getAttributeNSList(
         cueElement,
         ttsNs,
         attribute);
@@ -908,14 +910,14 @@ shaka.text.TtmlTextParser = class {
    * Finds a specified attribute on an element's styles and the styles those
    * styles inherit from.
    *
-   * @param {!Element} element
-   * @param {!Array.<!Element>} styles
+   * @param {!shaka.extern.xml.Node} element
+   * @param {!Array.<!shaka.extern.xml.Node>} styles
    * @param {string} attribute
    * @return {?string}
    * @private
    */
   static getInheritedStyleAttribute_(element, styles, attribute) {
-    const XmlUtils = shaka.util.XmlUtils;
+    const TXml = shaka.util.TXml;
     const ttsNs = shaka.text.TtmlTextParser.styleNs_;
     const ebuttsNs = shaka.text.TtmlTextParser.styleEbuttsNs_;
 
@@ -928,14 +930,14 @@ shaka.text.TtmlTextParser = class {
     // The last value in our styles stack takes the precedence over the others
     for (let i = 0; i < inheritedStyles.length; i++) {
       // Check ebu namespace first.
-      let styleAttributeValue = XmlUtils.getAttributeNS(
+      let styleAttributeValue = TXml.getAttributeNS(
           inheritedStyles[i],
           ebuttsNs,
           attribute);
 
       if (!styleAttributeValue) {
         // Fall back to tts namespace.
-        styleAttributeValue = XmlUtils.getAttributeNSList(
+        styleAttributeValue = TXml.getAttributeNSList(
             inheritedStyles[i],
             ttsNs,
             attribute);
@@ -962,12 +964,12 @@ shaka.text.TtmlTextParser = class {
    * Selects items from |collection| whose id matches |attributeName|
    * from |element|.
    *
-   * @param {Element} element
+   * @param {shaka.extern.xml.Node} element
    * @param {string} attributeName
-   * @param {!Array.<Element>} collection
+   * @param {!Array.<shaka.extern.xml.Node>} collection
    * @param {string} prefixName
    * @param {string=} nsName
-   * @return {!Array.<!Element>}
+   * @return {!Array.<!shaka.extern.xml.Node>}
    * @private
    */
   static getElementsFromCollection_(
@@ -988,7 +990,7 @@ shaka.text.TtmlTextParser = class {
 
       for (const name of itemNames) {
         for (const item of collection) {
-          if ((prefixName + item.getAttribute('xml:id')) == name) {
+          if ((prefixName + item.attributes['xml:id']) == name) {
             items.push(item);
             break;
           }
@@ -1003,7 +1005,7 @@ shaka.text.TtmlTextParser = class {
   /**
    * Traverses upwards from a given node until a given attribute is found.
    *
-   * @param {!Element} element
+   * @param {!shaka.extern.xml.Node} element
    * @param {string} attributeName
    * @param {string=} nsName
    * @return {?string}
@@ -1011,19 +1013,19 @@ shaka.text.TtmlTextParser = class {
    */
   static getInheritedAttribute_(element, attributeName, nsName) {
     let ret = null;
-    const XmlUtils = shaka.util.XmlUtils;
-    while (element) {
+    const TXml = shaka.util.TXml;
+    while (!ret) {
       ret = nsName ?
-          XmlUtils.getAttributeNS(element, nsName, attributeName) :
-          element.getAttribute(attributeName);
+          TXml.getAttributeNS(element, nsName, attributeName) :
+          element.attributes[attributeName];
       if (ret) {
         break;
       }
 
       // Element.parentNode can lead to XMLDocument, which is not an Element and
       // has no getAttribute().
-      const parentNode = element.parentNode;
-      if (parentNode instanceof Element) {
+      const parentNode = element.parent;
+      if (parentNode) {
         element = parentNode;
       } else {
         break;
@@ -1036,7 +1038,7 @@ shaka.text.TtmlTextParser = class {
    * Factor parent/ancestor time attributes into the parsed time of a
    * child/descendent.
    *
-   * @param {!Element} parentElement
+   * @param {!shaka.extern.xml.Node} parentElement
    * @param {!shaka.text.TtmlTextParser.RateInfo_} rateInfo
    * @param {?number} start The child's start time
    * @param {?number} end The child's end time
@@ -1074,18 +1076,18 @@ shaka.text.TtmlTextParser = class {
   /**
    * Parse TTML time attributes from the given element.
    *
-   * @param {!Element} element
+   * @param {!shaka.extern.xml.Node} element
    * @param {!shaka.text.TtmlTextParser.RateInfo_} rateInfo
    * @return {{start: ?number, end: ?number}}
    * @private
    */
   static parseTime_(element, rateInfo) {
     const start = shaka.text.TtmlTextParser.parseTimeAttribute_(
-        element.getAttribute('begin'), rateInfo);
+        element.attributes['begin'], rateInfo);
     let end = shaka.text.TtmlTextParser.parseTimeAttribute_(
-        element.getAttribute('end'), rateInfo);
+        element.attributes['end'], rateInfo);
     const duration = shaka.text.TtmlTextParser.parseTimeAttribute_(
-        element.getAttribute('dur'), rateInfo);
+        element.attributes['dur'], rateInfo);
     if (end == null && duration != null) {
       end = start + duration;
     }

package/lib/text/ui_text_displayer.js

@@ -28,8 +28,9 @@ shaka.text.UITextDisplayer = class {
    * Constructor.
    * @param {HTMLMediaElement} video
    * @param {HTMLElement} videoContainer
+   * @param {shaka.extern.TextDisplayerConfiguration} config
    */
-  constructor(video, videoContainer) {
+  constructor(video, videoContainer, config) {
     goog.asserts.assert(videoContainer, 'videoContainer should be valid.');
 
     /** @private {boolean} */
@@ -64,16 +65,12 @@ shaka.text.UITextDisplayer = class {
 
     this.videoContainer_.appendChild(this.textContainer_);
 
-    /**
-     * The captions' update period in seconds.
-     * @private {number}
-     */
-    const updatePeriod = 0.25;
-
     /** @private {shaka.util.Timer} */
     this.captionsTimer_ = new shaka.util.Timer(() => {
-      this.updateCaptions_();
-    }).tickEvery(updatePeriod);
+      if (!this.video_.paused) {
+        this.updateCaptions_();
+      }
+    }).tickEvery(config.captionsUpdatePeriod);
 
     /**
      * Maps cues to cue elements. Specifically points out the wrapper element of
@@ -93,6 +90,10 @@ shaka.text.UITextDisplayer = class {
       this.updateCaptions_(/* forceUpdate= */ true);
     });
 
+    this.eventManager_.listen(this.video_, 'seeking', () => {
+      this.updateCaptions_(/* forceUpdate= */ true);
+    });
+
     // From: https://html.spec.whatwg.org/multipage/media.html#dom-video-videowidth
     // Whenever the natural width or natural height of the video changes
     // (including, for example, because the selected video track was changed),
@@ -124,6 +125,17 @@ shaka.text.UITextDisplayer = class {
   }
 
 
+  /**
+   * @override
+   * @export
+   */
+  configure(config) {
+    if (this.captionsTimer_) {
+      this.captionsTimer_.tickEvery(config.captionsUpdatePeriod);
+    }
+  }
+
+
   /**
    * @override
    * @export
@@ -339,6 +351,9 @@ shaka.text.UITextDisplayer = class {
         const cueRegistry = this.currentCuesMap_.get(cue);
         goog.asserts.assert(cueRegistry, 'cueRegistry should exist.');
         if (cueRegistry.regionElement) {
+          if (cueRegistry.regionElement.contains(container)) {
+            cueRegistry.regionElement.removeChild(container);
+          }
           container.appendChild(cueRegistry.regionElement);
           cueRegistry.regionElement.appendChild(cueRegistry.cueElement);
         } else {
@@ -373,8 +388,10 @@ shaka.text.UITextDisplayer = class {
     if (this.isTextVisible_) {
       // Log currently attached cue elements for verification, later.
       const previousCuesMap = new Map();
-      for (const cue of this.currentCuesMap_.keys()) {
-        previousCuesMap.set(cue, this.currentCuesMap_.get(cue));
+      if (goog.DEBUG) {
+        for (const cue of this.currentCuesMap_.keys()) {
+          previousCuesMap.set(cue, this.currentCuesMap_.get(cue));
+        }
       }
 
       // Update the cues.