Lazily create interim tiles (fixes most tests)

src/ol/VectorImageTile.js

@@ -103,8 +103,6 @@ class VectorImageTile extends Tile {
      */
     this.sourceTileListenerKeys_ = [];
 
-    this.sourceTilesLoaded = false;
-
     /**
      * Use only source tiles that are loaded already
      * @type {boolean}
@@ -150,35 +148,44 @@ class VectorImageTile extends Tile {
         this.finishLoading_();
       }
 
-      if (!this.sourceTilesLoaded && !useLoadedOnly) {
+      this.createInterimTile_ = function() {
-        let bestZoom = -1;
+        if (this.getState() !== TileState.LOADED && !useLoadedOnly) {
-        for (const key in sourceTiles) {
+          let bestZoom = -1;
-          const sourceTile = sourceTiles[key];
+          for (const key in sourceTiles) {
-          if (sourceTile.getState() === TileState.LOADED) {
+            const sourceTile = sourceTiles[key];
-            const sourceTileCoord = sourceTile.tileCoord;
+            if (sourceTile.getState() === TileState.LOADED) {
-            const sourceTileExtent = sourceTileGrid.getTileCoordExtent(sourceTileCoord);
+              const sourceTileCoord = sourceTile.tileCoord;
-            if (containsExtent(sourceTileExtent, extent) && sourceTileCoord[0] > bestZoom) {
+              const sourceTileExtent = sourceTileGrid.getTileCoordExtent(sourceTileCoord);
-              bestZoom = sourceTileCoord[0];
+              if (containsExtent(sourceTileExtent, extent) && sourceTileCoord[0] > bestZoom) {
+                bestZoom = sourceTileCoord[0];
+              }
             }
           }
-        }
+          if (bestZoom !== -1) {
-        if (bestZoom !== -1) {
+            const tile = new VectorImageTile(tileCoord, state, sourceRevision,
-          const tile = new VectorImageTile(tileCoord, state, sourceRevision,
+              format, tileLoadFunction, urlTileCoord, tileUrlFunction,
-            format, tileLoadFunction, urlTileCoord, tileUrlFunction,
+              sourceTileGrid, tileGrid, sourceTiles, pixelRatio, projection,
-            sourceTileGrid, tileGrid, sourceTiles, pixelRatio, projection,
+              tileClass, VOID, bestZoom);
-            tileClass, VOID, bestZoom);
+            this.interimTile = tile;
-          this.interimTile = tile;
+          }
         }  
       }
     }
 
   }
 
+  getInterimTile() {
+    if (!this.interimTile) {
+      this.createInterimTile_();
+    }
+    return super.getInterimTile();
+  }
+
   /**
    * @inheritDoc
    */
   disposeInternal() {
-    this.getInterimTile = super.getInterimTile;
+    delete this.createInterimTile_;
     this.state = TileState.ABORT;
     this.changed();
     if (this.interimTile) {

test/spec/ol/renderer/canvas/vectortilelayer.test.js

@@ -75,6 +75,7 @@ describe('ol.renderer.canvas.VectorTileLayer', function() {
         tileGrid: createXYZ()
       });
       source.getTile = function() {
+        arguments[1] = TileState.LOADED;
         const tile = VectorTileSource.prototype.getTile.apply(source, arguments);
         tile.setState(TileState.LOADED);
         return tile;
@@ -106,7 +107,7 @@ describe('ol.renderer.canvas.VectorTileLayer', function() {
       map.removeLayer(layer);
       map.addLayer(testLayer);
       const spy = sinon.spy(CanvasVectorTileLayerRenderer.prototype,
-        'getTransform');
+        'getRenderTransform');
       map.renderSync();
       expect(spy.callCount).to.be(0);
       spy.restore();
@@ -114,7 +115,7 @@ describe('ol.renderer.canvas.VectorTileLayer', function() {
 
     it('renders both replays and images for hybrid rendering', function() {
       const spy1 = sinon.spy(CanvasVectorTileLayerRenderer.prototype,
-        'getTransform');
+        'getRenderTransform');
       const spy2 = sinon.spy(CanvasVectorTileLayerRenderer.prototype,
         'renderTileImage_');
       map.renderSync();
@@ -129,7 +130,7 @@ describe('ol.renderer.canvas.VectorTileLayer', function() {
         renderer: function() {}
       }));
       const spy = sinon.spy(CanvasVectorTileLayerRenderer.prototype,
-        'getTransform');
+        'getRenderTransform');
       map.renderSync();
       expect(spy.callCount).to.be(1);
       spy.restore();