display_mode_reflow.html (3050B)
1 <!DOCTYPE HTML> 2 <html> 3 <!-- 4 https://bugzilla.mozilla.org/show_bug.cgi?id=1256084 5 --> 6 <head> 7 <meta charset="utf-8"> 8 <title>Test for Display Mode</title> 9 <script src="chrome://mochikit/content/tests/SimpleTest/EventUtils.js"></script> 10 <link rel="stylesheet" type="text/css" href="chrome://global/skin"/> 11 <link rel="stylesheet" type="text/css" href="chrome://mochikit/content/tests/SimpleTest/test.css"/> 12 <script type="application/javascript"> 13 var imports = [ "SimpleTest", "is", "isnot", "ok" ]; 14 for (var n of imports) { 15 window[n] = window.opener.wrappedJSObject[n]; 16 } 17 18 /** Test for Display Mode */ 19 20 function waitOneEvent(element, name) { 21 return new Promise(function(resolve, reject) { 22 element.addEventListener(name, function() { 23 resolve(); 24 }, {once: true}); 25 }); 26 } 27 28 function promiseNextTick() { 29 return new Promise(resolve => setTimeout(resolve, 0)); 30 } 31 32 async function test_task() { 33 var iframe = document.getElementById("subdoc"); 34 var subdoc = iframe.contentDocument; 35 var style = subdoc.getElementById("style"); 36 var bodyComputedStyled = subdoc.defaultView.getComputedStyle(subdoc.body); 37 var win = Services.wm.getMostRecentWindow("navigator:browser"); 38 39 var secondDiv = subdoc.getElementById("b"); 40 var offsetTop = secondDiv.offsetTop; 41 42 // Test entering the OS's fullscreen mode. 43 var fullScreenEntered = waitOneEvent(win, "sizemodechange"); 44 synthesizeKey("KEY_F11"); 45 await fullScreenEntered; 46 47 // Wait for the next tick to apply media feature changes. See bug 1430380. 48 await promiseNextTick(); 49 ok(offsetTop !== secondDiv.offsetTop, "offset top changes"); 50 var fullScreenExited = waitOneEvent(win, "sizemodechange"); 51 synthesizeKey("KEY_F11"); 52 await fullScreenExited; 53 54 // Wait for the next tick to apply media feature changes. See bug 1430380. 55 await promiseNextTick(); 56 ok(offsetTop === secondDiv.offsetTop, "offset top returns to original value"); 57 58 offsetTop = secondDiv.offsetTop; 59 // Test entering fullscreen through document requestFullScreen. 60 fullScreenEntered = waitOneEvent(document, "mozfullscreenchange"); 61 document.body.mozRequestFullScreen(); 62 await fullScreenEntered 63 ok(offsetTop !== secondDiv.offsetTop, "offset top changes"); 64 fullScreenExited = waitOneEvent(document, "mozfullscreenchange"); 65 document.mozCancelFullScreen(); 66 await fullScreenExited; 67 ok(offsetTop === secondDiv.offsetTop, "offset top returns to original value"); 68 69 window.close(); 70 window.SimpleTest.finish(); 71 } 72 </script> 73 </head> 74 <body onload="test_task()"> 75 <a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1256084">Mozilla Bug 1256084</a> 76 <iframe id="subdoc" src="http://mochi.test:8888/tests/layout/style/test/chrome/display_mode_reflow_iframe.html"></iframe> 77 <p id="display"></p> 78 <div id="content" style="display: none"> 79 80 </div> 81 <pre id="test"> 82 </pre> 83 </body> 84 </html>