summaryrefslogtreecommitdiffstats
path: root/testing/web-platform/tests/video-rvfc/request-video-frame-callback-dom.html
blob: c1804b4edd0c986aa161dfc13179983c04ace404 (plain)
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
<!DOCTYPE html>
<html>
<title>Test the video.requestVideoFrameCallback() API for non visible video elements.</title>
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/common/media.js"></script>
<body>
</body>
<script>
var testVideo = {
  url: getVideoURI('/media/movie_5'),
  height: 240,
  width: 320,
}

promise_test(async function(t) {
    let done;
    const promise = new Promise(resolve => done = resolve);

    let video = document.createElement('video');

    video.requestVideoFrameCallback(done);
    video.src = testVideo.url;
    await video.play();

    return promise;
}, 'Test a video outside of the DOM can still use video.rVFC.');

function rvfcStyleTest(applyStyle, description) {
    promise_test(async function(t) {
      let done;
      const promise = new Promise(resolve => done = resolve);

      let video = document.createElement('video');
      document.body.appendChild(video);
      applyStyle(video);

      video.requestVideoFrameCallback(
        t.step_func( _ => {
          // Make sure we can receive more than one callback.
          video.requestVideoFrameCallback(done);
        })
      );

      video.src = testVideo.url;
      await video.play();

      return promise;
    }, description);
}

rvfcStyleTest((video) => { video.style.display = "none"},
  'Test video.rVFC works with "display:none".');

rvfcStyleTest((video) => { video.style.visibility = "hidden"},
  'Test video.rVFC works with "visibility:hidden".');

</script>
</html>