test_streams_capture_origin.html

Enable keyboard shortcuts

<!DOCTYPE HTML>

<html>

<head>

  <title>Test for Bug 1189506</title>

  <script src="/tests/SimpleTest/SimpleTest.js"></script>

  <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/>

  <script type="text/javascript" src="manifest.js"></script>

</head>

<body>

<a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1189506">Mozilla Bug 1189506</a>

<p id="display"></p>

<video id="vin"></video>

<video id="vout"></video>

<video id="vout_cors" crossorigin></video>

<canvas id="cin" width="40" height="30"></canvas>

<canvas id="cout" width="40" height="30"></canvas>

<canvas id="cout_cors" width="40" height="30"></canvas>

<div id="content" style="display: none">

</div>

<pre id="test">

<script type="application/javascript">

/* global vin, vout, vout_cors, cin, cout, cout_cors */

/** Test for Bug 1189506 **/

SimpleTest.waitForExplicitFinish();

async function start() {

  const resource = getPlayableVideo(gSmallTests).name;

  vin.src = "http://example.org:8000/tests/dom/media/test/" + resource;

  vin.preload = "metadata";

  await new Promise(r => vin.onloadedmetadata = r);

  vout.srcObject = vin.mozCaptureStreamUntilEnded();

  vout_cors.srcObject = vin.mozCaptureStreamUntilEnded();

  vin.play();

  vout.play();

  vout_cors.play();

  await new Promise(r => vout.onended = r);

  is(vin.ended, vout.ended, "Source media element ends first");

  const ctxin = SpecialPowers.wrap(cin.getContext("2d"));

  ctxin.drawImage(vin, 0, 0);

    info("Testing that the last frame is rendered");

    const powerCtx = SpecialPowers.wrap(cout.getContext("2d"));

    powerCtx.drawImage(vout, 0, 0);

    const datain = ctxin.getImageData(0, 0, cin.width, cin.height);

    const dataout = powerCtx.getImageData(0, 0, cout.width, cout.height);

    for (let i = 0; i < datain.data.length; i += 4) {

      const pixelin = datain.data.slice(i, i + 4).join(',');

      const pixelout = dataout.data.slice(i, i + 4).join(',');

      if (pixelin != pixelout) {

        is(pixelout, pixelin, `Pixel #${i/4} is rendered as expected`);

        break;

    is(datain.data.length / 4, cin.width * cin.height,

      "Checked expected number of pixels");

    info("Testing that the principal is set");

    const ctx = cout.getContext("2d");

    ctx.drawImage(vout, 0, 0);

    SimpleTest.doesThrow(() => ctx.getImageData(0, 0, cout.width, cout.height),

      "SecurityError");

    info("Testing that the crossorigin attribute is ignored for MediaStreams");

    const ctx = cout_cors.getContext("2d");

    ctx.drawImage(vout_cors, 0, 0);

    SimpleTest.doesThrow(

      () => ctx.getImageData(0, 0, cout_cors.width, cout_cors.height),

      "SecurityError");

(async () => {

  try { await start(); }

  catch(e) { ok(false, `Rejected with ${e}`); }

  finally { SimpleTest.finish(); }

})();

</script>

</pre>

</body>

</html>