LayoutTests/media/video-size.html

   1 <html>
   2     <head>
   3         <title>&lt;video&gt; element size and resize test</title>
   4         <script src=video-test.js></script>
   5         <script src=media-file.js></script>
   6
   7         <script>
   8             var movieInfo =
   9             {
  10                 current:0,
  11                 movies:
  12                 [
  13                     {
  14                         src:null,
  15                         poster:null,
  16                         description:"no 'src' and no 'poster', with 'width' and 'height' attributes",
  17                         width:640,
  18                         height:480,
  19                         videoWidth:0,
  20                         videoHeight:0
  21                     },
  22                     {
  23                         src:null,
  24                         poster:null,
  25                         description:"no 'src' and no 'poster', with NO 'width' and 'height' attributes, should be default size",
  26                         width:300,
  27                         height:150,
  28                         videoWidth:0,
  29                         videoHeight:0
  30                     },
  31                     {
  32                         src:null,
  33                         poster:"content/abe.png",
  34                         description:"'poster' but no  'src', should be image size",
  35                         width:76,
  36                         height:103,
  37                         videoWidth:0,
  38                         videoHeight:0
  39                     },
  40                     {
  41                         src:"content/test",
  42                         poster:"content/abe.png",
  43                         description:"'poster' and  'src', should be &lt;video&gt; size",
  44                         width:320,
  45                         height:240,
  46                         videoWidth:320,
  47                         videoHeight:240
  48                     },
  49                     {
  50                         src:"content/bogus",
  51                         poster:"content/greenbox.png",
  52                         description:"'poster' and invalid 'src', should be image size",
  53                         width:25,
  54                         height:25,
  55                         videoWidth:0,
  56                         videoHeight:0
  57                     },
  58                 ]
  59             };
  60
  61             function setupNextConfiguration()
  62             {
  63                 consoleWrite("");
  64                 if (movieInfo.current >= movieInfo.movies.length)
  65                 {
  66                     endTest();
  67                     return;
  68                 }
  69
  70                 var movie = movieInfo.movies[movieInfo.current];
  71                 if (movie.src || movie.poster) {
  72                     var desc = "<b>Setting ";
  73                     if (movie.src && relativeURL(video.src) != movie.src) {
  74                         video.src = findMediaFile("video", movie.src);
  75                         desc += "'src' to <em>\""+ movie.src + ".[extension]\"</em> ";
  76                     }
  77                     if (movie.poster && relativeURL(video.poster) != movie.poster) {
  78                         video.poster = movie.poster;
  79                         desc += "'poster' to <em>\""+ movie.poster + "\"</em>";
  80                     }
  81                     consoleWrite(desc + "</b>");
  82                 }
  83
  84                 // Remove width/height attributes if present
  85                 if (video.width || video.height) {
  86                     consoleWrite("<b>Removing 'width' and 'height' attributes.</b>");
  87                     video.removeAttribute('width');
  88                     video.removeAttribute('height');
  89                 }
  90
  91                 if (!movie.src || movie.src.indexOf('bogus') >= 0)
  92                     setTimeout(testMovie, 100);
  93             }
  94
  95             function testMovie()
  96             {
  97                 if (movieInfo.current >= movieInfo.movies.length)
  98                     return;
  99
 100                 var temp = document.body.offsetWidth;
 101                 var movie = movieInfo.movies[movieInfo.current];
 102
 103                 var desc = "<b>Testing movie with " + movie.description + ".</b>";
 104                 consoleWrite(desc);
 105
 106                 testExpected("video.clientWidth", movie.width);
 107                 testExpected("video.clientHeight", movie.height);
 108                 testExpected("video.videoWidth", movie.videoWidth);
 109                 testExpected("video.videoHeight", movie.videoHeight);
 110
 111                 movieInfo.current++;
 112                 setupNextConfiguration();
 113             }
 114
 115             function test()
 116             {
 117                 findMediaElement();
 118                 testMovie();
 119             }
 120         </script>
 121     </head>
 122
 123     <body onload="setTimeout(test, 100)">
 124
 125         <video controls width=640 height=480 onloadedmetadata="testMovie()"></video>
 126         <p>Test &lt;video&gt; element size with and without 'src' and 'poster' attributes.</p>
 127
 128     </body>
 129 </html>