Bug 1347673 - Visibility state of extra video control buttons should be recalculated each time the video controls are adjusted. r=jaws draft
authorRay Lin <ralin@mozilla.com>
Thu, 16 Mar 2017 18:19:56 +0800
changeset 502122 a38d18abcb4e52d23baa195b3495065a63a0fcda
parent 501879 5fe5dcf1c10a4523ba3f0a20295551462c2dae11
child 550068 53ff52b8160b386ee26b4681734cd987de60cdd1
push id50187
push userbmo:ralin@mozilla.com
push dateTue, 21 Mar 2017 09:10:00 +0000
reviewersjaws
bugs1347673
milestone55.0a1
Bug 1347673 - Visibility state of extra video control buttons should be recalculated each time the video controls are adjusted. r=jaws MozReview-Commit-ID: Lj7kttJ9skU
toolkit/content/tests/reftests/reftest.list
toolkit/content/tests/reftests/videocontrols-dynamically-add-cc-ref.html
toolkit/content/tests/reftests/videocontrols-dynamically-add-cc.html
toolkit/content/widgets/videocontrols.xml
--- a/toolkit/content/tests/reftests/reftest.list
+++ b/toolkit/content/tests/reftests/reftest.list
@@ -1,2 +1,3 @@
 random-if(cocoaWidget) == bug-442419-progressmeter-max.xul bug-442419-progressmeter-max-ref.xul # fails most of the time on Mac because progress meter animates
 != textbox-multiline-default-value.xul textbox-multiline-empty.xul
+== videocontrols-dynamically-add-cc.html videocontrols-dynamically-add-cc-ref.html
new file mode 100644
--- /dev/null
+++ b/toolkit/content/tests/reftests/videocontrols-dynamically-add-cc-ref.html
@@ -0,0 +1,40 @@
+<!DOCTYPE html>
+<html>
+<head>
+<style>
+  html, body {
+    margin: 0;
+    padding: 0;
+  }
+
+  video {
+    width: 320px;
+    height: 240px;
+  }
+
+  #mask {
+    position: absolute;
+    z-index: 3;
+    width: 320px;
+    height: 200px;
+    background-color: green;
+    top: 0;
+    left: 0;
+  }
+</style>
+<script>
+  function addCCToVid(videoElem) {
+    videoElem.addTextTrack("subtitles", "English", "en");
+  }
+</script>
+</head>
+<body>
+  <video id="vid" controls></video>
+  <div id="mask"></div>
+  <script>
+    var vid = document.getElementById("vid");
+    addCCToVid(vid);
+  </script>
+</body>
+</html>
+
new file mode 100644
--- /dev/null
+++ b/toolkit/content/tests/reftests/videocontrols-dynamically-add-cc.html
@@ -0,0 +1,52 @@
+<!DOCTYPE html>
+<html class="reftest-wait">
+<head>
+<style>
+  html, body {
+    margin: 0;
+    padding: 0;
+  }
+
+  video {
+    width: 320px;
+    height:240px;
+  }
+
+  #mask {
+    position: absolute;
+    z-index: 3;
+    width: 320px;
+    height: 200px;
+    background-color: green;
+    top: 0;
+    left: 0;
+  }
+</style>
+<script>
+  function addCCToVid(videoElem) {
+    videoElem.addTextTrack("subtitles", "English", "en");
+  }
+</script>
+</head>
+<body>
+  <video id="vid" controls></video>
+  <div id="mask"></div>
+  <script>
+    function doTest() {
+      var vid = document.getElementById("vid");
+
+      // Videocontrols binding's "addtrack" handler synchronously fires
+      // "adjustControlSize()" first, and then the layout is ready for
+      // the reftest snapshot.
+      vid.textTracks.addEventListener("addtrack", function() {
+        document.documentElement.removeAttribute("class");
+      });
+
+      addCCToVid(vid);
+    }
+
+    window.addEventListener("MozReftestInvalidate", doTest);
+  </script>
+</body>
+</html>
+
--- a/toolkit/content/widgets/videocontrols.xml
+++ b/toolkit/content/widgets/videocontrols.xml
@@ -1494,18 +1494,16 @@
 
       setClosedCaptionButtonState() {
         this.adjustControlSize();
 
         if (!this.isClosedCaptionAvailable) {
           return;
         }
 
-        this.closedCaptionButton.removeAttribute("hidden");
-
         if (this.isClosedCaptionOn()) {
           this.closedCaptionButton.setAttribute("enabled", "true");
         } else {
           this.closedCaptionButton.removeAttribute("enabled");
         }
 
         let ttItems = this.textTrackList.childNodes;
 
@@ -1705,25 +1703,19 @@
           this.fullscreenButton,
           this.closedCaptionButton,
           this.positionDurationBox,
           this.scrubberStack,
           this.durationSpan,
           this.volumeStack
         ];
 
-        if (this.controlBar.hasAttribute("fullscreen-unavailable")) {
-          this.fullscreenButton.isWanted = false;
-        }
-        if (!this.isClosedCaptionAvailable) {
-          this.closedCaptionButton.isWanted = false;
-        }
-        if (this.muteButton.hasAttribute("noAudio")) {
-          this.volumeStack.isWanted = false;
-        }
+        this.fullscreenButton.isWanted = !this.controlBar.hasAttribute("fullscreen-unavailable");
+        this.closedCaptionButton.isWanted = this.isClosedCaptionAvailable;
+        this.volumeStack.isWanted = !this.muteButton.hasAttribute("noAudio");
 
         let widthUsed = minControlBarPaddingWidth;
         let preventAppendControl = false;
 
         for (let control of prioritizedControls) {
           if (!control.isWanted) {
             control.hideByAdjustment = true;
             continue;