| OLD | NEW |
| 1 <style> | 1 <style> |
| 2 div { | 2 div { |
| 3 background-color: pink; | 3 background-color: pink; |
| 4 -webkit-align-self: stretch; | 4 -webkit-align-self: stretch; |
| 5 -webkit-flex: 1; | 5 -webkit-flex: 1; |
| 6 position: relative; | 6 position: relative; |
| 7 } | 7 } |
| 8 .vertical { | 8 .vertical { |
| 9 -webkit-writing-mode: vertical-lr; | 9 -webkit-writing-mode: vertical-lr; |
| 10 } | 10 } |
| 11 .inner { | 11 .inner { |
| 12 display: inline-block; | 12 display: inline-block; |
| 13 height: 500px; | 13 height: 500px; |
| 14 } | 14 } |
| 15 </style> | 15 </style> |
| 16 <script src="full-screen-test.js"></script> | 16 <script src="full-screen-test.js"></script> |
| 17 <body> | 17 <body> |
| 18 <div><div class=vertical> | 18 <div><div class=vertical> |
| 19 <div class="inner">This div becomes a stretched flex item in fullscreen mo
de, and should | 19 <div class="inner">This div becomes a stretched flex item in fullscreen mo
de, and should |
| 20 become normal-sized again once leaving it.</div> | 20 become normal-sized again once leaving it.</div> |
| 21 <div class="inner">Number 2</div> | 21 <div class="inner">Number 2</div> |
| 22 <div class="inner">Number 3</div> | 22 <div class="inner">Number 3</div> |
| 23 <div class="inner">Number 4</div> | 23 <div class="inner">Number 4</div> |
| 24 </div></div> | 24 </div></div> |
| 25 <script> | 25 <script> |
| 26 // Bail out early if the full screen API is not enabled or is missing: | 26 var callback; |
| 27 if (Element.prototype.webkitRequestFullScreen == undefined) { | 27 var fullscreenChanged = function(event) |
| 28 logResult(false, "Element.prototype.webkitRequestFullScreen == undefined
"); | 28 { |
| 29 if (callback) |
| 30 callback(event) |
| 31 }; |
| 32 waitForEvent(document, 'webkitfullscreenchange', fullscreenChanged); |
| 33 |
| 34 var div = document.getElementsByTagName('div')[0]; |
| 35 var oldHeight = div.offsetHeight; |
| 36 |
| 37 var divEnteredFullScreen = function(event) { |
| 38 callback = divExitedFullScreen; |
| 39 document.webkitExitFullscreen(); |
| 40 }; |
| 41 |
| 42 var divExitedFullScreen = function(event) { |
| 43 callback = null; |
| 44 testExpected(div.offsetHeight, oldHeight); |
| 45 div.innerHTML = ""; // simplify the text dump |
| 29 endTest(); | 46 endTest(); |
| 30 } else { | 47 }; |
| 31 var callback; | |
| 32 var fullscreenChanged = function(event) | |
| 33 { | |
| 34 if (callback) | |
| 35 callback(event) | |
| 36 }; | |
| 37 waitForEvent(document, 'webkitfullscreenchange', fullscreenChanged); | |
| 38 | 48 |
| 39 var div = document.getElementsByTagName('div')[0]; | 49 callback = divEnteredFullScreen; |
| 40 var oldHeight = div.offsetHeight; | 50 runWithKeyDown(function(){div.webkitRequestFullScreen()}); |
| 41 | |
| 42 var divEnteredFullScreen = function(event) { | |
| 43 callback = divExitedFullScreen; | |
| 44 document.webkitExitFullscreen(); | |
| 45 }; | |
| 46 | |
| 47 var divExitedFullScreen = function(event) { | |
| 48 callback = null; | |
| 49 testExpected(div.offsetHeight, oldHeight); | |
| 50 div.innerHTML = ""; // simplify the text dump | |
| 51 endTest(); | |
| 52 }; | |
| 53 | |
| 54 callback = divEnteredFullScreen; | |
| 55 runWithKeyDown(function(){div.webkitRequestFullScreen()}); | |
| 56 } | |
| 57 </script> | 51 </script> |
| 58 <button onclick="div.webkitRequestFullScreen()">Enter Fullscreen</button> | 52 <button onclick="div.webkitRequestFullScreen()">Enter Fullscreen</button> |
| OLD | NEW |