Make TileGrid behave as documented with extent and sizes options

src/ol/tilecoord.js

@@ -76,13 +76,7 @@ export function withinExtentAndZ(tileCoord, tileGrid) {
   if (tileGrid.getMinZoom() > z || z > tileGrid.getMaxZoom()) {
     return false;
   }
-  const extent = tileGrid.getExtent();
+  const tileRange = tileGrid.getFullTileRange(z);
-  let tileRange;
-  if (!extent) {
-    tileRange = tileGrid.getFullTileRange(z);
-  } else {
-    tileRange = tileGrid.getTileRangeForExtentAndZ(extent, z);
-  }
   if (!tileRange) {
     return true;
   } else {

src/ol/tilegrid/TileGrid.js

@@ -188,6 +188,13 @@ class TileGrid {
           Math.min(0, size[1]),
           Math.max(size[1] - 1, -1)
         );
+        if (extent) {
+          const restrictedTileRange = this.getTileRangeForExtentAndZ(extent, z);
+          tileRange.minX = Math.max(restrictedTileRange.minX, tileRange.minX);
+          tileRange.maxX = Math.min(restrictedTileRange.maxX, tileRange.maxX);
+          tileRange.minY = Math.max(restrictedTileRange.minY, tileRange.minY);
+          tileRange.maxY = Math.min(restrictedTileRange.maxY, tileRange.maxY);
+        }
         return tileRange;
       }, this);
     } else if (extent) {
@@ -566,7 +573,9 @@ class TileGrid {
    */
   getFullTileRange(z) {
     if (!this.fullTileRanges_) {
-      return null;
+      return this.extent_
+        ? this.getTileRangeForExtentAndZ(this.extent_, z)
+        : null;
     } else {
       return this.fullTileRanges_[z];
     }

test/spec/ol/tilecoord.test.js

@@ -57,7 +57,7 @@ describe('ol.TileCoord', function () {
     it('restricts by extent when extent defines tile ranges', function () {
       const tileGrid = new TileGrid({
         extent: [10, 20, 30, 40],
-        sizes: [[3, -3]],
+        sizes: [[3, 3]],
         tileSize: 10,
         resolutions: [1],
       });

test/spec/ol/tilegrid/tilegrid.test.js

@@ -210,6 +210,26 @@ describe('ol.tilegrid.TileGrid', function () {
     });
   });
 
+  describe('create with sizes', function () {
+    let tileGrid;
+    beforeEach(function () {
+      tileGrid = new TileGrid({
+        origin: [10, 40],
+        sizes: [[3, 3]],
+        tileSize: 10,
+        resolutions: [1],
+      });
+    });
+
+    it('calculates full tile ranges from sizes', function () {
+      const fullTileRange = tileGrid.getFullTileRange(0);
+      expect(fullTileRange.minX).to.equal(0);
+      expect(fullTileRange.maxX).to.equal(2);
+      expect(fullTileRange.minY).to.equal(0);
+      expect(fullTileRange.maxY).to.equal(2);
+    });
+  });
+
   describe('create with extent and sizes', function () {
     let tileGrid;
     beforeEach(function () {
@@ -225,12 +245,31 @@ describe('ol.tilegrid.TileGrid', function () {
       expect(tileGrid.getExtent()).to.eql([10, 20, 30, 40]);
     });
 
-    it('calculates full tile ranges from sizes', function () {
+    it('calculates full tile ranges from sizes, further limited by extent', function () {
       const fullTileRange = tileGrid.getFullTileRange(0);
       expect(fullTileRange.minX).to.equal(0);
-      expect(fullTileRange.maxX).to.equal(2);
+      expect(fullTileRange.maxX).to.equal(1);
       expect(fullTileRange.minY).to.equal(0);
-      expect(fullTileRange.maxY).to.equal(2);
+      expect(fullTileRange.maxY).to.equal(1);
+    });
+  });
+
+  describe('create with extent', function () {
+    let tileGrid;
+    beforeEach(function () {
+      tileGrid = new TileGrid({
+        extent: [10, 20, 30, 40],
+        tileSize: 10,
+        resolutions: [1],
+      });
+    });
+
+    it('calculates full tile ranges from extent', function () {
+      const fullTileRange = tileGrid.getFullTileRange(0);
+      expect(fullTileRange.minX).to.equal(0);
+      expect(fullTileRange.maxX).to.equal(1);
+      expect(fullTileRange.minY).to.equal(0);
+      expect(fullTileRange.maxY).to.equal(1);
     });
   });