Fix crash and improve tests..

src/tiledimage.js

@@ -1329,13 +1329,11 @@ function compareTiles( previousBest, tile ) {
 }
 
 function drawTiles( tiledImage, lastDrawn ) {
-    var i,
+    if (lastDrawn.length === 0) {
-        tile = lastDrawn[0];
-
-    if ( tiledImage.opacity <= 0 ) {
-        drawDebugInfo( tiledImage, lastDrawn );
         return;
     }
+    var tile = lastDrawn[0];
+
     var useSketch = tiledImage.opacity < 1 ||
         (tiledImage.compositeOperation &&
             tiledImage.compositeOperation !== 'source-over') ||
@@ -1346,7 +1344,7 @@ function drawTiles( tiledImage, lastDrawn ) {
 
     var zoom = tiledImage.viewport.getZoom(true);
     var imageZoom = tiledImage.viewportToImageZoom(zoom);
-    if (imageZoom > tiledImage.smoothTileEdgesMinZoom && tile) {
+    if (imageZoom > tiledImage.smoothTileEdgesMinZoom) {
         // When zoomed in a lot (>100%) the tile edges are visible.
         // So we have to composite them at ~100% and scale them up together.
         useSketch = true;
@@ -1403,7 +1401,7 @@ function drawTiles( tiledImage, lastDrawn ) {
         tiledImage._drawer.drawRectangle(placeholderRect, fillStyle, useSketch);
     }
 
-    for ( i = lastDrawn.length - 1; i >= 0; i-- ) {
+    for (var i = lastDrawn.length - 1; i >= 0; i--) {
         tile = lastDrawn[ i ];
         tiledImage._drawer.drawTile( tile, tiledImage._drawingHandler, useSketch, sketchScale, sketchTranslate );
         tile.beingDrawn = true;

test/modules/multi-image.js

@@ -214,7 +214,13 @@
         // TODO: replace with fully-loaded event listener when available.
         setTimeout(function() {
             var imageData = viewer.drawer.context.getImageData(0, 0, 500, 500);
-            var expectedVal = getPixelValue(imageData, 333, 250);
+            // Pixel 250,250 will be in the hole of the A
+            var expectedVal = getPixelValue(imageData, 250, 250);
+
+            notEqual(expectedVal.r, 0, 'Red channel should not be 0');
+            notEqual(expectedVal.g, 0, 'Green channel should not be 0');
+            notEqual(expectedVal.b, 0, 'Blue channel should not be 0');
+            notEqual(expectedVal.a, 0, 'Alpha channel should not be 0');
 
             viewer.addSimpleImage({
                 url: '/test/data/A.png'
@@ -223,23 +229,29 @@
             // TODO: replace with fully-loaded event listener when available.
             setTimeout(function() {
                 var imageData = viewer.drawer.context.getImageData(0, 0, 500, 500);
-                var actualVal = getPixelValue(imageData, 333, 250);
+                var actualVal = getPixelValue(imageData, 250, 250);
 
                 equal(actualVal.r, expectedVal.r,
-                    'Red channel should not change when stacking a transparent image');
+                    'Red channel should not change in transparent part of the A');
                 equal(actualVal.g, expectedVal.g,
-                    'Green channel should not change when stacking a transparent image');
+                    'Green channel should not change in transparent part of the A');
                 equal(actualVal.b, expectedVal.b,
-                    'Blue channel should not change when stacking a transparent image');
+                    'Blue channel should not change in transparent part of the A');
                 equal(actualVal.a, expectedVal.a,
-                    'Alpha channel should not change when stacking a transparent image');
+                    'Alpha channel should not change in transparent part of the A');
+
+                var onAVal = getPixelValue(imageData, 333, 250);
+                equal(onAVal.r, 0, 'Red channel should be null on the A');
+                equal(onAVal.g, 0, 'Green channel should be null on the A');
+                equal(onAVal.b, 0, 'Blue channel should be null on the A');
+                equal(onAVal.a, 255, 'Alpha channel should be 255 on the A');
 
                 start();
-            }, 1000);
+            }, 500);
-        }, 1000);
+        }, 500);
 
         function getPixelValue(imageData, x, y) {
-            var offset = x * imageData.width + y;
+            var offset = 4 * (y * imageData.width + x);
             return {
                 r: imageData.data[offset],
                 g: imageData.data[offset + 1],