test_decode.html - mozsearch

Enable keyboard shortcuts

<!DOCTYPE HTML>

<html>

<!--

Test decoding a simple message

-->

<head>

  <meta charset="utf-8">

  <title>Test decoding a simple message</title>

  <script src="chrome://mochikit/content/tests/SimpleTest/SimpleTest.js"></script>

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

  <script type="application/javascript">

"use strict";

window.onload = function() {

  const { require } = ChromeUtils.importESModule("resource://devtools/shared/loader/Loader.sys.mjs");

  const QR = require("devtools/shared/qrcode/index");

  SimpleTest.waitForExplicitFinish();

  const testImage =

    "data:image/gif;base64,R0lGODdhOgA6AIAAAAAAAP///ywAAAAAOgA6AAAC" +

    "/4yPqcvtD6OctNqLs968+w+G4gKU5nkaKKquLuW+QVy2tAkDTj3rfQts8CRDko" +

    "+HPPoYRUgy9YsyldDm44mLWhHYZM6W7WaDqyCRGkZDySxpRGw2sqvLt1q5w/fo" +

    "XyE6vnUQOJUHBlinMGh046V1F5PDqNcoqcgBOWKBKbK2N+aY+Ih49VkmqMcl2l" +

    "dkhZUK1umE6jZXJ2ZJaujZaRqH4bpb2uZrJxvIt4Ebe9qoYYrJOsw8apz2bCut" +

    "m9kqDcw52uuImyr5Oh1KXH1jrn2anuunywtODU/o2c6teceW39ZcLFg/fNMo1b" +

    "t3jVw2dwTPwJq1KYG3gAklCgu37yGxeScYKyiCc+7DR34hPVQiuQ7UhJMagyEb" +

    "lymmzJk0a9q8iTOnzp0NCgAAOw==";

  (async function () {

    let result = await QR.decodeFromURI(testImage);

    is(result, "HELLO", "Decoded data URI result matches");

    const canvas = await drawToCanvas(testImage);

    result = QR.decodeFromCanvas(canvas);

    is(result, "HELLO", "Decoded canvas result matches");

  })().then(SimpleTest.finish, ok.bind(null, false));

  function drawToCanvas(src) {

    return new Promise(resolve => {

      const canvas = document.createElement("canvas");

      const context = canvas.getContext("2d");

      const image = new Image();

      image.onload = () => {

        canvas.width = image.width;

        canvas.height = image.height;

        context.drawImage(image, 0, 0);

        resolve(canvas);

};

      image.src = src;

});

};

  </script>

</head>

<body>

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

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

</div>

<pre id="test">

</pre>

</body>

</html>