dom/indexedDB/test/test_blob_worker_xhr_read_slice.html

   1 <!--
   2   Any copyright is dedicated to the Public Domain.
   3   http://creativecommons.org/publicdomain/zero/1.0/
   4 -->
   5 <html>
   6 <head>
   7   <title>Indexed Database Blob Read From Worker</title>
   8
   9   <script src="/tests/SimpleTest/SimpleTest.js"></script>
  10   <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/>
  11
  12   <script type="text/javascript">
  13   /**
  14    * Create an IndexedDB-backed Blob, send it to the worker, try and read the
  15    * *SLICED* contents of the Blob from the worker using an XHR.  This is
  16    * (as of the time of writing this) basically the same as
  17    * test_blob_worker_xhr_read.html but with slicing added.
  18    */
  19   function* testSteps()
  20   {
  21     const BLOB_DATA = ["Green"];
  22     const BLOB_TYPE = "text/plain";
  23     const BLOB_SIZE = BLOB_DATA.join("").length;
  24
  25     info("Setting up");
  26
  27     let request = indexedDB.open(window.location.pathname, 1);
  28     request.onerror = errorHandler;
  29     request.onupgradeneeded = grabEventAndContinueHandler;
  30     request.onsuccess = unexpectedSuccessHandler;
  31     let event = yield undefined;
  32
  33     let db = event.target.result;
  34     db.onerror = errorHandler;
  35
  36     ok(db, "Created database");
  37
  38     info("Creating objectStore");
  39
  40     let objectStore = db.createObjectStore("foo", { autoIncrement: true });
  41
  42     request.onupgradeneeded = unexpectedSuccessHandler;
  43     request.onsuccess = grabEventAndContinueHandler;
  44     event = yield undefined;
  45
  46     ok(true, "Opened database");
  47
  48     let blob = new Blob(BLOB_DATA, { type: BLOB_TYPE });
  49
  50     info("Adding blob to database");
  51
  52     objectStore = db.transaction("foo", "readwrite").objectStore("foo");
  53     objectStore.add(blob).onsuccess = grabEventAndContinueHandler;
  54     event = yield undefined;
  55
  56     let blobKey = event.target.result;
  57     ok(blobKey, "Got a key for the blob");
  58
  59     info("Getting blob from the database");
  60
  61     objectStore = db.transaction("foo").objectStore("foo");
  62     objectStore.get(blobKey).onsuccess = grabEventAndContinueHandler;
  63     event = yield undefined;
  64
  65     blob = event.target.result;
  66
  67     ok(blob instanceof Blob, "Got a blob");
  68     is(blob.size, BLOB_SIZE, "Correct size");
  69     is(blob.type, BLOB_TYPE, "Correct type");
  70
  71     info("Sending blob to a worker");
  72
  73     function workerScript() {
  74       /* eslint-env worker */
  75       onmessage = function(event) {
  76         var blob = event.data;
  77         var slicedBlob = blob.slice(0, 3, "text/plain");
  78         var blobUrl = URL.createObjectURL(slicedBlob);
  79         var xhr = new XMLHttpRequest();
  80         xhr.open("GET", blobUrl, true);
  81         xhr.responseType = "text";
  82         xhr.onload = function() {
  83           postMessage({ data: xhr.response });
  84           URL.revokeObjectURL(blobUrl);
  85         };
  86         xhr.onerror = function() {
  87           postMessage({ data: null });
  88           URL.revokeObjectURL(blobUrl);
  89         };
  90         xhr.send();
  91       };
  92     }
  93
  94     let workerScriptUrl =
  95       URL.createObjectURL(new Blob(["(", workerScript.toString(), ")()"]));
  96
  97     let xhrWorker = new Worker(workerScriptUrl);
  98     xhrWorker.postMessage(blob);
  99     xhrWorker.onmessage = grabEventAndContinueHandler;
 100     event = yield undefined;
 101
 102     is(event.data.data, "Gre", "XHR returned expected sliced payload.");
 103     xhrWorker.terminate();
 104
 105     URL.revokeObjectURL(workerScriptUrl);
 106
 107     finishTest();
 108   }
 109   </script>
 110   <script type="text/javascript" src="helpers.js"></script>
 111
 112 </head>
 113
 114 <body onload="runTest();"></body>
 115
 116 </html>