Bug 1543828 - Use <bdi> inside video controls content. r=Gijs a=pascalc
authorBrian Grinstead <bgrinstead@mozilla.com>
Sun, 21 Apr 2019 03:07:49 +0300
changeset 526262 6cd36394e2aeaea04ad1978e7131ac86da02f1f1
parent 526261 a3857b3191a4c9b4676ab5ff603e09c39546c23a
child 526263 2d12891a1a5493bac5886af3ede2db14b30a1ee6
push id2032
push userffxbld-merge
push dateMon, 13 May 2019 09:36:57 +0000
treeherdermozilla-release@455c1065dcbe [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersGijs, pascalc
bugs1543828
milestone67.0
Bug 1543828 - Use <bdi> inside video controls content. r=Gijs a=pascalc Reviewers: Gijs Reviewed By: Gijs Subscribers: Kwan Bug #: 1543828 Differential Revision: https://phabricator.services.mozilla.com/D27757
toolkit/content/widgets/videocontrols.js
--- a/toolkit/content/widgets/videocontrols.js
+++ b/toolkit/content/widgets/videocontrols.js
@@ -2229,27 +2229,27 @@ this.VideoControlsImplWidget = class {
       <!ENTITY % videocontrolsDTD SYSTEM "chrome://global/locale/videocontrols.dtd">
       %videocontrolsDTD;
       ]>
       <div class="videocontrols" xmlns="http://www.w3.org/1999/xhtml" role="none">
         <link rel="stylesheet" type="text/css" href="chrome://global/skin/media/videocontrols.css" />
         <div id="controlsContainer" class="controlsContainer" role="none">
           <div id="statusOverlay" class="statusOverlay stackItem" hidden="true">
             <div id="statusIcon" class="statusIcon"></div>
-            <span class="statusLabel" id="errorAborted">&error.aborted;</span>
-            <span class="statusLabel" id="errorNetwork">&error.network;</span>
-            <span class="statusLabel" id="errorDecode">&error.decode;</span>
-            <span class="statusLabel" id="errorSrcNotSupported">&error.srcNotSupported;</span>
-            <span class="statusLabel" id="errorNoSource">&error.noSource2;</span>
-            <span class="statusLabel" id="errorGeneric">&error.generic;</span>
+            <bdi class="statusLabel" id="errorAborted">&error.aborted;</bdi>
+            <bdi class="statusLabel" id="errorNetwork">&error.network;</bdi>
+            <bdi class="statusLabel" id="errorDecode">&error.decode;</bdi>
+            <bdi class="statusLabel" id="errorSrcNotSupported">&error.srcNotSupported;</bdi>
+            <bdi class="statusLabel" id="errorNoSource">&error.noSource2;</bdi>
+            <bdi class="statusLabel" id="errorGeneric">&error.generic;</bdi>
           </div>
 
           <div id="pictureInPictureOverlay" class="pictureInPictureOverlay stackItem" status="pictureInPicture" hidden="true">
             <div class="statusIcon" type="pictureInPicture"></div>
-            <span class="statusLabel" id="pictureInPicture">&status.pictureInPicture;</span>
+            <bdi class="statusLabel" id="pictureInPicture">&status.pictureInPicture;</bdi>
           </div>
 
           <div id="controlsOverlay" class="controlsOverlay stackItem" role="none">
             <div class="controlsSpacerStack">
               <div id="controlsSpacer" class="controlsSpacer stackItem" role="none"></div>
               <div id="clickToPlay" class="clickToPlay" hidden="true"></div>
             </div>
 
@@ -2263,21 +2263,21 @@ this.VideoControlsImplWidget = class {
                 <div class="progressBackgroundBar stackItem" role="none">
                   <div class="progressStack" role="none">
                     <progress id="bufferBar" class="bufferBar" value="0" max="100" tabindex="-1"></progress>
                     <progress id="progressBar" class="progressBar" value="0" max="100" tabindex="-1"></progress>
                   </div>
                 </div>
                 <input type="range" id="scrubber" class="scrubber" tabindex="-1"/>
               </div>
-              <span id="positionLabel" class="positionLabel" role="presentation"></span>
-              <span id="durationLabel" class="durationLabel" role="presentation"></span>
-              <span id="positionDurationBox" class="positionDurationBox" aria-hidden="true">
+              <bdi id="positionLabel" class="positionLabel" role="presentation"></bdi>
+              <bdi id="durationLabel" class="durationLabel" role="presentation"></bdi>
+              <bdi id="positionDurationBox" class="positionDurationBox" aria-hidden="true">
                 &positionAndDuration.nameFormat;
-              </span>
+              </bdi>
               <div id="controlBarSpacer" class="controlBarSpacer" hidden="true" role="none"></div>
               <button id="muteButton"
                       class="button muteButton"
                       mutelabel="&muteButton.muteLabel;"
                       unmutelabel="&muteButton.unmuteLabel;"
                       tabindex="-1"/>
               <div id="volumeStack" class="volumeStack progressContainer" role="none">
                 <input type="range" id="volumeControl" class="volumeControl" min="0" max="100" step="1" tabindex="-1"
@@ -2496,16 +2496,16 @@ this.NoControlsPictureInPictureImplWidge
       <!ENTITY % videocontrolsDTD SYSTEM "chrome://global/locale/videocontrols.dtd">
       %videocontrolsDTD;
       ]>
       <div class="videocontrols" xmlns="http://www.w3.org/1999/xhtml" role="none">
         <link rel="stylesheet" type="text/css" href="chrome://global/skin/media/videocontrols.css" />
         <div id="controlsContainer" class="controlsContainer" role="none">
           <div class="pictureInPictureOverlay stackItem" status="pictureInPicture">
             <div id="statusIcon" class="statusIcon" type="pictureInPicture"></div>
-            <span class="statusLabel" id="pictureInPicture">&status.pictureInPicture;</span>
+            <bdi class="statusLabel" id="pictureInPicture">&status.pictureInPicture;</bdi>
           </div>
           <div class="controlsOverlay stackItem"></div>
         </div>
       </div>`, "application/xml");
     this.shadowRoot.importNodeAndAppendChildAt(this.shadowRoot, parserDoc.documentElement, true);
   }
 };