third_party/WebKit/LayoutTests/media/stable/video-object-fit-stable.html

   1 <!DOCTYPE html>
   2 <html>
   3   <head>
   4     <title>object-fit, video</title>
   5     <style>
   6       video {
   7         width: 120px;
   8         height: 120px;
   9         border: 1px solid blue;
  10         background-color: gray;
  11         margin: 10px;
  12       }
  13     </style>
  14     <script src=../media-file.js></script>
  15     <script>
  16         if (window.testRunner)
  17           testRunner.waitUntilDone();
  18
  19         function init()
  20         {
  21             setSrcByTagName("video", findMediaFile("video", "../content/test"));
  22
  23             var totalCount = document.getElementsByTagName('video').length;
  24             var count = totalCount;
  25             document.addEventListener("canplaythrough", function () {
  26                 if (!--count) {
  27                     if (window.testRunner)
  28                         setTimeout(function() { testRunner.notifyDone(); }, totalCount * 150);
  29                 }
  30             }, true);
  31         }
  32     </script>
  33
  34   </head>
  35   <body onload="init();">
  36     <video style="object-fit: fill"></video>
  37     <video style="object-fit: contain"></video>
  38     <video style="object-fit: cover"></video>
  39     <video style="object-fit: none"></video>
  40     <video style="object-fit: scale-down"></video>
  41   </body>
  42 </html>