src/third_party/WebKit/LayoutTests/media/video-controls-overlay-play-button.html

   1 <!doctype html>
   2 <html>
   3     <head>
   4         <title>Test that the overlay play button respects the controls attribute</title>
   5         <script src="media-controls.js"></script>
   6         <script src="media-file.js"></script>
   7         <script src="video-test.js"></script>
   8         <script>
   9             function start()
  10             {
  11                 window.internals.settings.setMediaControlsOverlayPlayButtonEnabled(true);
  12
  13                 // Add element dynamically, since otherwise the controls are created, but
  14                 // hidden, before the setting is set, causing the setting to be ignored.
  15                 addVideoElement();
  16
  17                 findMediaElement();
  18
  19                 video.controls = true;
  20
  21                 button = mediaControlsButton(video, 'overlay-play-button')
  22                 testExpected('getComputedStyle(button).display', 'flex');
  23
  24                 waitForEventOnce('loadeddata', loadeddata);
  25                 video.src = findMediaFile('video', 'content/test');
  26             }
  27
  28             function addVideoElement() {
  29                 element = document.createElement('video');
  30                 document.body.appendChild(element);
  31             }
  32
  33             function loadeddata()
  34             {
  35                 waitForEventOnce('play', play1);
  36                 run('video.play()');
  37             }
  38
  39             function play1()
  40             {
  41                 testExpected('getComputedStyle(button).display', 'none');
  42
  43                 waitForEventOnce('pause', pause1);
  44                 run('video.pause()');
  45             }
  46
  47             function pause1()
  48             {
  49                 testExpected('getComputedStyle(button).display', 'flex');
  50
  51                 video.controls = false;
  52                 testExpected('getComputedStyle(button).display', 'none');
  53
  54                 waitForEventOnce('play', play2);
  55                 run('video.play()');
  56             }
  57
  58             function play2()
  59             {
  60                 testExpected('getComputedStyle(button).display', 'none');
  61
  62                 waitForEventOnce('pause', pause2);
  63                 run('video.pause()');
  64             }
  65
  66             function pause2()
  67             {
  68                 testExpected('getComputedStyle(button).display', 'none');
  69
  70                 video.controls = true;
  71                 testExpected('getComputedStyle(button).display', 'flex');
  72
  73                 endTest();
  74             }
  75         </script>
  76     </head>
  77     <body onload="start()">
  78         <p>Test that the overlay play button respects the controls attribute</p>
  79     </body>
  80 </html>