1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131
|
<!DOCTYPE HTML>
<html>
<head>
<title>Video controls test</title>
<script src="/tests/SimpleTest/SimpleTest.js"></script>
<script src="/tests/SimpleTest/EventUtils.js"></script>
<script src="/tests/SimpleTest/NativeKeyCodes.js"></script>
<script type="text/javascript" src="head.js"></script>
<link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css" />
</head>
<body>
<p id="display"></p>
<pre id="test">
<script class="testbody" type="text/javascript">
SimpleTest.expectAssertions(0, 1);
const videoWidth = 320;
const videoHeight = 240;
function getMediaElement(aWindow) {
return aWindow.document.getElementsByTagName("video")[0];
}
var popup = window.open("seek_with_sound.webm");
popup.addEventListener("load", function() {
var video = getMediaElement(popup);
is(popup.document.activeElement, video, "Document should load with focus moved to the video element.");
if (!video.paused) {
runTestVideo(video);
} else {
video.addEventListener("play", function() {
runTestVideo(video);
}, {once: true});
}
}, {once: true});
function runTestVideo(aVideo) {
var condition = function() {
var boundingRect = aVideo.getBoundingClientRect();
return boundingRect.width == videoWidth &&
boundingRect.height == videoHeight;
};
waitForCondition(condition, function() {
var boundingRect = aVideo.getBoundingClientRect();
is(boundingRect.width, videoWidth, "Width of the video should match expectation");
is(boundingRect.height, videoHeight, "Height of video should match expectation");
popup.close();
runTestAudioPre();
}, "The media element should eventually be resized to match the intrinsic size of the video.");
}
function runTestAudioPre() {
popup = window.open("audio.ogg");
popup.addEventListener("load", function() {
var audio = getMediaElement(popup);
is(popup.document.activeElement, audio, "Document should load with focus moved to the video element.");
if (!audio.paused) {
runTestAudio(audio);
} else {
audio.addEventListener("play", function() {
runTestAudio(audio);
}, {once: true});
}
}, {once: true});
}
function runTestAudio(aAudio) {
info("User agent (help diagnose bug #943556): " + navigator.userAgent);
var isAndroid = navigator.userAgent.includes("Android");
var expectedHeight = isAndroid ? 103 : 40;
var condition = function() {
var boundingRect = aAudio.getBoundingClientRect();
return boundingRect.height == expectedHeight;
};
waitForCondition(condition, function() {
var boundingRect = aAudio.getBoundingClientRect();
is(boundingRect.height, expectedHeight,
"Height of audio element should be " + expectedHeight + ", which is equal to the controls bar.");
ok(!aAudio.paused, "Should be playing");
testPauseByKeyboard(aAudio);
}, "The media element should eventually be resized to match the height of the audio controls.");
}
function testPauseByKeyboard(aAudio) {
aAudio.addEventListener("pause", function() {
afterKeyPause(aAudio);
}, {once: true});
// Press spacebar, which means play/pause.
synthesizeKey(" ", {}, popup);
}
function afterKeyPause(aAudio) {
ok(true, "successfully caused audio to pause");
waitForCondition(function() {
return aAudio.paused;
},
function() {
// Click outside of the controls area. (Hopefully this has no effect.)
synthesizeMouseAtPoint(5, 5, { type: 'mousedown' }, popup);
synthesizeMouseAtPoint(5, 5, { type: 'mouseup' }, popup);
setTimeout(function() {
testPlayByKeyboard(aAudio);
}, 0);
});
}
function testPlayByKeyboard(aAudio) {
aAudio.addEventListener("play", function() {
ok(true, "successfully caused audio to play");
finishAudio();
}, {once: true});
// Press spacebar, which means play/pause.
synthesizeKey(" ", {}, popup);
}
function finishAudio() {
popup.close();
SimpleTest.finish();
}
SimpleTest.waitForExplicitFinish();
</script>
</pre>
</body>
</html>
|