third_party/WebKit/LayoutTests/media/encrypted-media/encrypted-media-playback-two-videos.html

   1 <!DOCTYPE html>
   2 <html>
   3     <head>
   4         <title>Clear Key Play Two Videos At Same Time</title>
   5         <script src="encrypted-media-utils.js"></script>
   6         <script src="../../resources/testharness.js"></script>
   7         <script src="../../resources/testharnessreport.js"></script>
   8     </head>
   9     <body>
  10         <video id="testVideo"></video>
  11         <video id="secondVideo"></video>
  12         <div id="log"></div>
  13         <script>
  14             // As this code doesn't wait for the 'message' event to simplify
  15             // the code, specify the key ID and key used by the encrypted
  16             // content.
  17             var keyId = stringToUint8Array('0123456789012345');
  18             var rawKey = new Uint8Array([0xeb, 0xdd, 0x62, 0xf1, 0x68, 0x14, 0xd2, 0x7b,
  19                                          0x68, 0xef, 0x12, 0x2a, 0xfc, 0xe4, 0xae, 0x3c]);
  20
  21             promise_test(function(test)
  22             {
  23                 var promises = [
  24                     play_video_as_promise(document.getElementById('testVideo'), '../content/test-encrypted.webm'),
  25                     play_video_as_promise(document.getElementById('secondVideo'), '../content/test-encrypted.webm')
  26                 ];
  27                 return Promise.all(promises);
  28             }, 'Play two videos at the same time.');
  29
  30             function play_video_as_promise(video, content)
  31             {
  32                 return navigator.requestMediaKeySystemAccess('org.w3.clearkey', [{}]).then(function(access) {
  33                     return access.createMediaKeys();
  34                 }).then(function(mediaKeys) {
  35                     return video.setMediaKeys(mediaKeys);
  36                 }).then(function(result) {
  37                     video.src = content;
  38                     video.play();
  39                     return wait_for_encrypted_message(video);
  40                 }).then(function(result) {
  41                     return wait_for_timeupdate_message(video);
  42                 });
  43             };
  44
  45             function wait_for_encrypted_message(video)
  46             {
  47                 var encryptedEventCount = 0;
  48                 return new Promise(function(resolve) {
  49                     video.addEventListener('encrypted', function listener(e) {
  50                         // The same decryption key is used by both the audio
  51                         // and the video streams so only create a session once.
  52                         // Create the session on the second event. This also
  53                         // ensures we see both events.
  54                         if (++encryptedEventCount != 2)
  55                             return;
  56                         video.removeEventListener(listener);
  57
  58                         var mediaKeySession = video.mediaKeys.createSession();
  59                         mediaKeySession.generateRequest(e.initDataType, e.initData).then(function(result) {
  60                             // Don't bother waiting for the 'message' event.
  61                             // Just call update() since we know the keyId
  62                             // needed.
  63                             var jwkSet = stringToUint8Array(createJWKSet(createJWK(keyId, rawKey)));
  64                             return mediaKeySession.update(jwkSet);
  65                         }).then(function(result) {
  66                             resolve(result);
  67                         });
  68                     });
  69                 });
  70             };
  71
  72             function wait_for_timeupdate_message(video)
  73             {
  74                 return new Promise(function(resolve) {
  75                     video.addEventListener('timeupdate', function listener(e) {
  76                         if (e.target.currentTime < 0.2)
  77                             return;
  78                         video.removeEventListener(listener);
  79                         resolve(e);
  80                     });
  81                 });
  82             };
  83         </script>
  84     </body>
  85 </html>