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 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163 164 165 166 167
|
<!DOCTYPE html>
<html>
<title>Test the basics of the video.requestVideoFrameCallback() API.</title>
<body></body>
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/common/media.js"></script>
<script>
var testVideo = {
url: getVideoURI('/media/movie_5'),
height: 240,
width: 320,
}
var altTestVideo = {
url: getVideoURI('/media/counting'),
height: 240,
width: 320,
}
promise_test(async function(t) {
let done;
const promise = new Promise(resolve => done = resolve);
let video = document.createElement('video');
document.body.appendChild(video);
let id = video.requestVideoFrameCallback(
t.step_func((time, metadata) => {
assert_true(time > 0);
assert_equals(metadata.height, testVideo.height);
assert_equals(metadata.width, testVideo.width);
done();
})
);
assert_true(id > 0);
video.src = testVideo.url;
await video.play();
return promise;
}, 'Test we can register a video.rVFC callback.');
promise_test(async function(t) {
let done;
const promise = new Promise(resolve => done = resolve);
let video = document.createElement('video');
document.body.appendChild(video);
video.requestVideoFrameCallback(
t.step_func(video_now => {
// Queue a call to window.rAF, and make sure it is executed within the
// same turn of the event loop (with the same 'time' parameter).
window.requestAnimationFrame( t.step_func( window_now => {
assert_equals(video_now, window_now);
done();
}));
})
);
video.src = testVideo.url;
await video.play();
return promise;
}, 'Test video.rVFC callbacks run before window.rAF callbacks.');
promise_test(async function(t) {
let done;
const promise = new Promise(resolve => done = resolve);
let video = document.createElement('video');
document.body.appendChild(video);
let id = video.requestVideoFrameCallback(
t.step_func(_ => {
assert_unreached("Cancelled callbacks shouldn't be executed")
})
);
video.cancelVideoFrameCallback(id);
video.requestVideoFrameCallback(
t.step_func(_ => {
// At this point, the other callback shouldn't have fired, but
// give it some more time and really make sure it doesn't, by going
// throught the event loop once more.
t.step_timeout(() => { done(); }, 0);
})
);
video.src = testVideo.url;
await video.play();
return promise;
}, 'Test we can cancel a video.rVFC request.');
test(function(t) {
let video = document.createElement('video');
document.body.appendChild(video);
// requestVideoFrameCallback() expects 1 function as a parameter.
assert_throws_js(TypeError, _ => { video.requestVideoFrameCallback() } );
assert_throws_js(TypeError, _ => { video.requestVideoFrameCallback(0) });
assert_throws_js(TypeError, _ => { video.requestVideoFrameCallback("foo") });
// cancelVideoFrameCallback() expects 1 number as a parameter
assert_throws_js(TypeError, _ => { video.cancelVideoFrameCallback() } );
// Invalid calls are just no-ops
video.cancelVideoFrameCallback(_ => {});
video.cancelVideoFrameCallback(NaN);
video.cancelVideoFrameCallback("foo");
video.cancelVideoFrameCallback(12345);
video.cancelVideoFrameCallback(-1);
}, 'Test invalid calls to the video.rVFC API.');
promise_test(async function(t) {
let video = document.createElement('video');
video.autoplay = true;
document.body.appendChild(video);
let first_width = 0;
let first_height = 0;
video.src = testVideo.url;
await video.play();
// Switch to and from a second video, and make sure we get rVFC calls at
// each step.
return new Promise((resolve, reject) => {
let onReturnToOriginalVideo = t.step_func((now, metadata) => {
assert_equals(first_width, metadata.width);
assert_equals(first_height, metadata.height);
resolve();
});
let onAltVideoFirstFrame = t.step_func((now, metadata) => {
// The videos have different sizes, and shouldn't match.
assert_not_equals(first_width, metadata.width);
assert_not_equals(first_height, metadata.height);
// Swith back to the original video.
video.requestVideoFrameCallback(onReturnToOriginalVideo);
video.src = testVideo.url;
});
let onFirstFrame = t.step_func((now, metadata) => {
first_width = metadata.width;
first_height = metadata.height;
// Callbacks should persist after changing the source to the alt video.
video.requestVideoFrameCallback(onAltVideoFirstFrame);
video.src = altTestVideo.url;
})
video.requestVideoFrameCallback(onFirstFrame);
});
}, 'Test video.rVFC does not stop when switching sources.');
</script>
</html>
|