ashatora/openlayers
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Make code prettier

Browse Source 
This updates ESLint and our shared eslint-config-openlayers to use Prettier.  Most formatting changes were automatically applied with this:

    npm run lint -- --fix

A few manual changes were required:

 * In `examples/offscreen-canvas.js`, the `//eslint-disable-line` comment needed to be moved to the appropriate line to disable the error about the `'worker-loader!./offscreen-canvas.worker.js'` import.
 * In `examples/webpack/exapmle-builder.js`, spaces could not be added after a couple `function`s for some reason.  While editing this, I reworked `ExampleBuilder` to be a class.
 * In `src/ol/format/WMSGetFeatureInfo.js`, the `// @ts-ignore` comment needed to be moved down one line so it applied to the `parsersNS` argument.
This commit is contained in:
Tim Schaub
2020-04-06 12:25:12 -06:00
parent 53b48baf62
commit 054af09032
790 changed files with 46833 additions and 33765 deletions
Download Patch File Download Diff File Expand all files Collapse all files

363
test/spec/ol/renderer/canvas/vectorlayer.test.js
View File

@@ -1,27 +1,28 @@
import Feature from '../../../../../src/ol/Feature.js';
import Map from '../../../../../src/ol/Map.js';
import View from '../../../../../src/ol/View.js';
import {buffer as bufferExtent, getWidth, getCenter} from '../../../../../src/ol/extent.js';
import Circle from '../../../../../src/ol/geom/Circle.js';
import Point from '../../../../../src/ol/geom/Point.js';
import {fromExtent} from '../../../../../src/ol/geom/Polygon.js';
import VectorLayer from '../../../../../src/ol/layer/Vector.js';
import {bbox as bboxStrategy} from '../../../../../src/ol/loadingstrategy.js';
import {get as getProjection} from '../../../../../src/ol/proj.js';
import {checkedFonts} from '../../../../../src/ol/render/canvas.js';
import CanvasVectorLayerRenderer from '../../../../../src/ol/renderer/canvas/VectorLayer.js';
import VectorSource from '../../../../../src/ol/source/Vector.js';
import Circle from '../../../../../src/ol/geom/Circle.js';
import CircleStyle from '../../../../../src/ol/style/Circle.js';
import Feature from '../../../../../src/ol/Feature.js';
import Fill from '../../../../../src/ol/style/Fill.js';
import Map from '../../../../../src/ol/Map.js';
import Point from '../../../../../src/ol/geom/Point.js';
import Stroke from '../../../../../src/ol/style/Stroke.js';
import Style from '../../../../../src/ol/style/Style.js';
import Text from '../../../../../src/ol/style/Text.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 {bbox as bboxStrategy} from '../../../../../src/ol/loadingstrategy.js';
import {
buffer as bufferExtent,
getCenter,
getWidth,
} from '../../../../../src/ol/extent.js';
import {checkedFonts} from '../../../../../src/ol/render/canvas.js';
import {fromExtent} from '../../../../../src/ol/geom/Polygon.js';
import {get as getProjection} from '../../../../../src/ol/proj.js';
describe('ol.renderer.canvas.VectorLayer', function() {
describe('constructor', function() {
describe('ol.renderer.canvas.VectorLayer', function () {
describe('constructor', function () {
const head = document.getElementsByTagName('head')[0];
const font = document.createElement('link');
font.href = 'https://fonts.googleapis.com/css?family=Droid+Sans';
@@ -29,26 +30,26 @@ describe('ol.renderer.canvas.VectorLayer', function() {
let target;
beforeEach(function() {
beforeEach(function () {
target = document.createElement('div');
target.style.width = '256px';
target.style.height = '256px';
document.body.appendChild(target);
});
afterEach(function() {
afterEach(function () {
document.body.removeChild(target);
});
it('creates a new instance', function() {
it('creates a new instance', function () {
const layer = new VectorLayer({
source: new VectorSource()
source: new VectorSource(),
});
const renderer = new CanvasVectorLayerRenderer(layer);
expect(renderer).to.be.a(CanvasVectorLayerRenderer);
});
it('gives precedence to feature styles over layer styles', function() {
it('gives precedence to feature styles over layer styles', function () {
const target = document.createElement('div');
target.style.width = '256px';
target.style.height = '256px';
@@ -56,28 +57,32 @@ describe('ol.renderer.canvas.VectorLayer', function() {
const map = new Map({
view: new View({
center: [0, 0],
zoom: 0
zoom: 0,
}),
target: target
target: target,
});
const layerStyle = [new Style({
text: new Text({
text: 'layer'
})
})];
const featureStyle = [new Style({
text: new Text({
text: 'feature'
})
})];
const layerStyle = [
new Style({
text: new Text({
text: 'layer',
}),
}),
];
const featureStyle = [
new Style({
text: new Text({
text: 'feature',
}),
}),
];
const feature1 = new Feature(new Point([0, 0]));
const feature2 = new Feature(new Point([0, 0]));
feature2.setStyle(featureStyle);
const layer = new VectorLayer({
source: new VectorSource({
features: [feature1, feature2]
features: [feature1, feature2],
}),
style: layerStyle
style: layerStyle,
});
map.addLayer(layer);
const spy = sinon.spy(layer.getRenderer(), 'renderFeature');
@@ -87,122 +92,126 @@ describe('ol.renderer.canvas.VectorLayer', function() {
document.body.removeChild(target);
});
it('does not re-render for unavailable fonts', function(done) {
it('does not re-render for unavailable fonts', function (done) {
checkedFonts.values_ = {};
const map = new Map({
view: new View({
center: [0, 0],
zoom: 0
zoom: 0,
}),
target: target
target: target,
});
const layerStyle = new Style({
text: new Text({
text: 'layer',
font: '12px "Unavailable Font",sans-serif'
})
font: '12px "Unavailable Font",sans-serif',
}),
});
const feature = new Feature(new Point([0, 0]));
const layer = new VectorLayer({
source: new VectorSource({
features: [feature]
features: [feature],
}),
style: layerStyle
style: layerStyle,
});
map.addLayer(layer);
const revision = layer.getRevision();
setTimeout(function() {
setTimeout(function () {
expect(layer.getRevision()).to.be(revision);
done();
}, 800);
});
it('does not re-render for available fonts', function(done) {
it('does not re-render for available fonts', function (done) {
checkedFonts.values_ = {};
const map = new Map({
view: new View({
center: [0, 0],
zoom: 0
zoom: 0,
}),
target: target
target: target,
});
const layerStyle = new Style({
text: new Text({
text: 'layer',
font: '12px sans-serif'
})
font: '12px sans-serif',
}),
});
const feature = new Feature(new Point([0, 0]));
const layer = new VectorLayer({
source: new VectorSource({
features: [feature]
features: [feature],
}),
style: layerStyle
style: layerStyle,
});
map.addLayer(layer);
const revision = layer.getRevision();
setTimeout(function() {
setTimeout(function () {
expect(layer.getRevision()).to.be(revision);
done();
}, 800);
});
it('re-renders for fonts that become available', function(done) {
it('re-renders for fonts that become available', function (done) {
checkedFonts.values_ = {};
head.appendChild(font);
const map = new Map({
view: new View({
center: [0, 0],
zoom: 0
zoom: 0,
}),
target: target
target: target,
});
const layerStyle = new Style({
text: new Text({
text: 'layer',
font: '12px "Droid Sans",sans-serif'
})
font: '12px "Droid Sans",sans-serif',
}),
});
const feature = new Feature(new Point([0, 0]));
const layer = new VectorLayer({
source: new VectorSource({
features: [feature]
features: [feature],
}),
style: layerStyle
style: layerStyle,
});
map.addLayer(layer);
const revision = layer.getRevision();
setTimeout(function() {
setTimeout(function () {
expect(layer.getRevision()).to.be(revision + 1);
head.removeChild(font);
done();
}, 1600);
});
});
describe('#forEachFeatureAtCoordinate', function() {
describe('#forEachFeatureAtCoordinate', function () {
let layer, renderer;
beforeEach(function() {
beforeEach(function () {
layer = new VectorLayer({
source: new VectorSource()
source: new VectorSource(),
});
renderer = new CanvasVectorLayerRenderer(layer);
const replayGroup = {};
renderer.replayGroup_ = replayGroup;
replayGroup.forEachFeatureAtCoordinate = function(coordinate,
resolution, rotation, hitTolerance, callback) {
replayGroup.forEachFeatureAtCoordinate = function (
coordinate,
resolution,
rotation,
hitTolerance,
callback
) {
const feature = new Feature();
callback(feature);
callback(feature);
};
});
it('calls callback once per feature with a layer as 2nd arg', function() {
it('calls callback once per feature with a layer as 2nd arg', function () {
const spy = sinon.spy();
const coordinate = [0, 0];
const frameState = {
@@ -210,30 +219,35 @@ describe('ol.renderer.canvas.VectorLayer', function() {
viewState: {
center: [0, 0],
resolution: 1,
rotation: 0
}
rotation: 0,
},
};
renderer.forEachFeatureAtCoordinate(
coordinate, frameState, 0, spy, undefined);
coordinate,
frameState,
0,
spy,
undefined
);
expect(spy.callCount).to.be(1);
expect(spy.getCall(0).args[1]).to.equal(layer);
});
});
describe('#prepareFrame and #compose', function() {
describe('#prepareFrame and #compose', function () {
let frameState, projExtent, renderer, worldWidth, buffer, loadExtents;
function loader(extent) {
loadExtents.push(extent);
}
beforeEach(function() {
beforeEach(function () {
const layer = new VectorLayer({
source: new VectorSource({
wrapX: true,
loader: loader,
strategy: bboxStrategy
})
strategy: bboxStrategy,
}),
});
renderer = new CanvasVectorLayerRenderer(layer);
const projection = getProjection('EPSG:3857');
@@ -246,8 +260,8 @@ describe('ol.renderer.canvas.VectorLayer', function() {
viewState: {
projection: projection,
resolution: 1,
rotation: 0
}
rotation: 0,
},
};
});
@@ -256,75 +270,128 @@ describe('ol.renderer.canvas.VectorLayer', function() {
frameState.viewState.center = getCenter(extent);
}
it('sets correct extent for small viewport near dateline', function() {
it('sets correct extent for small viewport near dateline', function () {
setExtent([projExtent[0] - 10000, -10000, projExtent[0] + 10000, 10000]);
renderer.prepareFrame(frameState);
expect(renderer.replayGroup_.maxExtent_).to.eql(bufferExtent([
projExtent[0] - worldWidth + buffer,
-10000, projExtent[2] + worldWidth - buffer, 10000
], buffer));
expect(renderer.replayGroup_.maxExtent_).to.eql(
bufferExtent(
[
projExtent[0] - worldWidth + buffer,
-10000,
projExtent[2] + worldWidth - buffer,
10000,
],
buffer
)
);
expect(loadExtents.length).to.be(2);
expect(loadExtents[0]).to.eql(bufferExtent(frameState.extent, buffer));
const otherExtent = [projExtent[2] - 10000, -10000, projExtent[2] + 10000, 10000];
const otherExtent = [
projExtent[2] - 10000,
-10000,
projExtent[2] + 10000,
10000,
];
expect(loadExtents[1]).to.eql(bufferExtent(otherExtent, buffer));
});
it('sets correct extent for viewport less than 1 world wide', function() {
it('sets correct extent for viewport less than 1 world wide', function () {
setExtent([projExtent[0] - 10000, -10000, projExtent[2] - 10000, 10000]);
renderer.prepareFrame(frameState);
expect(renderer.replayGroup_.maxExtent_).to.eql(bufferExtent([
projExtent[0] - worldWidth + buffer,
-10000, projExtent[2] + worldWidth - buffer, 10000
], buffer));
expect(renderer.replayGroup_.maxExtent_).to.eql(
bufferExtent(
[
projExtent[0] - worldWidth + buffer,
-10000,
projExtent[2] + worldWidth - buffer,
10000,
],
buffer
)
);
expect(loadExtents.length).to.be(2);
expect(loadExtents[0]).to.eql(bufferExtent(frameState.extent, buffer));
const otherExtent = [projExtent[0] - 10000 + worldWidth, -10000, projExtent[2] - 10000 + worldWidth, 10000];
const otherExtent = [
projExtent[0] - 10000 + worldWidth,
-10000,
projExtent[2] - 10000 + worldWidth,
10000,
];
expect(loadExtents[1]).to.eql(bufferExtent(otherExtent, buffer));
});
it('sets correct extent for viewport more than 1 world wide', function() {
setExtent([2 * projExtent[0] + 10000, -10000, 2 * projExtent[2] - 10000, 10000]);
it('sets correct extent for viewport more than 1 world wide', function () {
setExtent([
2 * projExtent[0] + 10000,
-10000,
2 * projExtent[2] - 10000,
10000,
]);
renderer.prepareFrame(frameState);
expect(renderer.replayGroup_.maxExtent_).to.eql(bufferExtent([
projExtent[0] - worldWidth + buffer,
-10000, projExtent[2] + worldWidth - buffer, 10000
], buffer));
expect(renderer.replayGroup_.maxExtent_).to.eql(
bufferExtent(
[
projExtent[0] - worldWidth + buffer,
-10000,
projExtent[2] + worldWidth - buffer,
10000,
],
buffer
)
);
expect(loadExtents.length).to.be(1);
expect(loadExtents[0]).to.eql(bufferExtent(frameState.extent, buffer));
});
it('sets correct extent for viewport more than 2 worlds wide, one world away', function() {
setExtent([projExtent[0] - 2 * worldWidth - 10000,
-10000, projExtent[0] + 2 * worldWidth + 10000, 10000
it('sets correct extent for viewport more than 2 worlds wide, one world away', function () {
setExtent([
projExtent[0] - 2 * worldWidth - 10000,
-10000,
projExtent[0] + 2 * worldWidth + 10000,
10000,
]);
renderer.prepareFrame(frameState);
expect(renderer.replayGroup_.maxExtent_).to.eql(bufferExtent([
projExtent[0] - 2 * worldWidth - 10000,
-10000, projExtent[2] + 2 * worldWidth + 10000, 10000
], buffer));
expect(renderer.replayGroup_.maxExtent_).to.eql(
bufferExtent(
[
projExtent[0] - 2 * worldWidth - 10000,
-10000,
projExtent[2] + 2 * worldWidth + 10000,
10000,
],
buffer
)
);
expect(loadExtents.length).to.be(1);
const normalizedExtent = [projExtent[0] - 2 * worldWidth + worldWidth - 10000, -10000, projExtent[0] + 2 * worldWidth + worldWidth + 10000, 10000];
const normalizedExtent = [
projExtent[0] - 2 * worldWidth + worldWidth - 10000,
-10000,
projExtent[0] + 2 * worldWidth + worldWidth + 10000,
10000,
];
expect(loadExtents[0]).to.eql(bufferExtent(normalizedExtent, buffer));
});
it('sets correct extent for small viewport, one world away', function() {
it('sets correct extent for small viewport, one world away', function () {
setExtent([-worldWidth - 10000, -10000, -worldWidth + 10000, 10000]);
renderer.prepareFrame(frameState);
expect(renderer.replayGroup_.maxExtent_).to.eql(bufferExtent([
projExtent[0] - worldWidth + buffer,
-10000, projExtent[2] + worldWidth - buffer, 10000
], buffer));
expect(renderer.replayGroup_.maxExtent_).to.eql(
bufferExtent(
[
projExtent[0] - worldWidth + buffer,
-10000,
projExtent[2] + worldWidth - buffer,
10000,
],
buffer
)
);
expect(loadExtents.length).to.be(1);
const normalizedExtent = [-10000, -10000, 10000, 10000];
expect(loadExtents[0]).to.eql(bufferExtent(normalizedExtent, buffer));
});
it('sets replayGroupChanged correctly', function() {
it('sets replayGroupChanged correctly', function () {
setExtent([-10000, -10000, 10000, 10000]);
renderer.prepareFrame(frameState);
expect(renderer.replayGroupChanged).to.be(true);
@@ -332,10 +399,10 @@ describe('ol.renderer.canvas.VectorLayer', function() {
expect(renderer.replayGroupChanged).to.be(false);
});
it('dispatches a postrender event when rendering', function(done) {
it('dispatches a postrender event when rendering', function (done) {
const layer = renderer.getLayer();
layer.getSource().addFeature(new Feature(new Point([0, 0])));
layer.once('postrender', function() {
layer.once('postrender', function () {
expect(true);
done();
});
@@ -351,12 +418,10 @@ describe('ol.renderer.canvas.VectorLayer', function() {
}
expect(rendered).to.be(true);
});
});
describe('hit detection', function() {
it('with no fill and transparent fill', function() {
describe('hit detection', function () {
it('with no fill and transparent fill', function () {
const target = document.createElement('div');
target.style.width = '300px';
target.style.height = '300px';
@@ -365,101 +430,101 @@ describe('ol.renderer.canvas.VectorLayer', function() {
transparent: new Style({
stroke: new Stroke({
color: 'blue',
width: 3
width: 3,
}),
fill: new Fill({
color: 'transparent'
color: 'transparent',
}),
image: new CircleStyle({
radius: 30,
stroke: new Stroke({
color: 'blue',
width: 3
width: 3,
}),
fill: new Fill({
color: 'transparent'
})
})
color: 'transparent',
}),
}),
}),
none: new Style({
stroke: new Stroke({
color: 'blue',
width: 3
width: 3,
}),
image: new CircleStyle({
radius: 30,
stroke: new Stroke({
color: 'blue',
width: 3
})
})
})
width: 3,
}),
}),
}),
};
const source = new VectorSource({
features: [
new Feature({
geometry: fromExtent([0, 10, 3, 13]),
fillType: 'none'
fillType: 'none',
}),
new Feature({
geometry: fromExtent([1, 11, 4, 14]),
fillType: 'none'
fillType: 'none',
}),
new Feature({
geometry: fromExtent([5, 10, 8, 13]),
fillType: 'transparent'
fillType: 'transparent',
}),
new Feature({
geometry: fromExtent([6, 11, 9, 14]),
fillType: 'transparent'
fillType: 'transparent',
}),
new Feature({
geometry: new Circle([1.5, 6.5], 1.5),
fillType: 'none'
fillType: 'none',
}),
new Feature({
geometry: new Circle([2.5, 7.5], 1.5),
fillType: 'none'
fillType: 'none',
}),
new Feature({
geometry: new Circle([6.5, 6.5], 1.5),
fillType: 'transparent'
fillType: 'transparent',
}),
new Feature({
geometry: new Circle([7.5, 7.5], 1.5),
fillType: 'transparent'
fillType: 'transparent',
}),
new Feature({
geometry: new Point([1.5, 1.5]),
fillType: 'none'
fillType: 'none',
}),
new Feature({
geometry: new Point([2.5, 2.5]),
fillType: 'none'
fillType: 'none',
}),
new Feature({
geometry: new Point([6.5, 1.5]),
fillType: 'transparent'
fillType: 'transparent',
}),
new Feature({
geometry: new Point([7.5, 2.5]),
fillType: 'transparent'
})
]
fillType: 'transparent',
}),
],
});
const layer = new VectorLayer({
source: source,
style: function(feature, resolution) {
style: function (feature, resolution) {
return styles[feature.get('fillType')];
}
},
});
const map = new Map({
layers: [layer],
view: new View({
center: [4.5, 7],
resolution: 0.05
resolution: 0.05,
}),
target: target
target: target,
});
map.renderSync();
@@ -568,7 +633,5 @@ describe('ol.renderer.canvas.VectorLayer', function() {
document.body.removeChild(target);
});
});
});