<!DOCTYPE html>
<!--
 | Cleaning up an image after successfully loading it.
 -->
<html>

<head>
  <title>image-cleanup</title>
  <style>
    div {
      width: 500px;
      height: 400px;
      background-color: blue;
    }
  </style>
</head>

<body>
  <div id='image'></div>
  <script>
    if (window.testRunner) {
      window.testRunner.waitUntilDone();
    }

    // Image blob to load.
    var image_array = new Uint8Array([
      137, 80, 78, 71, 13, 10, 26, 10, 0, 0, 0, 13, 73, 72, 68, 82, 0, 0, 0,
      6, 0, 0, 0, 6, 8, 2, 0, 0, 0, 111, 174, 120, 31, 0, 0, 0, 3, 115, 66,
      73, 84, 8, 8, 8, 219, 225, 79, 224, 0, 0, 0, 25, 116, 69, 88, 116, 83,
      111, 102, 116, 119, 97, 114, 101, 0, 103, 110, 111, 109, 101, 45, 115,
      99, 114, 101, 101, 110, 115, 104, 111, 116, 239, 3, 191, 62, 0, 0, 0,
      36, 73, 68, 65, 84, 8, 153, 99, 252, 80, 238, 198, 128, 10, 88, 24, 24,
      24, 154, 119, 190, 132, 243, 107, 221, 197, 153, 24, 48, 0, 113, 66,
      140, 152, 198, 3, 0, 225, 21, 6, 103, 179, 203, 171, 64, 0, 0, 0, 0,
      73, 69, 78, 68, 174, 66, 96, 130]);
    var image_blob = new Blob([image_array.buffer]);
    var image_url = URL.createObjectURL(image_blob);

    var loaded = false;
    var cleaned = true;
    var image = new Image(); // HTMLImageElement
    var cobalt = document.getElementById('image');

    image.onload = function () {
      loaded = true;
      cobalt.style.background = 'url(' + image_url + ') no-repeat';
      // After loading the image wait a little bit then remove the src attribute.
      setTimeout(function () {
        image.removeAttribute('src');
      }, 100);
    }

    image.onerror = function () {
      cleaned = false;
    }

    image.src = image_url;

    // Conclude the test based on the current state.
    setTimeout(function () {
      if (loaded && cleaned) {
        reportSuccess();
      } else {
        reportError();
      }
    }, 500);

    function reportSuccess() {
      endTest();
    }

    function reportError() {
      console.error('test failed: loaded=' + loaded + ', cleaned=' + cleaned);
      endTest();
    }
    function endTest() {
      if (window.testRunner) {
        window.testRunner.notifyDone();
      }
    }
  </script>
</body>

</html>