Add new dragzoom test with view rotation

Also adds a new test for the duration and removes the duration from
the other tests to save on execution time.
This commit is contained in:
Maximilian Krög
2021-05-08 03:35:32 +02:00
parent c19664b6f5
commit b89809c1a1

View File

@@ -1,14 +1,21 @@
import DragZoom from '../../../../../src/ol/interaction/DragZoom.js';
import Map from '../../../../../src/ol/Map.js';
import Polygon, {
fromExtent as polygonFromExtent,
} from '../../../../../src/ol/geom/Polygon.js';
import RenderBox from '../../../../../src/ol/render/Box.js';
import VectorLayer from '../../../../../src/ol/layer/Vector.js';
import VectorSource from '../../../../../src/ol/source/Vector.js';
import View from '../../../../../src/ol/View.js';
import {getCenter} from '../../../../../src/ol/extent.js';
import {fromExtent as polygonFromExtent} from '../../../../../src/ol/geom/Polygon.js';
import {getCenter, scaleFromCenter} from '../../../../../src/ol/extent.js';
describe('ol.interaction.DragZoom', function () {
let target, map, source;
/** @type {HTMLElement} */
let target;
/** @type {Map} */
let map;
/** @type {VectorSource} */
let source;
const width = 360;
const height = 180;
@@ -31,6 +38,7 @@ describe('ol.interaction.DragZoom', function () {
projection: 'EPSG:4326',
center: [0, 0],
resolution: 1,
multiWorld: true,
}),
});
map.once('postrender', function () {
@@ -59,9 +67,27 @@ describe('ol.interaction.DragZoom', function () {
});
describe('#onBoxEnd()', function () {
it('centers the view on the box geometry', function (done) {
it('uses the configured duration', function () {
const interaction = new DragZoom({
duration: 10,
duration: 1,
});
map.addInteraction(interaction);
const view = map.getView();
view.fitInternal = sinon.spy();
const box = new RenderBox();
const extent = [-110, 40, -90, 60];
box.geometry_ = polygonFromExtent(extent);
interaction.box_ = box;
interaction.onBoxEnd();
expect(view.fitInternal.calledOnce).to.be(true);
expect(view.fitInternal.args[0][1].duration).to.be(1);
});
it('centers the view on the box geometry', function () {
const interaction = new DragZoom({
duration: 0,
});
map.addInteraction(interaction);
@@ -71,19 +97,47 @@ describe('ol.interaction.DragZoom', function () {
interaction.box_ = box;
interaction.onBoxEnd();
setTimeout(function () {
const view = map.getView();
const center = view.getCenterInternal();
expect(center).to.eql(getCenter(extent));
done();
}, 50);
const view = map.getView();
const center = view.getCenterInternal();
expect(center).to.eql(getCenter(extent));
});
it('centers the view with padding on the box geometry', function (done) {
it('centers the rotated view on the box geometry', function () {
const view = map.getView();
view.setRotation(Math.PI / 4);
const interaction = new DragZoom({
duration: 0,
});
map.addInteraction(interaction);
const box = new RenderBox();
map.renderSync();
box.geometry_ = new Polygon([
[
map.getCoordinateFromPixel([0, 0]),
map.getCoordinateFromPixel([360, 0]),
map.getCoordinateFromPixel([360, 180]),
map.getCoordinateFromPixel([0, 180]),
map.getCoordinateFromPixel([0, 0]),
],
]);
interaction.box_ = box;
const extentBefore = view.calculateExtentInternal();
interaction.onBoxEnd();
const newExtent = view.calculateExtentInternal();
expect(newExtent[0]).to.roughlyEqual(extentBefore[0], 1e-9);
expect(newExtent[1]).to.roughlyEqual(extentBefore[1], 1e-9);
expect(newExtent[2]).to.roughlyEqual(extentBefore[2], 1e-9);
expect(newExtent[3]).to.roughlyEqual(extentBefore[3], 1e-9);
expect(view.getResolution()).to.roughlyEqual(1, 1e-9);
});
it('centers the padded view on the box geometry', function () {
map.getView().padding = [0, 180, 0, 0];
const interaction = new DragZoom({
duration: 10,
duration: 0,
});
map.addInteraction(interaction);
@@ -93,16 +147,13 @@ describe('ol.interaction.DragZoom', function () {
interaction.box_ = box;
interaction.onBoxEnd();
setTimeout(function () {
const view = map.getView();
expect(view.getResolution()).to.be(1);
expect(view.calculateExtentInternal()).to.eql(extent);
done();
}, 50);
const view = map.getView();
expect(view.getResolution()).to.be(1);
expect(view.calculateExtentInternal()).to.eql(extent);
});
it('sets new resolution while zooming out', function (done) {
it('sets new resolution while zooming out', function () {
const interaction = new DragZoom({
duration: 10,
duration: 0,
out: true,
});
map.addInteraction(interaction);
@@ -113,15 +164,45 @@ describe('ol.interaction.DragZoom', function () {
interaction.box_ = box;
map.getView().setResolution(0.25);
setTimeout(function () {
interaction.onBoxEnd();
setTimeout(function () {
const view = map.getView();
const resolution = view.getResolution();
expect(resolution).to.eql(view.getConstrainedResolution(0.5));
done();
}, 50);
}, 50);
interaction.onBoxEnd();
const view = map.getView();
const resolution = view.getResolution();
expect(resolution).to.eql(view.getConstrainedResolution(0.5));
});
it('sets new resolution while zooming out with view padding and rotation', function () {
const view = map.getView();
view.setResolution(0.5);
view.setRotation(Math.PI / 4);
view.padding = [90, 0, 0, 0];
const interaction = new DragZoom({
duration: 0,
out: true,
});
map.addInteraction(interaction);
const box = new RenderBox();
map.renderSync();
box.geometry_ = new Polygon([
[
map.getCoordinateFromPixel([90, 117.5]),
map.getCoordinateFromPixel([90, 152.5]),
map.getCoordinateFromPixel([270, 152.5]),
map.getCoordinateFromPixel([270, 117.5]),
map.getCoordinateFromPixel([90, 117.5]),
],
]);
interaction.box_ = box;
const expected = view.calculateExtentInternal();
scaleFromCenter(expected, 2);
interaction.onBoxEnd();
const newExtent = view.calculateExtentInternal();
expect(view.getResolution()).to.roughlyEqual(1, 1e-9);
expect(newExtent[0]).to.roughlyEqual(expected[0], 1e-9);
expect(newExtent[1]).to.roughlyEqual(expected[1], 1e-9);
expect(newExtent[2]).to.roughlyEqual(expected[2], 1e-9);
expect(newExtent[3]).to.roughlyEqual(expected[3], 1e-9);
});
});
});