fix recursive dem tiles loading for 404s

src/source/source_cache.js

@@ -240,15 +240,24 @@ class SourceCache extends Evented {
         if (err) {
             tile.state = 'errored';
             if ((err: any).status !== 404) this._source.fire(new ErrorEvent(err, {tile}));
-            // continue to try loading parent/children tiles if a tile doesn't exist (404)
-            else this.update(this.transform);
+            else {
+                // continue to try loading parent/children tiles if a tile doesn't exist (404)
+                const updateForTerrain = this._source.type === 'raster-dem' && this.usedForTerrain;
+                if (updateForTerrain && this.map.painter.terrain) {
+                    const terrain = this.map.painter.terrain;
+                    this.update(this.transform, terrain.getScaledDemTileSize(), true);
+                    terrain.resetTileLookupCache(this.id);
+                } else {
+                    this.update(this.transform);
+                }
+            }
             return;
         }
 
         tile.timeAdded = browser.now();
         if (previousState === 'expired') tile.refreshedUponExpiration = true;
         this._setTileReloadTimer(id, tile);
-        if (this.getSource().type === 'raster-dem' && tile.dem) this._backfillDEM(tile);
+        if (this._source.type === 'raster-dem' && tile.dem) this._backfillDEM(tile);
         this._state.initializeTileState(tile, this.map ? this.map.painter : null);
 
         this._source.fire(new Event('data', {dataType: 'source', tile, coord: tile.tileID, 'sourceCacheId': this.id}));

src/terrain/terrain.js

@@ -274,18 +274,17 @@ export class Terrain extends Elevation {
                         'This leads to lower resolution of hillshade. For full hillshade resolution but higher memory consumption, define another raster DEM source.');
                 }
                 // Lower tile zoom is sufficient for terrain, given the size of terrain grid.
-                const demScale = this.sourceCache.getSource().tileSize / GRID_DIM;
-                const proxyTileSize = this.proxySourceCache.getSource().tileSize;
+                const scaledDemTileSize = this.getScaledDemTileSize();
                 // Dem tile needs to be parent or at least of the same zoom level as proxy tile.
                 // Tile cover roundZoom behavior is set to the same as for proxy (false) in SourceCache.update().
-                this.sourceCache.update(transform, demScale * proxyTileSize, true);
+                this.sourceCache.update(transform, scaledDemTileSize, true);
                 // As a result of update, we get new set of tiles: reset lookup cache.
-                this._findCoveringTileCache[this.sourceCache.id] = {};
+                this.resetTileLookupCache(this.sourceCache.id);
             };
 
             if (!this.sourceCache.usedForTerrain) {
                 // Init cache entry.
-                this._findCoveringTileCache[this.sourceCache.id] = {};
+                this.resetTileLookupCache(this.sourceCache.id);
                 // When toggling terrain on/off load available terrain tiles from cache
                 // before reading elevation at center.
                 this.sourceCache.usedForTerrain = true;
@@ -299,7 +298,7 @@ export class Terrain extends Elevation {
             transform.updateElevation(!cameraChanging);
 
             // Reset tile lookup cache and update draped tiles coordinates.
-            this._findCoveringTileCache[this.proxySourceCache.id] = {};
+            this.resetTileLookupCache(this.proxySourceCache.id);
             this.proxySourceCache.update(transform);
 
             this._emptyDEMTextureDirty = true;
@@ -308,6 +307,16 @@ export class Terrain extends Elevation {
         }
     }
 
+    resetTileLookupCache(sourceCacheID: string) {
+        this._findCoveringTileCache[sourceCacheID] = {};
+    }
+
+    getScaledDemTileSize(): number {
+        const demScale = this.sourceCache.getSource().tileSize / GRID_DIM;
+        const proxyTileSize = this.proxySourceCache.getSource().tileSize;
+        return demScale * proxyTileSize;
+    }
+
     _checkRenderCacheEfficiency() {
         const renderCacheInfo = this.renderCacheEfficiency(this._style);
         if (this._style.map._optimizeForTerrain) {
@@ -417,7 +426,7 @@ export class Terrain extends Elevation {
         for (const id in sourceCaches) {
             const sourceCache = sourceCaches[id];
             if (!sourceCache.used) continue;
-            if (sourceCache !== this.sourceCache) this._findCoveringTileCache[sourceCache.id] = {};
+            if (sourceCache !== this.sourceCache) this.resetTileLookupCache(sourceCache.id);
             this._setupProxiedCoordsForOrtho(sourceCache, sourcesCoords[id], previousProxyToSource);
             if (sourceCache.usedForTerrain) continue;
             const coordinates = sourcesCoords[id];
@@ -1295,6 +1304,7 @@ export class Terrain extends Elevation {
         if ((tile && tile.hasData()) || key === null) return tile;
 
         assert(!key || tile);
+
         let sourceTileID = tile ? tile.tileID : tileID;
         let z = sourceTileID.overscaledZ;
         const minzoom = sourceCache.getSource().minzoom;

test/unit/source/source_cache.test.js

@@ -1772,3 +1772,74 @@ test('SourceCache sets max cache size correctly', (t) => {
 
     t.end();
 });
+
+test('SourceCache loads tiles recursively', (t) => {
+    t.test('loads parent tiles on 404', (t) => {
+        const transform = new Transform();
+        transform.resize(511, 511);
+        transform.zoom = 16;
+
+        const maxAvailableZoom = 10;
+        let loadedTiles = 0;
+
+        const {sourceCache, eventedParent} = createSourceCache({
+            maxzoom: 14,
+            loadTile (tile, callback) {
+                if (tile.tileID.canonical.z > maxAvailableZoom) {
+                    setTimeout(() => callback({status: 404}), 0);
+                } else {
+                    tile.state = 'loaded';
+                    callback(null);
+                }
+            }
+        });
+
+        eventedParent.on('data', (e) => {
+            if (e.dataType === 'source' && e.sourceDataType === 'metadata') {
+                sourceCache.update(transform);
+                return;
+            }
+
+            if (e.tile) loadedTiles++;
+            if (loadedTiles === 4) setTimeout(assert, 0);
+        });
+
+        function assert() {
+            t.deepEqual(sourceCache.getRenderableIds(), [
+                new OverscaledTileID(10, 0, 10, 512, 512).key,
+                new OverscaledTileID(10, 0, 10, 511, 512).key,
+                new OverscaledTileID(10, 0, 10, 512, 511).key,
+                new OverscaledTileID(10, 0, 10, 511, 511).key,
+            ], 'contains first renderable tiles');
+
+            t.deepEqual(sourceCache.getIds(), [
+                new OverscaledTileID(10, 0, 10, 512, 512).key,
+                new OverscaledTileID(10, 0, 10, 511, 512).key,
+                new OverscaledTileID(10, 0, 10, 512, 511).key,
+                new OverscaledTileID(10, 0, 10, 511, 511).key,
+                new OverscaledTileID(11, 0, 11, 1024, 1024).key,
+                new OverscaledTileID(11, 0, 11, 1023, 1024).key,
+                new OverscaledTileID(11, 0, 11, 1024, 1023).key,
+                new OverscaledTileID(11, 0, 11, 1023, 1023).key,
+                new OverscaledTileID(12, 0, 12, 2048, 2048).key,
+                new OverscaledTileID(12, 0, 12, 2047, 2048).key,
+                new OverscaledTileID(12, 0, 12, 2048, 2047).key,
+                new OverscaledTileID(12, 0, 12, 2047, 2047).key,
+                new OverscaledTileID(13, 0, 13, 4096, 4096).key,
+                new OverscaledTileID(13, 0, 13, 4095, 4096).key,
+                new OverscaledTileID(13, 0, 13, 4096, 4095).key,
+                new OverscaledTileID(13, 0, 13, 4095, 4095).key,
+                new OverscaledTileID(14, 0, 14, 8192, 8192).key,
+                new OverscaledTileID(14, 0, 14, 8191, 8192).key,
+                new OverscaledTileID(14, 0, 14, 8192, 8191).key,
+                new OverscaledTileID(14, 0, 14, 8191, 8191).key,
+            ], 'recursively loads parent tiles if current tiles not found');
+
+            t.end();
+        }
+
+        sourceCache.getSource().onAdd();
+    });
+
+    t.end();
+});

test/unit/terrain/terrain.test.js

@@ -1544,3 +1544,63 @@ test('terrain getBounds', (t) => {
 
 });
 
+test('terrain recursively loads parent tiles on 404', (t) => {
+    t.plan(2);
+
+    const style = createStyle();
+    const map = createMap(t, {style, center: [0, 0], zoom: 16});
+
+    map.once('style.load', () => {
+        map.addSource('mapbox-dem', {
+            'type': 'raster-dem',
+            'tiles': ['http://example.com/{z}/{x}/{y}.png'],
+            'tileSize': TILE_SIZE,
+            'maxzoom': 14
+        });
+
+        const cache = map.style._getSourceCache('mapbox-dem');
+        cache.used = cache._sourceLoaded = true;
+        cache._loadTile = (tile, callback) => {
+            if (tile.tileID.canonical.z > 10) {
+                setTimeout(() => callback({status: 404}), 0);
+            } else {
+                tile.state = 'loaded';
+                callback(null);
+            }
+        };
+
+        map.setTerrain({'source': 'mapbox-dem'});
+
+        map.once('idle', () => {
+            t.deepEqual(cache.getRenderableIds(), [
+                new OverscaledTileID(10, 0, 10, 512, 512).key,
+                new OverscaledTileID(10, 0, 10, 511, 512).key,
+                new OverscaledTileID(10, 0, 10, 512, 511).key,
+                new OverscaledTileID(10, 0, 10, 511, 511).key,
+            ], 'contains first renderable tiles');
+
+            t.deepEqual(cache.getIds(), [
+                new OverscaledTileID(10, 0, 10, 512, 512).key,
+                new OverscaledTileID(10, 0, 10, 511, 512).key,
+                new OverscaledTileID(10, 0, 10, 512, 511).key,
+                new OverscaledTileID(10, 0, 10, 511, 511).key,
+                new OverscaledTileID(11, 0, 11, 1024, 1024).key,
+                new OverscaledTileID(11, 0, 11, 1023, 1024).key,
+                new OverscaledTileID(11, 0, 11, 1024, 1023).key,
+                new OverscaledTileID(11, 0, 11, 1023, 1023).key,
+                new OverscaledTileID(12, 0, 12, 2048, 2048).key,
+                new OverscaledTileID(12, 0, 12, 2047, 2048).key,
+                new OverscaledTileID(12, 0, 12, 2048, 2047).key,
+                new OverscaledTileID(12, 0, 12, 2047, 2047).key,
+                new OverscaledTileID(13, 0, 13, 4096, 4096).key,
+                new OverscaledTileID(13, 0, 13, 4095, 4096).key,
+                new OverscaledTileID(13, 0, 13, 4096, 4095).key,
+                new OverscaledTileID(13, 0, 13, 4095, 4095).key,
+                new OverscaledTileID(14, 0, 14, 8192, 8192).key,
+                new OverscaledTileID(14, 0, 14, 8191, 8192).key,
+                new OverscaledTileID(14, 0, 14, 8192, 8191).key,
+                new OverscaledTileID(14, 0, 14, 8191, 8191).key,
+            ], 'recursively loads parent tiles if current tiles not found');
+        });
+    });
+});