Bug 937429 - Only resize the media element if isAudioOnly=true. r=dolske

2013-11-19 00:17:38 -05:00 · 2013-11-19 00:17:38 -05:00 · 6130644cf1
--- a/toolkit/content/tests/widgets/Makefile.in
+++ b/toolkit/content/tests/widgets/Makefile.in
@ -5,12 +5,13 @@

 MOCHITEST_FILES =	\
 		tree_shared.js \
+		test_audiocontrols_dimensions.html \
 		test_mousecapture_area.html \
 		test_videocontrols.html \
 		test_videocontrols_audio.html \
-		test_videocontrols_video_direction.html \
 		test_videocontrols_audio_direction.html \
-		test_audiocontrols_dimensions.html \
+		test_videocontrols_standalone.html \
+		test_videocontrols_video_direction.html \
 		videocontrols_direction-1-ref.html \
 		videocontrols_direction-1a.html \
 		videocontrols_direction-1b.html \
--- a/toolkit/content/tests/widgets/test_videocontrols_standalone.html
+++ b/toolkit/content/tests/widgets/test_videocontrols_standalone.html
@ -0,0 +1,75 @@
+<!DOCTYPE HTML>
+<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" />
+</head>
+<body>
+<p id="display"></p>
+
+<pre id="test">
+<script class="testbody" type="text/javascript">
+
+const videoWidth = 320;
+const videoHeight = 240;
+
+function getMediaElement(aWindow) {
+  return aWindow.document.getElementsByTagName("video")[0];
+}
+
+var popup = window.open("seek_with_sound.ogg");
+popup.addEventListener("load", function onLoad() {
+  popup.removeEventListener("load", onLoad);
+  var video = getMediaElement(popup);
+  if (video.readyState >= video.HAVE_METADATA)
+    runTestVideo(video);
+  else {
+    video.addEventListener("loadedmetadata", function onLoadedMetaData() {
+      video.removeEventListener("loadedmetadata", onLoadedMetaData);
+      runTestVideo(video);
+    });
+  }
+});
+
+function runTestVideo(aVideo) {
+  var boundingRect = aVideo.getBoundingClientRect();
+  is(boundingRect.width, videoWidth, "Width of the video should match expectation");
+  is(boundingRect.height, videoHeight, "Height of video should match expectation");
+  popup.close();
+  runTestAudioPre();
+}
+
+function runTestAudioPre() {
+  popup = window.open("audio.ogg");
+  popup.addEventListener("load", function onLoad() {
+    popup.removeEventListener("load", onLoad);
+    var audio = getMediaElement(popup);
+    if (audio.readyState >= audio.HAVE_METADATA)
+      runTestAudio(audio);
+    else {
+      audio.addEventListener("loadedmetadata", function onLoadedMetaData() {
+        audio.removeEventListener("loadedmetadata", onLoadedMetaData);
+        runTestAudio(audio);
+      })
+    }
+  })
+}
+
+function runTestAudio(aAudio) {
+  var boundingRect = aAudio.getBoundingClientRect();
+  var isAndroid = (navigator.userAgent.indexOf("Android") !== -1);
+  var expectedHeight = isAndroid ? 123 : 28;
+  is(boundingRect.height, expectedHeight,
+     "Height of audio element should be " + expectedHeight + ", which is equal to the controls bar.");
+  popup.close();
+  SimpleTest.finish();
+}
+
+SimpleTest.waitForExplicitFinish();
+
+</script>
+</pre>
+</body>
+</html>
--- a/toolkit/content/widgets/videocontrols.xml
+++ b/toolkit/content/widgets/videocontrols.xml
@ -344,8 +344,13 @@
                    this._isAudioOnly = val;
                    if (!this.isTopLevelSyntheticDocument)
                        return;
-                    this.video.style.height = this._controlBarHeight + "px";
-                    this.video.style.width = "66%";
+                    if (this._isAudioOnly) {
+                        this.video.style.height = this._controlBarHeight + "px";
+                        this.video.style.width = "66%";
+                    } else {
+                        this.video.style.removeProperty("height");
+                        this.video.style.removeProperty("width");
+                    }
                },
                suppressError : false,