Bug 694696 - mute video if volume is set down to 0. r=jaws

2014-08-25 13:55:00 +02:00 · 2014-08-25 13:55:00 +02:00 · 3a9d52f299
--- a/toolkit/content/tests/widgets/audio.ogg
+++ b/toolkit/content/tests/widgets/audio.ogg
--- a/toolkit/content/tests/widgets/chrome.ini
+++ b/toolkit/content/tests/widgets/chrome.ini
@ -3,6 +3,7 @@ support-files =
  tree_shared.js
  popup_shared.js
  window_menubar.xul
+  seek_with_sound.ogg

 [test_contextmenu_nested.xul]
 [test_contextmenu_menugroup.xul]
@ -13,3 +14,5 @@ skip-if = os == 'mac'
 skip-if = os == 'android'
 [test_popupreflows.xul]
 [test_tree_column_reorder.xul]
+skip-if = toolkit == 'android'
+[test_videocontrols.html]
--- a/toolkit/content/tests/widgets/mochitest.ini
+++ b/toolkit/content/tests/widgets/mochitest.ini
@ -1,9 +1,9 @@
 [DEFAULT]
 skip-if = buildapp == 'mulet' || buildapp == 'b2g'
 support-files =
-  ../../../../content/media/test/audio.wav
-  ../../../../browser/base/content/test/general/audio.ogg
-  ../../../../content/media/test/seek_with_sound.ogg
+  audio.wav
+  audio.ogg
+  seek_with_sound.ogg
  head.js
  tree_shared.js
  videocontrols_direction-1-ref.html
@ -24,7 +24,6 @@ support-files =
 [test_audiocontrols_dimensions.html]
 skip-if = toolkit == 'android'
 [test_mousecapture_area.html]
-[test_videocontrols.html]
 skip-if = toolkit == 'android' #TIMED_OUT
 [test_videocontrols_audio.html]
 [test_videocontrols_audio_direction.html]
--- a/toolkit/content/tests/widgets/seek_with_sound.ogg
+++ b/toolkit/content/tests/widgets/seek_with_sound.ogg
--- a/toolkit/content/tests/widgets/test_videocontrols.html
+++ b/toolkit/content/tests/widgets/test_videocontrols.html
@ -2,9 +2,9 @@
 <html>
 <head>
  <title>Video controls test</title>
-  <script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script>
-  <script type="text/javascript" src="/tests/SimpleTest/EventUtils.js"></script>
-  <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css" />
+  <script type="text/javascript" src="chrome://mochikit/content/tests/SimpleTest/SimpleTest.js"></script>
+  <script type="text/javascript" src="chrome://mochikit/content/tests/SimpleTest/EventUtils.js"></script>
+  <link rel="stylesheet" type="text/css" href="chrome://mochikit/content/tests/SimpleTest/test.css" />
 </head>
 <body>
 <p id="display"></p>
@ -45,6 +45,22 @@ const muteButtonCenterY = videoHeight - Math.round(muteButtonHeight / 2);
 const scrubberOffsetX = 0 + playButtonWidth;
 const scrubberCenterY = videoHeight - Math.round(scrubberHeight / 2);

+var testnum = 1;
+var video = document.getElementById("video");
+
+function getButtonByAttribute(aName, aValue) {
+  var domUtil = Components.classes["@mozilla.org/inspector/dom-utils;1"]
+                          .getService(Components.interfaces.inIDOMUtils);
+  var kids = domUtil.getChildrenForNode(video, true);
+  var videocontrols = kids[1];
+  return document.getAnonymousElementByAttribute(videocontrols, aName, aValue);
+}
+
+function isMuteButtonMuted() {
+  var muteButton = getButtonByAttribute('class', 'muteButton');
+  return muteButton.getAttribute('muted') === 'true';
+}
+
 function runTest(event) {
  ok(true, "----- test #" + testnum + " -----");

@ -76,8 +92,7 @@ function runTest(event) {
      is(video.paused, true,  "checking video play state");
      is(video.muted, false,  "checking video mute state");

-      // Click the mute button
-      synthesizeMouse(video, muteButtonCenterX, muteButtonCenterY, { });
+      synthesizeMouse(video, muteButtonCenterX, muteButtonCenterY, { }); // Mute.
      break;

    case 4:
@ -85,8 +100,7 @@ function runTest(event) {
      is(video.paused, true,  "checking video play state");
      is(video.muted,  true,  "checking video mute state");

-      // Click the unmute button
-      synthesizeMouse(video, muteButtonCenterX, muteButtonCenterY, { });
+      synthesizeMouse(video, muteButtonCenterX, muteButtonCenterY, { }); // Unmute.
      break;

    /*
@ -201,6 +215,80 @@ function runTest(event) {
      lastPosition = (videoDuration / 2) - 0.1;
      ok(video.currentTime < lastPosition, "checking expected playback position");

+      // Set volume to 0.1 so one down arrow hit will decrease it to 0.
+      video.volume = 0.1;
+      break;
+
+    // See bug 694696.
+    case 16:
+      is(event.type, "volumechange", "checking event type");
+      is(video.volume, 0.1, "Volume should be set.");
+      ok(!video.muted, "Video is not muted.");
+
+      video.focus();
+      synthesizeKey("VK_DOWN", {});
+      break;
+
+    case 17:
+      is(event.type, "volumechange", "checking event type");
+      is(video.volume, 0, "Volume should be 0.");
+      ok(!video.muted, "Video is not muted.");
+      ok(isMuteButtonMuted(), "Mute button says it's muted");
+
+      synthesizeKey("VK_UP", {});
+      break;
+
+    case 18:
+      is(event.type, "volumechange", "checking event type");
+      is(video.volume, 0.1, "Volume is increased.");
+      ok(!video.muted, "Video is not muted.");
+      ok(!isMuteButtonMuted(), "Mute button says it's not muted");
+
+      synthesizeKey("VK_DOWN", {});
+      break;
+
+    case 19:
+      is(event.type, "volumechange", "checking event type");
+      is(video.volume, 0, "Volume should be 0.");
+      ok(!video.muted, "Video is not muted.");
+      ok(isMuteButtonMuted(), "Mute button says it's muted");
+
+      synthesizeMouse(video, muteButtonCenterX, muteButtonCenterY, { });
+      break;
+
+    case 20:
+      is(event.type, "volumechange", "checking event type");
+      is(video.volume, 0.5, "Volume should be 0.5.");
+      ok(!video.muted, "Video is not muted.");
+
+      synthesizeKey("VK_UP", {});
+      break;
+
+    case 21:
+      is(event.type, "volumechange", "checking event type");
+      is(video.volume, 0.6, "Volume should be 0.6.");
+      ok(!video.muted, "Video is not muted.");
+
+      synthesizeMouse(video, muteButtonCenterX, muteButtonCenterY, { });
+      break;
+
+    case 22:
+      is(event.type, "volumechange", "checking event type");
+      is(video.volume, 0.6, "Volume should be 0.6.");
+      ok(video.muted, "Video is muted.");
+
+      ok(isMuteButtonMuted(), "Mute button says it's muted");
+
+      synthesizeMouse(video, muteButtonCenterX, muteButtonCenterY, { });
+      break;
+
+    case 23:
+      is(event.type, "volumechange", "checking event type");
+      is(video.volume, 0.6, "Volume should be 0.6.");
+      ok(!video.muted, "Video is not muted.");
+
+      ok(!isMuteButtonMuted(), "Mute button says it's not muted");
+
      SimpleTest.finish();
      break;

@ -212,8 +300,6 @@ function runTest(event) {
 }


-var testnum = 1;
-var video = document.getElementById("video");

 function canplaythroughevent(event) {
  video.removeEventListener("canplaythrough",  canplaythroughevent, false);
--- a/toolkit/content/widgets/videocontrols.xml
+++ b/toolkit/content/widgets/videocontrols.xml
@ -409,7 +409,7 @@
                    this.videocontrols.randomID = this.randomID;

                    this.setPlayButtonState(this.video.paused);
-                    this.setMuteButtonState(this.video.muted);
+                    this.updateMuteButtonState();

                    this.setFullscreenButtonState();

@ -565,7 +565,7 @@
                        case "volumechange":
                            var volume = this.video.muted ? 0 : this.video.volume;
                            var volumePercentage = Math.round(volume * 100);
-                            this.setMuteButtonState(this.video.muted);
+                            this.updateMuteButtonState();
                            this.volumeControl.value = volumePercentage;
                            this.volumeForeground.style.paddingRight = (1 - volume) * this._volumeControlWidth + "px";
                            break;
@ -1040,7 +1040,10 @@
                    if (this.isVideoWithoutAudioTrack()) {
                        return;
                    }
-                    this.video.muted = !this.video.muted;
+                    this.video.muted = !this.isEffectivelyMuted();
+                    if (this.video.volume === 0) {
+                      this.video.volume = 0.5;
+                    }

                    // We'll handle style changes in the event listener for
                    // the "volumechange" event, same as if content script was
@ -1130,13 +1133,19 @@
                  this.playButton.setAttribute("aria-label", value);
                },

-                setMuteButtonState : function(aMuted) {
-                  if (aMuted)
+                isEffectivelyMuted : function() {
+                  return this.video.muted || !this.video.volume;
+                },
+
+                updateMuteButtonState : function() {
+                  var muted = this.isEffectivelyMuted();
+
+                  if (muted)
                      this.muteButton.setAttribute("muted", "true");
                  else
                      this.muteButton.removeAttribute("muted");

-                  var attrName = aMuted ? "unmutelabel" : "mutelabel";
+                  var attrName = muted ? "unmutelabel" : "mutelabel";
                  var value = this.muteButton.getAttribute(attrName);
                  this.muteButton.setAttribute("aria-label", value);
                },