Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(187)

Unified Diff: LayoutTests/css3/device-adapt/opera/constrain-004.html

Issue 16103004: [css-device-adapt] Imported opera tests from hg.csswg.org (Closed) Base URL: https://chromium.googlesource.com/chromium/blink.git@master
Patch Set: Imported snapshot where device-width/height is no longer supported Created 7 years, 7 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View side-by-side diff with in-line comments
Download patch
Index: LayoutTests/css3/device-adapt/opera/constrain-004.html
diff --git a/LayoutTests/css3/device-adapt/opera/constrain-004.html b/LayoutTests/css3/device-adapt/opera/constrain-004.html
new file mode 100644
index 0000000000000000000000000000000000000000..36496acbfc201004ab20fb2b0a30e6a5d17f3d54
--- /dev/null
+++ b/LayoutTests/css3/device-adapt/opera/constrain-004.html
@@ -0,0 +1,107 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <meta charset="UTF-8">
+ <title>CSS Test: @viewport constrained - min-width 10000px</title>
+ <link rel="author" title="Rune Lillesveen" href="mailto:rune@opera.com">
+ <link rel="help" href="http://www.w3.org/TR/css-device-adapt/#constraining-procedure">
+ <meta name="flags" content="visual scroll dom">
+ <meta name="assert" content="Setting min-width in @viewport to a length larger than the initial viewport width will set the actual viewport width to that length.">
+ <script src="../../../resources/testharness.js" type="text/javascript"></script>
+ <script src="../../../resources/testharnessreport.js" type="text/javascript"></script>
+ <style type="text/css">
+ body { margin: 0; }
+ html, body, #test { width: 100%; height: 100%; }
+ #log { padding: 1em; display: none; }
+ /* Reset viewport values to initial values to ignore UA stylesheet. */
+ @-webkit-viewport {
+ width: auto;
+ height: auto;
+ zoom: auto;
+ min-zoom: auto;
+ max-zoom: auto;
+ user-zoom: zoom;
+ orientation: auto;
+ resolution: auto;
+ }
+ </style>
+ <style type="text/css">
+ /* CSS for the test below. */
+ @-webkit-viewport { min-width: 10000px }
+ /* Set root element font-size to something different from the initial
+ font-size to make sure 'rem' and 'em' for @viewport is based on the
+ initial font-size, not the root element font-size. */
+ html { font-size: 2rem; }
+ body { font-size: 0.5rem; }
+ </style>
+ <script type="text/javascript">
+ var test = async_test("CSS Test: @viewport constrained - min-width 10000px");
+ window.onload = function(){
+
+ var testStyleSheet = document.styleSheets.item(1);
+
+ /* Initialize an object to store viewport values to be used by the test
+ asserts. */
+ var viewport = new Object();
+
+ /* An element with the same size as the initial containing block. */
+ var testElm = document.getElementById("test");
+
+ if (window.testRunner) {
+ viewport.fontSize = parseInt(getComputedStyle(testElm, "").fontSize);
+ viewport.deviceWidth = 320;
+ viewport.deviceHeight = 480;
+ viewport.initialWidth = 320;
+ viewport.initialHeight = 352;
+
+ var vpString = internals.configurationForViewport(document, 1,
+ viewport.deviceWidth,
+ viewport.deviceHeight,
+ viewport.initialWidth,
+ viewport.initialHeight);
+
+ var match = /viewport size (.+)x(.+) scale (.+ )/.exec(vpString);
+
+ if (match) {
+ viewport.actualWidth = parseFloat(match[1]);
+ viewport.actualHeight = parseFloat(match[2]);
+ viewport.zoom = parseFloat(match[3]);
+ }
+ }
+ else {
+ /* Disable the stylesheet that contains the @viewport to test. */
+ testStyleSheet.disabled = true;
+
+ /* Retrieve the initial viewport values before applying the @viewport to
+ test. */
+ viewport.fontSize = parseInt(getComputedStyle(testElm, "").fontSize);
+ viewport.initialWidth = testElm.offsetWidth;
+ viewport.initialHeight = testElm.offsetHeight;
+
+ /* Enable the stylesheet that contains the @viewport to test. */
+ testStyleSheet.disabled = false;
+
+ /* Retrieve the actual viewport values for the test. */
+ viewport.actualWidth = testElm.offsetWidth;
+ viewport.actualHeight = testElm.offsetHeight;
+ viewport.zoom = viewport.initialWidth / window.innerWidth;
+ }
+
+ /* Check viewport values. */
+ test.step(function(){
+ assert_equals(viewport.actualWidth, 10000);
+ });
+
+ /* Finished. Show the results. */
+ test.done();
+ testStyleSheet.disabled = true;
+ document.getElementById("log").style.display = "block";
+ }
+ </script>
+ </head>
+ <body>
+ <div id="test">
+ <div id="log"></div>
+ </div>
+ </body>
+</html>

Powered by Google App Engine
This is Rietveld 408576698