LayoutTests/media/video-poster-delayed.html

   1 <!DOCTYPE HTML5>
   2
   3 <html>
   4     <head>
   5         <title>Delayed load of poster should not overwrite intrinsic size of video</title>
   6         <script src=video-test.js></script>
   7         <script src=media-file.js></script>
   8         <style>
   9             video {
  10                 border: 3px solid red;
  11                 background-color: magenta;
  12             }
  13         </style>
  14         <script>
  15             function start()
  16             {
  17                 video = document.getElementById('video');
  18
  19                 video.addEventListener("loadeddata", function(ev) {
  20
  21                     consoleWrite("<br><b>Video loaded</b><br>");
  22
  23                     testExpected("video.clientWidth", 320);
  24                     testExpected("video.clientHeight", 240);
  25                     testExpected("video.videoWidth", 320);
  26                     testExpected("video.videoHeight", 240);
  27
  28                     video.poster = "content/abe.png";
  29                     setTimeout(testAfterLoadingPoster, 100);
  30                 });
  31
  32                 video.src = findMediaFile("video", "content/test");
  33             }
  34
  35             function testAfterLoadingPoster()
  36             {
  37                 consoleWrite("<br><b>Poster loaded</b><br>");
  38
  39                 testExpected("video.clientWidth", 320);
  40                 testExpected("video.clientHeight", 240);
  41                 testExpected("video.videoWidth", 320);
  42                 testExpected("video.videoHeight", 240);
  43
  44                 endTest();
  45             }
  46         </script>
  47     </head>
  48
  49
  50     <body onload="start()">
  51         <video id=video></video>
  52     </body>
  53 </html>