Skip to content

Commit 61a27b6

Browse files
mgolmgol
committed
CSS: Add an integration test for issue gh-1764
Refs gh-1764 Refs gh-2401
1 parent 3a0d582 commit 61a27b6

File tree

2 files changed

+156
-0
lines changed

2 files changed

+156
-0
lines changed

‎test/integration/data/gh-1764-fullscreen-test.html‎

Lines changed: 132 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,132 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head lang="en">
4+
<meta charset="UTF-8">
5+
<meta http-equiv="X-UA-Compatible" content="IE=edge">
6+
<title>Test for gh-1764 - test iframe</title>
7+
<style>
8+
#result {
9+
font-size: 24px;
10+
margin: 0.5em 0;
11+
width: 700px;
12+
height: 56px;
13+
}
14+
15+
.error {
16+
background-color: red;
17+
}
18+
19+
.warn {
20+
background-color: yellow;
21+
}
22+
23+
.success {
24+
background-color: lightgreen;
25+
}
26+
</style>
27+
</head>
28+
29+
<body>
30+
<div id="container">
31+
<div id="result"></div>
32+
<button id="toggle-fullscreen">Toggle fullscreen mode</button>
33+
</div>
34+
<script src="../../../dist/jquery.js"></script>
35+
<script>
36+
( function() {
37+
if ( window.parent === window ) {
38+
jQuery( "#result" )
39+
.attr( "class", "warn" )
40+
.text( "This test should be run in an iframe. Open ../gh-1764-fullscreen.html." );
41+
jQuery( "#toggle-fullscreen" ).remove();
42+
return;
43+
}
44+
45+
var fullscreenSupported = document.exitFullscreen ||
46+
document.exitFullscreen ||
47+
document.msExitFullscreen ||
48+
document.mozCancelFullScreen ||
49+
document.webkitExitFullscreen;
50+
51+
function isFullscreen() {
52+
return !!(document.fullscreenElement ||
53+
document.mozFullScreenElement ||
54+
document.webkitFullscreenElement ||
55+
document.msFullscreenElement);
56+
}
57+
58+
function requestFullscreen( element ) {
59+
if ( !isFullscreen() ) {
60+
if ( element.requestFullscreen ) {
61+
element.requestFullscreen();
62+
} else if ( element.msRequestFullscreen ) {
63+
element.msRequestFullscreen();
64+
} else if ( element.mozRequestFullScreen ) {
65+
element.mozRequestFullScreen();
66+
} else if ( element.webkitRequestFullscreen ) {
67+
element.webkitRequestFullscreen();
68+
}
69+
}
70+
}
71+
72+
function exitFullscreen() {
73+
if ( document.exitFullscreen ) {
74+
document.exitFullscreen();
75+
} else if ( document.msExitFullscreen ) {
76+
document.msExitFullscreen();
77+
} else if ( document.mozCancelFullScreen ) {
78+
document.mozCancelFullScreen();
79+
} else if ( document.webkitExitFullscreen ) {
80+
document.webkitExitFullscreen();
81+
}
82+
}
83+
84+
function runTest() {
85+
var dimensions;
86+
if ( !fullscreenSupported ) {
87+
jQuery( "#result" )
88+
.attr( "class", "success" )
89+
.text( "Fullscreen mode is not supported in this browser. Test not run." );
90+
} else if ( !isFullscreen() ) {
91+
jQuery( "#result" )
92+
.attr( "class", "warn" )
93+
.text( "Enable fullscreen mode to fire the test." );
94+
} else {
95+
dimensions = jQuery( "#result" ).css( ['width', 'height'] );
96+
if ( dimensions.width === '700px' && dimensions.height === '56px' ) {
97+
jQuery( "#result" )
98+
.attr( "class", "success" )
99+
.text( "Dimensions in fullscreen mode are computed correctly." );
100+
} else {
101+
jQuery( "#result" )
102+
.attr( "class", "error" )
103+
.html( "Incorrect dimensions; " +
104+
"expected: { width: '700px', height: '56px'};<br>" +
105+
"got: { width: '" + dimensions.width + "', height: '" +
106+
dimensions.height + "'}." );
107+
}
108+
}
109+
}
110+
111+
function toggleFullscreen() {
112+
if ( isFullscreen() ) {
113+
exitFullscreen();
114+
} else {
115+
requestFullscreen( jQuery( "#container" )[0] );
116+
}
117+
}
118+
119+
$( "#toggle-fullscreen" ).on( 'click', toggleFullscreen );
120+
121+
$( document ).on( [
122+
'webkitfullscreenchange',
123+
'mozfullscreenchange',
124+
'fullscreenchange',
125+
'MSFullscreenChange',
126+
].join( ' ' ), runTest );
127+
128+
runTest();
129+
} )();
130+
</script>
131+
</body>
132+
</html>

‎test/integration/gh-1764-fullscreen.html‎

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head lang="en">
4+
<meta charset="UTF-8">
5+
<meta http-equiv="X-UA-Compatible" content="IE=edge">
6+
<title>Test for gh-1764</title>
7+
<style>
8+
#test-iframe {
9+
position: absolute;
10+
top: 0;
11+
left: 0;
12+
border: 0;
13+
margin: 0;
14+
padding: 0;
15+
width: 100%;
16+
height: 100%;
17+
}
18+
</style>
19+
</head>
20+
21+
<body>
22+
<iframe id="test-iframe" allowfullscreen src="data/gh-1764-fullscreen-test.html"></iframe>
23+
</body>
24+
</html>

0 commit comments

Comments
 (0)