Bug 716575 (4/4) - Tests for GetViewportInfo [r=dbaron]
authorMatt Brubeck <mbrubeck@mozilla.com>
Mon, 10 Sep 2012 18:53:24 -0700
changeset 107889 9108fa673bfee54a3611fd0c261134c51160b0d8
parent 107888 39803b4c2b9d0bf3011379ec6079b2cf5878af27
child 107890 f753afbe0d85e49e52be57c6269c03ce3e30f51f
push id82
push usershu@rfrn.org
push dateFri, 05 Oct 2012 13:20:22 +0000
reviewersdbaron
bugs716575
milestone18.0a1
Bug 716575 (4/4) - Tests for GetViewportInfo [r=dbaron]
content/base/test/Makefile.in
content/base/test/test_meta_viewport0.html
content/base/test/test_meta_viewport1.html
content/base/test/test_meta_viewport2.html
content/base/test/test_meta_viewport3.html
content/base/test/test_meta_viewport4.html
content/base/test/test_meta_viewport5.html
content/base/test/test_meta_viewport6.html
--- a/content/base/test/Makefile.in
+++ b/content/base/test/Makefile.in
@@ -245,16 +245,23 @@ MOCHITEST_FILES_A = \
 		test_CrossSiteXHR_cache.html \
 		file_CrossSiteXHR_cache_server.sjs \
 		test_XHRDocURI.html \
 		file_XHRDocURI.xml \
 		file_XHRDocURI.xml^headers^ \
 		file_XHRDocURI.text \
 		file_XHRDocURI.text^headers^ \
 		test_DOMException.html \
+		test_meta_viewport0.html \
+		test_meta_viewport1.html \
+		test_meta_viewport2.html \
+		test_meta_viewport3.html \
+		test_meta_viewport4.html \
+		test_meta_viewport5.html \
+		test_meta_viewport6.html \
 		test_mutationobservers.html \
 		mutationobserver_dialog.html \
 		test_bug744830.html \
 		file_bug782342.txt \
 		test_bug782342.html \
 		$(NULL)
 
 MOCHITEST_FILES_B = \
new file mode 100644
--- /dev/null
+++ b/content/base/test/test_meta_viewport0.html
@@ -0,0 +1,76 @@
+<!DOCTYPE HTML>
+<html>
+<head>
+  <meta charset="utf-8">
+  <title>meta viewport test</title>
+  <script type="application/javascript" src="/tests/SimpleTest/SimpleTest.js"></script>
+  <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/>
+</head>
+<body>
+  <p>No &lt;meta name="viewport"&gt; tag</p>
+  <script type="application/javascript;version=1.7">
+    "use strict";
+
+    SimpleTest.waitForExplicitFinish();
+
+    let tests = [];
+
+    tests.push(function test1() {
+      SpecialPowers.pushPrefEnv({"set": [["browser.viewport.scaleRatio", 100]]},
+        function() {
+          let info = getViewportInfo(800, 480);
+          is(info.defaultZoom, 0,       "initial scale is unspecified");
+          is(info.minZoom,     0,       "minumum scale defaults to the absolute minumum");
+          is(info.maxZoom,     10,      "maximum scale defaults to the absolute maximum");
+          is(info.width,       980,     "width is the default width");
+          is(info.height,      588,     "height is proportional to displayHeight");
+          is(info.autoSize,    false,   "autoSize is disabled by default");
+          is(info.allowZoom,   true,    "zooming is enabled by default");
+
+          info = getViewportInfo(490, 600);
+          is(info.width,       980,     "width is still the default width");
+          is(info.height,      1200,    "height is proportional to the new displayHeight");
+
+          nextTest();
+        });
+    });
+
+    tests.push(function test2() {
+      SpecialPowers.pushPrefEnv({"set": [["browser.viewport.scaleRatio", 150]]},
+        function() {
+          let info = getViewportInfo(800, 480);
+          is(info.width,       980,     "width is still the default width");
+          is(info.height,      588,     "height is still proportional to displayHeight");
+
+          nextTest();
+        });
+    });
+
+    function getViewportInfo(aDisplayWidth, aDisplayHeight) {
+      let defaultZoom = {}, allowZoom = {}, minZoom = {}, maxZoom = {},
+          width = {}, height = {}, autoSize = {};
+
+      let cwu = SpecialPowers.getDOMWindowUtils(window);
+      cwu.getViewportInfo(aDisplayWidth, aDisplayHeight, defaultZoom, allowZoom,
+                          minZoom, maxZoom, width, height, autoSize);
+      return {
+        defaultZoom: defaultZoom.value,
+        minZoom: minZoom.value,
+        maxZoom: maxZoom.value,
+        width: width.value,
+        height: height.value,
+        autoSize: autoSize.value,
+        allowZoom: allowZoom.value
+      };
+    }
+
+    function nextTest() {
+      if (tests.length)
+        (tests.shift())();
+      else
+        SimpleTest.finish();
+    }
+    addEventListener("load", nextTest);
+  </script>
+</body>
+</html>
new file mode 100644
--- /dev/null
+++ b/content/base/test/test_meta_viewport1.html
@@ -0,0 +1,76 @@
+<!DOCTYPE HTML>
+<html>
+<head>
+  <meta charset="utf-8">
+  <title>meta viewport test</title>
+  <script type="application/javascript" src="/tests/SimpleTest/SimpleTest.js"></script>
+  <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/>
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+</head>
+<body>
+  <p>width=device-width, initial-scale=1</p>
+  <script type="application/javascript;version=1.7">
+    "use strict";
+
+    SimpleTest.waitForExplicitFinish();
+
+    let tests = [];
+
+    tests.push(function test1() {
+      SpecialPowers.pushPrefEnv({"set": [["browser.viewport.scaleRatio", 100]]},
+        function() {
+          let info = getViewportInfo(800, 480);
+          is(info.defaultZoom, 1,    "initial zoom is 100%");
+          is(info.width,       800,  "width is the same as the displayWidth");
+          is(info.height,      480,  "height is the same as the displayHeight");
+          is(info.autoSize,    true, "width=device-width enables autoSize");
+          is(info.allowZoom,   true, "zooming is enabled by default");
+
+          info = getViewportInfo(900, 600);
+          is(info.width,       900,  "changing the displayWidth changes the width");
+          is(info.height,      600,  "changing the displayHeight changes the height");
+
+          nextTest();
+        });
+    });
+
+    tests.push(function test2() {
+      SpecialPowers.pushPrefEnv({"set": [["browser.viewport.scaleRatio", 150]]},
+        function() {
+          let info = getViewportInfo(900, 600);
+          is(info.defaultZoom, 1.5,  "initial zoom is 150%");
+          is(info.width,       600,  "width equals displayWidth/1.5");
+          is(info.height,      400,  "height equals displayHeight/1.5");
+
+          nextTest();
+        });
+    });
+
+    function getViewportInfo(aDisplayWidth, aDisplayHeight) {
+      let defaultZoom = {}, allowZoom = {}, minZoom = {}, maxZoom = {},
+          width = {}, height = {}, autoSize = {};
+
+      let cwu = SpecialPowers.getDOMWindowUtils(window);
+      cwu.getViewportInfo(aDisplayWidth, aDisplayHeight, defaultZoom, allowZoom,
+                          minZoom, maxZoom, width, height, autoSize);
+      return {
+        defaultZoom: defaultZoom.value,
+        minZoom: minZoom.value,
+        maxZoom: maxZoom.value,
+        width: width.value,
+        height: height.value,
+        autoSize: autoSize.value,
+        allowZoom: allowZoom.value
+      };
+    }
+
+    function nextTest() {
+      if (tests.length)
+        (tests.shift())();
+      else
+        SimpleTest.finish();
+    }
+    addEventListener("load", nextTest);
+  </script>
+</body>
+</html>
new file mode 100644
--- /dev/null
+++ b/content/base/test/test_meta_viewport2.html
@@ -0,0 +1,76 @@
+<!DOCTYPE HTML>
+<html>
+<head>
+  <meta charset="utf-8">
+  <title>meta viewport test</title>
+  <script type="application/javascript" src="/tests/SimpleTest/SimpleTest.js"></script>
+  <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/>
+  <meta name="viewport" content="width=device-width">
+</head>
+<body>
+  <p>width=device-width</p>
+  <script type="application/javascript;version=1.7">
+    "use strict";
+
+    SimpleTest.waitForExplicitFinish();
+
+    let tests = [];
+
+    tests.push(function test1() {
+      SpecialPowers.pushPrefEnv({"set": [["browser.viewport.scaleRatio", 100]]},
+        function() {
+          let info = getViewportInfo(800, 480);
+          is(info.defaultZoom, 1,    "initial zoom is 100%");
+          is(info.width,       800,  "width is the same as the displayWidth");
+          is(info.height,      480,  "height is the same as the displayHeight");
+          is(info.autoSize,    true, "width=device-width enables autoSize");
+          is(info.allowZoom,   true, "zooming is enabled by default");
+
+          info = getViewportInfo(900, 600);
+          is(info.width,       900,  "changing the displayWidth changes the width");
+          is(info.height,      600,  "changing the displayHeight changes the height");
+
+          nextTest();
+        });
+    });
+
+    tests.push(function test2() {
+      SpecialPowers.pushPrefEnv({"set": [["browser.viewport.scaleRatio", 150]]},
+        function() {
+          let info = getViewportInfo(900, 600);
+          is(info.defaultZoom, 1.5,  "initial zoom is 150%");
+          is(info.width,       600,  "width equals displayWidth/1.5");
+          is(info.height,      400,  "height equals displayHeight/1.5");
+
+          nextTest();
+        });
+    });
+
+    function getViewportInfo(aDisplayWidth, aDisplayHeight) {
+      let defaultZoom = {}, allowZoom = {}, minZoom = {}, maxZoom = {},
+          width = {}, height = {}, autoSize = {};
+
+      let cwu = SpecialPowers.getDOMWindowUtils(window);
+      cwu.getViewportInfo(aDisplayWidth, aDisplayHeight, defaultZoom, allowZoom,
+                          minZoom, maxZoom, width, height, autoSize);
+      return {
+        defaultZoom: defaultZoom.value,
+        minZoom: minZoom.value,
+        maxZoom: maxZoom.value,
+        width: width.value,
+        height: height.value,
+        autoSize: autoSize.value,
+        allowZoom: allowZoom.value
+      };
+    }
+
+    function nextTest() {
+      if (tests.length)
+        (tests.shift())();
+      else
+        SimpleTest.finish();
+    }
+    addEventListener("load", nextTest);
+  </script>
+</body>
+</html>
new file mode 100644
--- /dev/null
+++ b/content/base/test/test_meta_viewport3.html
@@ -0,0 +1,78 @@
+<!DOCTYPE HTML>
+<html>
+<head>
+  <meta charset="utf-8">
+  <title>meta viewport test</title>
+  <script type="application/javascript" src="/tests/SimpleTest/SimpleTest.js"></script>
+  <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/>
+  <meta name="viewport" content="width=320">
+</head>
+<body>
+  <p>width=320</p>
+  <script type="application/javascript;version=1.7">
+    "use strict";
+
+    SimpleTest.waitForExplicitFinish();
+
+    let tests = [];
+
+    tests.push(function test1() {
+      SpecialPowers.pushPrefEnv({"set": [["browser.viewport.scaleRatio", 100]]},
+        function() {
+          let info = getViewportInfo(800, 480);
+          is(info.defaultZoom, 2.5,   "initial zoom fits the displayWidth");
+          is(info.width,       320,   "width is set explicitly");
+          is(info.height,      223,   "height is at the absolute minimum");
+          is(info.autoSize,    false, "width=device-width enables autoSize");
+          is(info.allowZoom,   true,  "zooming is enabled by default");
+
+          info = getViewportInfo(480, 800);
+          is(info.defaultZoom, 1.5,   "initial zoom fits the new displayWidth");
+          is(info.width,       320,   "explicit width is unchanged");
+          is(info.height,      533,   "height changes proportional to displayHeight");
+
+          nextTest();
+        });
+    });
+
+    tests.push(function test2() {
+      SpecialPowers.pushPrefEnv({"set": [["browser.viewport.scaleRatio", 150]]},
+        function() {
+          // With an explicit width in CSS px, the scaleRatio has no effect.
+          let info = getViewportInfo(800, 480);
+          is(info.defaultZoom, 2.5,   "initial zoom still fits the displayWidth");
+          is(info.width,       320,   "width is still set explicitly");
+          is(info.height,      223,   "height is still minimum height");
+
+          nextTest();
+        });
+    });
+
+    function getViewportInfo(aDisplayWidth, aDisplayHeight) {
+      let defaultZoom = {}, allowZoom = {}, minZoom = {}, maxZoom = {},
+          width = {}, height = {}, autoSize = {};
+
+      let cwu = SpecialPowers.getDOMWindowUtils(window);
+      cwu.getViewportInfo(aDisplayWidth, aDisplayHeight, defaultZoom, allowZoom,
+                          minZoom, maxZoom, width, height, autoSize);
+      return {
+        defaultZoom: defaultZoom.value,
+        minZoom: minZoom.value,
+        maxZoom: maxZoom.value,
+        width: width.value,
+        height: height.value,
+        autoSize: autoSize.value,
+        allowZoom: allowZoom.value
+      };
+    }
+
+    function nextTest() {
+      if (tests.length)
+        (tests.shift())();
+      else
+        SimpleTest.finish();
+    }
+    addEventListener("load", nextTest);
+  </script>
+</body>
+</html>
new file mode 100644
--- /dev/null
+++ b/content/base/test/test_meta_viewport4.html
@@ -0,0 +1,77 @@
+<!DOCTYPE HTML>
+<html>
+<head>
+  <meta charset="utf-8">
+  <title>meta viewport test</title>
+  <script type="application/javascript" src="/tests/SimpleTest/SimpleTest.js"></script>
+  <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/>
+  <meta name="viewport" content="initial-scale=1.0, user-scalable=no">
+</head>
+<body>
+  <p>initial-scale=1.0, user-scalable=no</p>
+  <script type="application/javascript;version=1.7">
+    "use strict";
+
+    SimpleTest.waitForExplicitFinish();
+
+    let tests = [];
+
+    tests.push(function test1() {
+      SpecialPowers.pushPrefEnv({"set": [["browser.viewport.scaleRatio", 100]]},
+        function() {
+          let info = getViewportInfo(800, 480);
+          is(info.defaultZoom, 1,     "initial zoom is set explicitly");
+          is(info.width,       800,   "width fits the initial zoom level");
+          is(info.height,      480,   "height fits the initial zoom level");
+          is(info.autoSize,    true,  "initial-scale=1 enables autoSize");
+          is(info.allowZoom,   false, "zooming is explicitly disabled");
+
+          info = getViewportInfo(480, 800);
+          is(info.defaultZoom, 1,     "initial zoom is still set explicitly");
+          is(info.width,       480,   "width changes to match the displayWidth");
+          is(info.height,      800,   "height changes to match the displayHeight");
+
+          nextTest();
+        });
+    });
+
+    tests.push(function test2() {
+      SpecialPowers.pushPrefEnv({"set": [["browser.viewport.scaleRatio", 150]]},
+        function() {
+          let info = getViewportInfo(800, 480);
+          is(info.defaultZoom, 1.5,   "initial zoom is adjusted for device pixel ratio");
+          is(info.width,       533,   "width fits the initial zoom");
+          is(info.height,      320,   "height fits the initial zoom");
+
+          nextTest();
+        });
+    });
+
+    function getViewportInfo(aDisplayWidth, aDisplayHeight) {
+      let defaultZoom = {}, allowZoom = {}, minZoom = {}, maxZoom = {},
+          width = {}, height = {}, autoSize = {};
+
+      let cwu = SpecialPowers.getDOMWindowUtils(window);
+      cwu.getViewportInfo(aDisplayWidth, aDisplayHeight, defaultZoom, allowZoom,
+                          minZoom, maxZoom, width, height, autoSize);
+      return {
+        defaultZoom: defaultZoom.value,
+        minZoom: minZoom.value,
+        maxZoom: maxZoom.value,
+        width: width.value,
+        height: height.value,
+        autoSize: autoSize.value,
+        allowZoom: allowZoom.value
+      };
+    }
+
+    function nextTest() {
+      if (tests.length)
+        (tests.shift())();
+      else
+        SimpleTest.finish();
+    }
+    addEventListener("load", nextTest);
+  </script>
+</body>
+</html>
new file mode 100644
--- /dev/null
+++ b/content/base/test/test_meta_viewport5.html
@@ -0,0 +1,53 @@
+<!DOCTYPE HTML>
+<html>
+<head>
+  <meta charset="utf-8">
+  <title>meta viewport test</title>
+  <script type="application/javascript" src="/tests/SimpleTest/SimpleTest.js"></script>
+  <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/>
+  <meta name="viewport" content="user-scalable=NO">
+</head>
+<body>
+  <p>user-scalable=NO</p>
+  <script type="application/javascript;version=1.7">
+    "use strict";
+
+    SimpleTest.waitForExplicitFinish();
+
+    let tests = [];
+
+    tests.push(function test1() {
+      let info = getViewportInfo(800, 480);
+      is(info.allowZoom, true, "user-scalable values are case-sensitive; 'NO' is not valid");
+
+      nextTest();
+    });
+
+    function getViewportInfo(aDisplayWidth, aDisplayHeight) {
+      let defaultZoom = {}, allowZoom = {}, minZoom = {}, maxZoom = {},
+          width = {}, height = {}, autoSize = {};
+
+      let cwu = SpecialPowers.getDOMWindowUtils(window);
+      cwu.getViewportInfo(aDisplayWidth, aDisplayHeight, defaultZoom, allowZoom,
+                          minZoom, maxZoom, width, height, autoSize);
+      return {
+        defaultZoom: defaultZoom.value,
+        minZoom: minZoom.value,
+        maxZoom: maxZoom.value,
+        width: width.value,
+        height: height.value,
+        autoSize: autoSize.value,
+        allowZoom: allowZoom.value
+      };
+    }
+
+    function nextTest() {
+      if (tests.length)
+        (tests.shift())();
+      else
+        SimpleTest.finish();
+    }
+    addEventListener("load", nextTest);
+  </script>
+</body>
+</html>
new file mode 100644
--- /dev/null
+++ b/content/base/test/test_meta_viewport6.html
@@ -0,0 +1,82 @@
+<!DOCTYPE HTML>
+<html>
+<head>
+  <meta charset="utf-8">
+  <title>meta viewport test</title>
+  <script type="application/javascript" src="/tests/SimpleTest/SimpleTest.js"></script>
+  <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/>
+  <meta name="viewport" content="width=2000, minimum-scale=0.75">
+</head>
+<body>
+  <p>width=2000, minimum-scale=0.75</p>
+  <script type="application/javascript;version=1.7">
+    "use strict";
+
+    SimpleTest.waitForExplicitFinish();
+
+    let tests = [];
+
+    tests.push(function test1() {
+      SpecialPowers.pushPrefEnv({"set": [["browser.viewport.scaleRatio", 100]]},
+        function() {
+          let info = getViewportInfo(800, 480);
+          is(info.minZoom,     0.75,    "minumum scale is set explicitly");
+          is(info.defaultZoom, 0.75,    "initial scale is bounded by the minimum scale");
+          is(info.maxZoom,     10,      "maximum scale defaults to the absolute maximum");
+          is(info.width,       2000,    "width is set explicitly");
+          is(info.height,      1200,    "height is proportional to displayHeight");
+          is(info.autoSize,    false,   "autoSize is disabled by default");
+          is(info.allowZoom,   true,    "zooming is enabled by default");
+
+          info = getViewportInfo(2000, 1000);
+          is(info.minZoom,     0.75,    "minumum scale is still set explicitly");
+          is(info.defaultZoom, 1,       "initial scale fits the width");
+          is(info.width,       2000,    "width is set explicitly");
+          is(info.height,      1000,    "height is proportional to the new displayHeight");
+
+          nextTest();
+        });
+    });
+
+    tests.push(function test2() {
+      SpecialPowers.pushPrefEnv({"set": [["browser.viewport.scaleRatio", 150]]},
+        function() {
+          let info = getViewportInfo(800, 480);
+          is(info.minZoom,     1.125,   "minumum scale is converted to device pixel scale");
+          is(info.defaultZoom, 1.125,   "initial scale is bounded by the minimum scale");
+          is(info.maxZoom,     15,      "maximum scale defaults to the absolute maximum");
+          is(info.width,       2000,    "width is still set explicitly");
+          is(info.height,      1200,    "height is still proportional to displayHeight");
+
+          nextTest();
+        });
+    });
+
+    function getViewportInfo(aDisplayWidth, aDisplayHeight) {
+      let defaultZoom = {}, allowZoom = {}, minZoom = {}, maxZoom = {},
+          width = {}, height = {}, autoSize = {};
+
+      let cwu = SpecialPowers.getDOMWindowUtils(window);
+      cwu.getViewportInfo(aDisplayWidth, aDisplayHeight, defaultZoom, allowZoom,
+                          minZoom, maxZoom, width, height, autoSize);
+      return {
+        defaultZoom: defaultZoom.value,
+        minZoom: minZoom.value,
+        maxZoom: maxZoom.value,
+        width: width.value,
+        height: height.value,
+        autoSize: autoSize.value,
+        allowZoom: allowZoom.value
+      };
+    }
+
+    function nextTest() {
+      if (tests.length)
+        (tests.shift())();
+      else
+        SimpleTest.finish();
+    }
+    addEventListener("load", nextTest);
+  </script>
+</body>
+</html>