media/test/data/mse_config_change.html

   1 <html>
   2   <head>
   3     <title>Test media source config changes.</title>
   4   </head>
   5   <body onload="runTest();">
   6     <video controls></video>
   7     <script src='eme_player_js/app_loader.js' type='text/javascript'></script>
   8     <script type="text/javascript">
   9       var testConfig = new TestConfig();
  10       testConfig.loadQueryParams();
  11       var runEncrypted = testConfig.runEncrypted == 1;
  12
  13       var video = document.querySelector('video');
  14       var mediaType = 'video/webm; codecs="vorbis, vp8"';
  15
  16       var MEDIA_1 = 'bear-320x240.webm';
  17       var MEDIA_2 = 'bear-640x360.webm';
  18       if (runEncrypted) {
  19         MEDIA_1 = 'bear-320x240-av_enc-av.webm';
  20         MEDIA_2 = 'bear-640x360-av_enc-av.webm';
  21       }
  22
  23       var MEDIA_1_WIDTH = 320;
  24       var MEDIA_1_HEIGHT = 240;
  25
  26       var MEDIA_2_WIDTH = 640;
  27       var MEDIA_2_HEIGHT = 360;
  28       var MEDIA_2_LENGTH = 2.75;
  29
  30       // The time in secs to append the second media source.
  31       var APPEND_TIME = 1;
  32       // DELTA is the time after APPEND_TIME where the second video dimensions
  33       // are guaranteed to take effect.
  34       var DELTA = 0.1;
  35       // Append MEDIA_2 source at APPEND_TIME, so expected total duration is:
  36       var TOTAL_DURATION = APPEND_TIME + MEDIA_2_LENGTH;
  37
  38       function appendNextSource(mediaSource) {
  39         console.log('Appending next media source at ' + APPEND_TIME + 'sec.');
  40         var xhr = new XMLHttpRequest();
  41         xhr.open("GET", MEDIA_2);
  42         xhr.responseType = 'arraybuffer';
  43         xhr.addEventListener('load', function(e) {
  44           var onUpdateEnd = function(e) {
  45             console.log('Second buffer append ended.');
  46             srcBuffer.removeEventListener('updateend', onUpdateEnd);
  47             mediaSource.endOfStream();
  48             if (!mediaSource.duration ||
  49                 Math.abs(mediaSource.duration - TOTAL_DURATION) > DELTA) {
  50               Utils.failTest('Unexpected mediaSource.duration = ' +
  51                        mediaSource.duration + ', expected duration = ' +
  52                        TOTAL_DURATION);
  53               return;
  54             }
  55             video.play();
  56           };
  57           console.log('Appending next media source at ' + APPEND_TIME + 'sec.');
  58           var srcBuffer = mediaSource.sourceBuffers[0];
  59           srcBuffer.addEventListener('updateend', onUpdateEnd);
  60           srcBuffer.timestampOffset = APPEND_TIME;
  61           srcBuffer.appendBuffer(new Uint8Array(e.target.response));
  62         });
  63         xhr.send();
  64       }
  65
  66       function onTimeUpdate() {
  67         // crbug.com/246308
  68         //checkVideoProperties();
  69
  70         // Seek to APPEND_TIME because after a seek a timeUpdate event is fired
  71         // before video width and height properties get updated.
  72         if (video.currentTime < APPEND_TIME - DELTA) {
  73           // Seek to save test execution time (about 1 secs) and to test seek
  74           // on the first buffer.
  75           video.currentTime = APPEND_TIME - DELTA;
  76         } else if (video.currentTime > APPEND_TIME + DELTA) {
  77           // Check video duration here to guarantee that second segment has been
  78           // appended and video total duration is updated.
  79           // Video duration is a float value so we check it within a range.
  80           if (!video.duration ||
  81               Math.abs(video.duration - TOTAL_DURATION) > DELTA) {
  82             Utils.failTest('Unexpected video.duration = ' + video.duration +
  83                      ', expected duration = ' + TOTAL_DURATION);
  84             return;
  85           }
  86
  87           video.removeEventListener('timeupdate', onTimeUpdate);
  88           video.removeEventListener('ended', Utils.failTest);
  89           Utils.installTitleEventHandler(video, 'ended');
  90           // Seek to save test execution time and to test seek on second buffer.
  91           video.currentTime = APPEND_TIME + MEDIA_2_LENGTH * 0.9;
  92         }
  93       }
  94
  95       function checkVideoProperties() {
  96         if (video.currentTime <= APPEND_TIME) {
  97           if (video.videoWidth != MEDIA_1_WIDTH ||
  98               video.videoHeight != MEDIA_1_HEIGHT) {
  99             logVideoDimensions();
 100             Utils.failTest('Unexpected dimensions for first video segment.');
 101             return;
 102           }
 103         } else if (video.currentTime >= APPEND_TIME + DELTA) {
 104           if (video.videoWidth != MEDIA_2_WIDTH ||
 105               video.videoHeight != MEDIA_2_HEIGHT) {
 106             logVideoDimensions();
 107             Utils.failTest('Unexpected dimensions for second video segment.');
 108             return;
 109           }
 110         }
 111       }
 112
 113       function logVideoDimensions() {
 114         console.log('video.currentTime = ' + video.currentTime +
 115                     ', video dimensions = ' + video.videoWidth + 'x' +
 116                     video.videoHeight + '.');
 117       }
 118
 119       function runTest() {
 120         testConfig.mediaFile = MEDIA_1;
 121         testConfig.mediaType = mediaType;
 122         video.addEventListener('timeupdate', onTimeUpdate);
 123         video.addEventListener('ended', Utils.failTest);
 124         var mediaSource = MediaSourceUtils.loadMediaSource(
 125             MEDIA_1, mediaType, appendNextSource);
 126         if (runEncrypted) {
 127           var emePlayer = PlayerUtils.createPlayer(video, testConfig);
 128           emePlayer.registerEventListeners()
 129               .then(function(player) {
 130                 video.src = window.URL.createObjectURL(mediaSource);
 131               })
 132               .catch(function(error) {
 133                 Utils.failTest('Unable to register event listeners.');
 134               });
 135         } else {
 136           video.src = window.URL.createObjectURL(mediaSource);
 137         }
 138       }
 139       </script>
 140   </body>
 141 </html>