title: How to load images with chained Promises
body: <p>I'm having trouble loading images with a script of chained promises - they turn up undefined by the end. I also have a 404 error I don't quite understand as I've confirmed that all the sources are valid, but admit I'm still a noob to debugging in an async context. <strong>Here is the <a href="https://jsfiddle.net/gromiczek/hz7rmnbc/" rel="nofollow">fiddle</a> in question</strong>. I've been chewing on this one for a couple days now and could use a nudge or two to get me headed in the right direction. I think this may be the problem area:</p>
  
  <pre><code>function loadImagePromises() {
      var imageLoadPromises = [];
      for ( var i  = 0; i &lt; sources.length; i++ ) {
          imageLoadPromises.push( 
              imgLoad( sources[i] ).then(function(response) {
                  var myImage = new Image();
                  myImage.src = response; // response is a blob
              }, function(Error) {
                  console.log("There was an error when the image was loaded after download: " + Error);
              }) );
      }
      console.log( imageLoadPromises );
      return imageLoadPromises;
  }
  </code></pre>
  
  <p>As context, I'm writing an image loader script using promises for a Three.js program I have. No need to load the images to the DOM - I'll use them later as textures in a WebGL visualization.</p>
  
  <p><em>NOTE:</em>
  Here's an earlier and simpler <a href="https://jsfiddle.net/gromiczek/zfoorxcq/" rel="nofollow">fiddle</a> working end-to-end and outputting to the DOM.</p>