🌐 AI搜索 & 代理 主页
Skip to content

Commit 7ee0fea

Browse files
mgolmgol
committed
CSS: Add an integration test for issue gh-1764
(cherry-picked from 8887106) Refs gh-1764 Refs gh-2401 Closes gh-2425
1 parent 23212b3 commit 7ee0fea

File tree

4 files changed

+172
-0
lines changed

4 files changed

+172
-0
lines changed

‎test/integration/data/gh-1764-fullscreen-iframe.css‎

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
.result {
2+
font-size: 24px;
3+
margin: 0.5em 0;
4+
width: 700px;
5+
height: 56px;
6+
}
7+
8+
.error {
9+
background-color: red;
10+
}
11+
12+
.warn {
13+
background-color: yellow;
14+
}
15+
16+
.success {
17+
background-color: lightgreen;
18+
}

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

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
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+
<link rel="stylesheet" href="gh-1764-fullscreen-iframe.css">
8+
</head>
9+
10+
<body class="iframe-page">
11+
<div class="container">
12+
<div class="result"></div>
13+
<button class="toggle-fullscreen">Toggle fullscreen mode - iframe</button>
14+
</div>
15+
<script src="../../../dist/jquery.js"></script>
16+
<script src="gh-1764-fullscreen.js"></script>
17+
<script>
18+
bootstrapFrom( ".iframe-page", "iframe" );
19+
</script>
20+
</body>
21+
</html>

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

Lines changed: 99 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,99 @@
1+
/* exported bootstrapFrom */
2+
3+
// `mode` may be "iframe" or not specified.
4+
function bootstrapFrom( mainSelector, mode ) {
5+
if ( mode === "iframe" && window.parent === window ) {
6+
jQuery( mainSelector + " .result" )
7+
.attr( "class", "result warn" )
8+
.text( "This test should be run in an iframe. Open ../gh-1764-fullscreen.html." );
9+
jQuery( mainSelector + " .toggle-fullscreen" ).remove();
10+
return;
11+
}
12+
13+
var fullscreenSupported = document.exitFullscreen ||
14+
document.exitFullscreen ||
15+
document.msExitFullscreen ||
16+
document.mozCancelFullScreen ||
17+
document.webkitExitFullscreen;
18+
19+
function isFullscreen() {
20+
return !!(document.fullscreenElement ||
21+
document.mozFullScreenElement ||
22+
document.webkitFullscreenElement ||
23+
document.msFullscreenElement);
24+
}
25+
26+
function requestFullscreen( element ) {
27+
if ( !isFullscreen() ) {
28+
if ( element.requestFullscreen ) {
29+
element.requestFullscreen();
30+
} else if ( element.msRequestFullscreen ) {
31+
element.msRequestFullscreen();
32+
} else if ( element.mozRequestFullScreen ) {
33+
element.mozRequestFullScreen();
34+
} else if ( element.webkitRequestFullscreen ) {
35+
element.webkitRequestFullscreen();
36+
}
37+
}
38+
}
39+
40+
function exitFullscreen() {
41+
if ( document.exitFullscreen ) {
42+
document.exitFullscreen();
43+
} else if ( document.msExitFullscreen ) {
44+
document.msExitFullscreen();
45+
} else if ( document.mozCancelFullScreen ) {
46+
document.mozCancelFullScreen();
47+
} else if ( document.webkitExitFullscreen ) {
48+
document.webkitExitFullscreen();
49+
}
50+
}
51+
52+
function runTest() {
53+
var dimensions;
54+
if ( !fullscreenSupported ) {
55+
jQuery( mainSelector + " .result" )
56+
.attr( "class", "result success" )
57+
.text( "Fullscreen mode is not supported in this browser. Test not run." );
58+
} else if ( !isFullscreen() ) {
59+
jQuery( mainSelector + " .result" )
60+
.attr( "class", "result warn" )
61+
.text( "Enable fullscreen mode to fire the test." );
62+
} else {
63+
dimensions = jQuery( mainSelector + " .result" ).css( [ "width", "height" ] );
64+
dimensions.width = parseFloat( dimensions.width ).toFixed( 3 );
65+
dimensions.height = parseFloat( dimensions.height ).toFixed( 3 );
66+
if ( dimensions.width === "700.000" && dimensions.height === "56.000" ) {
67+
jQuery( mainSelector + " .result" )
68+
.attr( "class", "result success" )
69+
.text( "Dimensions in fullscreen mode are computed correctly." );
70+
} else {
71+
jQuery( mainSelector + " .result" )
72+
.attr( "class", "result error" )
73+
.html( "Incorrect dimensions; " +
74+
"expected: { width: '700.000', height: '56.000' };<br>" +
75+
"got: { width: '" + dimensions.width + "', height: '" +
76+
dimensions.height + "' }." );
77+
}
78+
}
79+
}
80+
81+
function toggleFullscreen() {
82+
if ( isFullscreen() ) {
83+
exitFullscreen();
84+
} else {
85+
requestFullscreen( jQuery( mainSelector + " .container" )[0] );
86+
}
87+
}
88+
89+
$( mainSelector + " .toggle-fullscreen" ).on( "click", toggleFullscreen );
90+
91+
$( document ).on( [
92+
"webkitfullscreenchange",
93+
"mozfullscreenchange",
94+
"fullscreenchange",
95+
"MSFullscreenChange"
96+
].join( " " ), runTest );
97+
98+
runTest();
99+
}

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

Lines changed: 34 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,34 @@
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+
<link rel="stylesheet" href="./data/gh-1764-fullscreen-iframe.css">
8+
<style>
9+
#test-iframe {
10+
position: absolute;
11+
top: 100px;
12+
left: 0;
13+
border: 0;
14+
margin: 0;
15+
padding: 0;
16+
width: 100%;
17+
height: 100%;
18+
}
19+
</style>
20+
</head>
21+
22+
<body class="main-page">
23+
<div class="container">
24+
<div class="result"></div>
25+
<button class="toggle-fullscreen">Toggle fullscreen mode - main page</button>
26+
</div>
27+
<script src="../../dist/jquery.js"></script>
28+
<iframe id="test-iframe" allowfullscreen src="data/gh-1764-fullscreen-iframe.html"></iframe>
29+
<script src="./data/gh-1764-fullscreen.js"></script>
30+
<script>
31+
bootstrapFrom( ".main-page" );
32+
</script>
33+
</body>
34+
</html>

0 commit comments

Comments
 (0)