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 |