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
|
<!doctype html>
<html>
<head>
<title>video element resizing during playback</title>
<link rel="help" href="https://html.spec.whatwg.org/multipage/media.html#concept-video-intrinsic-width">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
</head>
<body>
<div id="log"></div>
<script>
for (const format of ['mp4', 'webm']) {
promise_test(async (t) => {
const video = document.createElement('video');
assert_implements_optional(video.canPlayType(`video/${format}`), `${format} supported`);
const eventWatcher = new EventWatcher(t, video, ['resize', 'playing', 'error', 'ended']);
// Load the video and wait for initial resize event.
video.muted = true;
video.preload = 'auto';
video.onerror = t.unreached_func("error during playback");
video.src = `/media/400x300-red-resize-200x150-green.${format}`;
document.body.appendChild(video);
await eventWatcher.wait_for(['resize']);
assert_equals(video.videoWidth, 400, 'width after first resize event');
assert_equals(video.videoHeight, 300, 'height after first resize event');
// Now play and wait for a second resize event.
const playPromise = video.play();
if (playPromise) {
playPromise.catch(t.unreached_func("play rejected"));
}
await eventWatcher.wait_for(['playing', 'resize']);
assert_equals(video.videoWidth, 200, 'width after second resize event');
assert_equals(video.videoHeight, 150, 'height after second resize event');
}, `${format} video`);
}
</script>
</body>
</html>
|
