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
test/spec/ol/render/box.test.js
+14 -17
View File
@@ -1,15 +1,13 @@
import Disposable from '../../../../src/ol/Disposable.js';
import Map from '../../../../src/ol/Map.js';
import View from '../../../../src/ol/View.js';
import Polygon from '../../../../src/ol/geom/Polygon.js';
import RenderBox from '../../../../src/ol/render/Box.js';
import View from '../../../../src/ol/View.js';
describe('ol.render.Box', function() {
describe('ol.render.Box', function () {
let box, map, target;
beforeEach(function() {
beforeEach(function () {
box = new RenderBox('test-box');
target = document.createElement('div');
@@ -21,56 +19,55 @@ describe('ol.render.Box', function() {
target: target,
view: new View({
center: [0, 0],
zoom: 0
})
zoom: 0,
}),
});
map.renderSync();
box.setMap(map);
});
afterEach(function() {
afterEach(function () {
map.dispose();
document.body.removeChild(target);
});
describe('constructor', function() {
it('creates an instance', function() {
describe('constructor', function () {
it('creates an instance', function () {
const obj = new RenderBox('test-box');
expect(obj).to.be.a(RenderBox);
expect(obj).to.be.a(Disposable);
obj.dispose();
});
it('creates an absolutely positioned DIV with a className', function() {
it('creates an absolutely positioned DIV with a className', function () {
expect(box.element_).to.be.a(HTMLDivElement);
expect(box.element_.style.position).to.be('absolute');
expect(box.element_.className).to.be('ol-box test-box');
expect(box.element_.style.position).to.be('absolute');
});
it('appends the DIV to the map\'s overlay container', function() {
it("appends the DIV to the map's overlay container", function () {
expect(box.element_.parentNode).to.equal(map.getOverlayContainer());
});
});
describe('#setPixels()', function() {
it('applies correct styles for a box', function() {
describe('#setPixels()', function () {
it('applies correct styles for a box', function () {
box.setPixels([1, 2], [4, 8]);
expect(box.element_.style.left).to.be('1px');
expect(box.element_.style.top).to.be('2px');
expect(box.element_.style.width).to.be('3px');
expect(box.element_.style.height).to.be('6px');
});
it('applies correct styles for a flipped box', function() {
it('applies correct styles for a flipped box', function () {
box.setPixels([4, 8], [1, 2]);
expect(box.element_.style.left).to.be('1px');
expect(box.element_.style.top).to.be('2px');
expect(box.element_.style.width).to.be('3px');
expect(box.element_.style.height).to.be('6px');
});
it('creates a polygon geometry', function() {
it('creates a polygon geometry', function () {
expect(box.getGeometry()).to.be(null);
box.setPixels([1, 2], [3, 4]);
expect(box.getGeometry()).to.be.a(Polygon);
});
});
});
test/spec/ol/render/canvas/executorgroup.test.js
+3 -6
View File
@@ -1,10 +1,8 @@
import {getCircleArray} from '../../../../../src/ol/render/canvas/ExecutorGroup.js';
describe('ol.render.canvas.ExecutorGroup', function() {
describe('#getCircleArray_', function() {
it('creates an array with a pixelated circle marked with true', function() {
describe('ol.render.canvas.ExecutorGroup', function () {
describe('#getCircleArray_', function () {
it('creates an array with a pixelated circle marked with true', function () {
const radius = 10;
const minRadiusSq = Math.pow(radius - Math.SQRT2, 2);
const maxRadiusSq = Math.pow(radius + Math.SQRT2, 2);
@@ -27,5 +25,4 @@ describe('ol.render.canvas.ExecutorGroup', function() {
}
});
});
});
test/spec/ol/render/canvas/hitdetect.test.js
+24 -14
View File
@@ -1,33 +1,43 @@
import {createHitDetectionImageData} from '../../../../../src/ol/render/canvas/hitdetect.js';
import {create} from '../../../../../src/ol/transform.js';
import Circle from '../../../../../src/ol/style/Circle.js';
import Feature from '../../../../../src/ol/Feature.js';
import Point from '../../../../../src/ol/geom/Point.js';
import {Style} from '../../../../../src/ol/style.js';
import Circle from '../../../../../src/ol/style/Circle.js';
describe('hitdetect', function() {
import {create} from '../../../../../src/ol/transform.js';
import {createHitDetectionImageData} from '../../../../../src/ol/render/canvas/hitdetect.js';
describe('hitdetect', function () {
let features, styleFunction;
beforeEach(function() {
beforeEach(function () {
features = [
new Feature(new Point([0, 75])),
new Feature(new Point([0, 50])),
new Feature(new Point([0, 25])),
new Feature(new Point([0, 0]))
new Feature(new Point([0, 0])),
];
styleFunction = function() {
styleFunction = function () {
return new Style({
image: new Circle({
radius: 5
})
radius: 5,
}),
});
};
});
it ('does not exceed the color range', function() {
const imageData = createHitDetectionImageData([2, 2], [create()], features, styleFunction, [0, 0, 0, 0], 1, 0);
expect(Array.prototype.slice.call(imageData.data, 0, 3)).to.eql([255, 255, 252]);
it('does not exceed the color range', function () {
const imageData = createHitDetectionImageData(
[2, 2],
[create()],
features,
styleFunction,
[0, 0, 0, 0],
1,
0
);
expect(Array.prototype.slice.call(imageData.data, 0, 3)).to.eql([
255,
255,
252,
]);
});
});
test/spec/ol/render/canvas/immediate.test.js
+164 -96
View File
@@ -1,4 +1,7 @@
import CanvasImmediateRenderer from '../../../../../src/ol/render/canvas/Immediate.js';
import Circle from '../../../../../src/ol/geom/Circle.js';
import CircleStyle from '../../../../../src/ol/style/Circle.js';
import Fill from '../../../../../src/ol/style/Fill.js';
import GeometryCollection from '../../../../../src/ol/geom/GeometryCollection.js';
import LineString from '../../../../../src/ol/geom/LineString.js';
import MultiLineString from '../../../../../src/ol/geom/MultiLineString.js';
@@ -6,17 +9,12 @@ import MultiPoint from '../../../../../src/ol/geom/MultiPoint.js';
import MultiPolygon from '../../../../../src/ol/geom/MultiPolygon.js';
import Point from '../../../../../src/ol/geom/Point.js';
import Polygon from '../../../../../src/ol/geom/Polygon.js';
import VectorContext from '../../../../../src/ol/render/VectorContext.js';
import CanvasImmediateRenderer from '../../../../../src/ol/render/canvas/Immediate.js';
import CircleStyle from '../../../../../src/ol/style/Circle.js';
import Fill from '../../../../../src/ol/style/Fill.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 VectorContext from '../../../../../src/ol/render/VectorContext.js';
describe('ol.render.canvas.Immediate', function() {
describe('ol.render.canvas.Immediate', function () {
function getMockContext() {
return {
setLineDash: sinon.spy(),
@@ -24,20 +22,20 @@ describe('ol.render.canvas.Immediate', function() {
closePath: sinon.spy(),
stroke: sinon.spy(),
lineTo: sinon.spy(),
moveTo: sinon.spy()
moveTo: sinon.spy(),
};
}
describe('constructor', function() {
it('creates an instance', function() {
describe('constructor', function () {
it('creates an instance', function () {
const instance = new CanvasImmediateRenderer();
expect(instance).to.be.a(CanvasImmediateRenderer);
expect(instance).to.be.a(VectorContext);
});
});
describe('#setStyle()', function() {
it('calls the more specific methods with style parts', function() {
describe('#setStyle()', function () {
it('calls the more specific methods with style parts', function () {
const context = new CanvasImmediateRenderer();
sinon.spy(context, 'setFillStrokeStyle');
sinon.spy(context, 'setImageStyle');
@@ -50,84 +48,128 @@ describe('ol.render.canvas.Immediate', function() {
fill: fill,
stroke: stroke,
image: image,
text: text
text: text,
});
context.setStyle(style);
expect(context.setFillStrokeStyle.calledOnce).to.be(true);
expect(context.setFillStrokeStyle.firstCall.calledWithExactly(fill, stroke)).to.be(true);
expect(
context.setFillStrokeStyle.firstCall.calledWithExactly(fill, stroke)
).to.be(true);
expect(context.setImageStyle.calledOnce).to.be(true);
expect(context.setImageStyle.firstCall.calledWithExactly(image)).to.be(true);
expect(context.setImageStyle.firstCall.calledWithExactly(image)).to.be(
true
);
expect(context.setTextStyle.calledOnce).to.be(true);
expect(context.setTextStyle.firstCall.calledWithExactly(text)).to.be(true);
expect(context.setTextStyle.firstCall.calledWithExactly(text)).to.be(
true
);
});
});
describe('#drawGeometry()', function() {
describe('#drawGeometry()', function () {
const extent = [-10, -10, 10, 10];
it('calls drawPoint() with a Point', function() {
it('calls drawPoint() with a Point', function () {
const context = new CanvasImmediateRenderer(getMockContext(), 1, extent);
sinon.spy(context, 'drawPoint');
const geometry = new Point([1, 2]);
context.drawGeometry(geometry);
expect(context.drawPoint.calledOnce).to.be(true);
expect(context.drawPoint.firstCall.calledWithExactly(geometry)).to.be(true);
expect(context.drawPoint.firstCall.calledWithExactly(geometry)).to.be(
true
);
});
it('calls drawLineString() with a LineString', function() {
it('calls drawLineString() with a LineString', function () {
const context = new CanvasImmediateRenderer(getMockContext(), 1, extent);
sinon.spy(context, 'drawLineString');
const geometry = new LineString([[1, 2], [3, 4]]);
const geometry = new LineString([
[1, 2],
[3, 4],
]);
context.drawGeometry(geometry);
expect(context.drawLineString.calledOnce).to.be(true);
expect(context.drawLineString.firstCall.calledWithExactly(geometry)).to.be(true);
expect(
context.drawLineString.firstCall.calledWithExactly(geometry)
).to.be(true);
});
it('calls drawPolygon() with a Polygon', function() {
it('calls drawPolygon() with a Polygon', function () {
const context = new CanvasImmediateRenderer(getMockContext(), 1, extent);
sinon.spy(context, 'drawPolygon');
const geometry = new Polygon([[[1, 2], [3, 4], [5, 6], [1, 2]]]);
const geometry = new Polygon([
[
[1, 2],
[3, 4],
[5, 6],
[1, 2],
],
]);
context.drawGeometry(geometry);
expect(context.drawPolygon.calledOnce).to.be(true);
expect(context.drawPolygon.firstCall.calledWithExactly(geometry)).to.be(true);
expect(context.drawPolygon.firstCall.calledWithExactly(geometry)).to.be(
true
);
});
it('calls drawMultiPoint() with a MultiPoint', function() {
it('calls drawMultiPoint() with a MultiPoint', function () {
const context = new CanvasImmediateRenderer(getMockContext(), 1, extent);
sinon.spy(context, 'drawMultiPoint');
const geometry = new MultiPoint([[1, 2], [3, 4]]);
const geometry = new MultiPoint([
[1, 2],
[3, 4],
]);
context.drawGeometry(geometry);
expect(context.drawMultiPoint.calledOnce).to.be(true);
expect(context.drawMultiPoint.firstCall.calledWithExactly(geometry)).to.be(true);
expect(
context.drawMultiPoint.firstCall.calledWithExactly(geometry)
).to.be(true);
});
it('calls drawMultiLineString() with a MultiLineString', function() {
it('calls drawMultiLineString() with a MultiLineString', function () {
const context = new CanvasImmediateRenderer(getMockContext(), 1, extent);
sinon.spy(context, 'drawMultiLineString');
const geometry = new MultiLineString([[[1, 2], [3, 4]]]);
const geometry = new MultiLineString([
[
[1, 2],
[3, 4],
],
]);
context.drawGeometry(geometry);
expect(context.drawMultiLineString.calledOnce).to.be(true);
expect(context.drawMultiLineString.firstCall.calledWithExactly(geometry)).to.be(true);
expect(
context.drawMultiLineString.firstCall.calledWithExactly(geometry)
).to.be(true);
});
it('calls drawMultiPolygon() with a MultiPolygon', function() {
it('calls drawMultiPolygon() with a MultiPolygon', function () {
const context = new CanvasImmediateRenderer(getMockContext(), 1, extent);
sinon.spy(context, 'drawMultiPolygon');
const geometry = new MultiPolygon([[[[1, 2], [3, 4], [5, 6], [1, 2]]]]);
const geometry = new MultiPolygon([
[
[
[1, 2],
[3, 4],
[5, 6],
[1, 2],
],
],
]);
context.drawGeometry(geometry);
expect(context.drawMultiPolygon.calledOnce).to.be(true);
expect(context.drawMultiPolygon.firstCall.calledWithExactly(geometry)).to.be(true);
expect(
context.drawMultiPolygon.firstCall.calledWithExactly(geometry)
).to.be(true);
});
it('calls drawGeometryCollection() with a GeometryCollection', function() {
it('calls drawGeometryCollection() with a GeometryCollection', function () {
const context = new CanvasImmediateRenderer(getMockContext(), 1, extent);
sinon.spy(context, 'drawGeometryCollection');
sinon.spy(context, 'drawPoint');
@@ -135,8 +177,18 @@ describe('ol.render.canvas.Immediate', function() {
sinon.spy(context, 'drawPolygon');
const point = new Point([1, 2]);
const linestring = new LineString([[1, 2], [3, 4]]);
const polygon = new Polygon([[[1, 2], [3, 4], [5, 6], [1, 2]]]);
const linestring = new LineString([
[1, 2],
[3, 4],
]);
const polygon = new Polygon([
[
[1, 2],
[3, 4],
[5, 6],
[1, 2],
],
]);
const geometry = new GeometryCollection([point, linestring, polygon]);
context.drawGeometry(geometry);
@@ -145,12 +197,16 @@ describe('ol.render.canvas.Immediate', function() {
expect(context.drawPoint.calledOnce).to.be(true);
expect(context.drawPoint.firstCall.calledWithExactly(point)).to.be(true);
expect(context.drawLineString.calledOnce).to.be(true);
expect(context.drawLineString.firstCall.calledWithExactly(linestring)).to.be(true);
expect(
context.drawLineString.firstCall.calledWithExactly(linestring)
).to.be(true);
expect(context.drawPolygon.calledOnce).to.be(true);
expect(context.drawPolygon.firstCall.calledWithExactly(polygon)).to.be(true);
expect(context.drawPolygon.firstCall.calledWithExactly(polygon)).to.be(
true
);
});
it('calls drawCircle() with a Circle', function() {
it('calls drawCircle() with a Circle', function () {
const context = new CanvasImmediateRenderer(getMockContext(), 1, extent);
sinon.spy(context, 'drawCircle');
@@ -158,69 +214,76 @@ describe('ol.render.canvas.Immediate', function() {
context.drawGeometry(geometry);
expect(context.drawCircle.calledOnce).to.be(true);
expect(context.drawCircle.firstCall.calledWithExactly(geometry)).to.be(true);
expect(context.drawCircle.firstCall.calledWithExactly(geometry)).to.be(
true
);
});
});
describe('#drawMultiPolygon()', function() {
it('creates the correct canvas instructions for 3D geometries', function() {
describe('#drawMultiPolygon()', function () {
it('creates the correct canvas instructions for 3D geometries', function () {
const instructions = [];
function serialize(index, instruction) {
if (!instruction) {
return 'id: ' + index + ' NO INSTRUCTION';
}
const parts = [
'id: ' + index,
'type: ' + instruction.type
];
const parts = ['id: ' + index, 'type: ' + instruction.type];
if (instruction.args) {
parts.push('args: [' + instruction.args.map(function(arg) {
if (typeof arg === 'number') {
return arg.toFixed(9);
} else {
return arg;
}
}).join(', ') + ']');
parts.push(
'args: [' +
instruction.args
.map(function (arg) {
if (typeof arg === 'number') {
return arg.toFixed(9);
} else {
return arg;
}
})
.join(', ') +
']'
);
}
return parts.join(', ');
}
const context = {
beginPath: function() {},
moveTo: function(x, y) {
beginPath: function () {},
moveTo: function (x, y) {
instructions.push({
type: 'moveTo',
args: [x, y]
args: [x, y],
});
},
lineTo: function(x, y) {
lineTo: function (x, y) {
instructions.push({
type: 'lineTo',
args: [x, y]
args: [x, y],
});
},
closePath: function() {
closePath: function () {
instructions.push({
type: 'closePath'
type: 'closePath',
});
},
setLineDash: function() {},
stroke: function() {}
setLineDash: function () {},
stroke: function () {},
};
const transform = [
0.0004088332670837288, 0,
0, -0.0004088332670837288,
4480.991370439071, 1529.5752568707105
0.0004088332670837288,
0,
0,
-0.0004088332670837288,
4480.991370439071,
1529.5752568707105,
];
const extent = [
-10960437.252092224, 2762924.0275091752,
-7572748.158493212, 3741317.9895594316
-10960437.252092224,
2762924.0275091752,
-7572748.158493212,
3741317.9895594316,
];
const canvas = new CanvasImmediateRenderer(context, 1, extent, transform);
@@ -231,29 +294,36 @@ describe('ol.render.canvas.Immediate', function() {
lineJoin: 'round',
lineWidth: 3,
miterLimit: 10,
strokeStyle: '#00FFFF'
strokeStyle: '#00FFFF',
};
const multiPolygonGeometry = new MultiPolygon([[[
// first polygon
[-80.736061, 28.788576000000006, 0], // moveTo()
[-80.763557, 28.821799999999996, 0], // lineTo()
[-80.817406, 28.895123999999996, 0], // lineTo()
[-80.891304, 29.013130000000004, 0], // lineTo()
[-80.916512, 29.071560000000005, 0], // lineTo()
[-80.899323, 29.061249000000004, 0], // lineTo()
[-80.862663, 28.991361999999995, 0], // lineTo()
[-80.736061, 28.788576000000006, 0] // closePath()
]], [[
// second polygon
[-82.102127, 26.585724, 0], // moveTo()
[-82.067139, 26.497208, 0], // lineTo()
[-82.097641, 26.493585999999993, 0], // lineTo()
[-82.135895, 26.642279000000002, 0], // lineTo()
[-82.183495, 26.683082999999996, 0], // lineTo()
[-82.128838, 26.693342, 0], // lineTo()
[-82.102127, 26.585724, 0] // closePath()
]]]).transform('EPSG:4326', 'EPSG:3857');
const multiPolygonGeometry = new MultiPolygon([
[
[
// first polygon
[-80.736061, 28.788576000000006, 0], // moveTo()
[-80.763557, 28.821799999999996, 0], // lineTo()
[-80.817406, 28.895123999999996, 0], // lineTo()
[-80.891304, 29.013130000000004, 0], // lineTo()
[-80.916512, 29.071560000000005, 0], // lineTo()
[-80.899323, 29.061249000000004, 0], // lineTo()
[-80.862663, 28.991361999999995, 0], // lineTo()
[-80.736061, 28.788576000000006, 0], // closePath()
],
],
[
[
// second polygon
[-82.102127, 26.585724, 0], // moveTo()
[-82.067139, 26.497208, 0], // lineTo()
[-82.097641, 26.493585999999993, 0], // lineTo()
[-82.135895, 26.642279000000002, 0], // lineTo()
[-82.183495, 26.683082999999996, 0], // lineTo()
[-82.128838, 26.693342, 0], // lineTo()
[-82.102127, 26.585724, 0], // closePath()
],
],
]).transform('EPSG:4326', 'EPSG:3857');
canvas.drawMultiPolygon(multiPolygonGeometry, null);
@@ -274,10 +344,9 @@ describe('ol.render.canvas.Immediate', function() {
{type: 'lineTo', args: [742.8955268835157, 270.83899948444764]},
{type: 'lineTo', args: [740.7291979946272, 268.76099731369345]},
{type: 'lineTo', args: [743.2166987946266, 268.23842607400616]},
{type: 'closePath'}
{type: 'closePath'},
];
for (let i = 0, ii = instructions.length; i < ii; ++i) {
const actualInstruction = serialize(i, instructions[i]);
const expectedInstruction = serialize(i, expected[i]);
@@ -285,7 +354,6 @@ describe('ol.render.canvas.Immediate', function() {
}
expect(instructions.length).to.equal(expected.length);
});
});
});
test/spec/ol/render/canvas/index.test.js
+56 -37
View File
@@ -1,28 +1,29 @@
import * as render from '../../../../../src/ol/render/canvas.js';
describe('ol.render.canvas', function() {
describe('ol.render.canvas', function () {
const font = document.createElement('link');
font.href = 'https://fonts.googleapis.com/css?family=Abel&text=wmytzilWMYTZIL%40%23%2F%26%3F%24%2510';
font.href =
'https://fonts.googleapis.com/css?family=Abel&text=wmytzilWMYTZIL%40%23%2F%26%3F%24%2510';
font.rel = 'stylesheet';
const head = document.getElementsByTagName('head')[0];
describe('ol.render.canvas.registerFont()', function() {
beforeEach(function() {
describe('ol.render.canvas.registerFont()', function () {
beforeEach(function () {
render.checkedFonts.values_ = {};
render.measureTextHeight('12px sans-serif');
});
const retries = 100;
it('does not trigger redraw and clear measurements for unavailable fonts', function(done) {
it('does not trigger redraw and clear measurements for unavailable fonts', function (done) {
this.timeout(4000);
const spy = sinon.spy();
render.checkedFonts.addEventListener('propertychange', spy);
const interval = setInterval(function() {
if (render.checkedFonts.get('normal\nnormal\nfoo') == retries && render.checkedFonts.get('normal\nnormal\nsans-serif') == retries) {
const interval = setInterval(function () {
if (
render.checkedFonts.get('normal\nnormal\nfoo') == retries &&
render.checkedFonts.get('normal\nnormal\nsans-serif') == retries
) {
clearInterval(interval);
render.checkedFonts.removeEventListener('propertychange', spy);
expect(spy.callCount).to.be(0);
@@ -33,10 +34,10 @@ describe('ol.render.canvas', function() {
render.registerFont('12px foo,sans-serif');
});
it('does not trigger redraw and clear measurements for available fonts', function(done) {
it('does not trigger redraw and clear measurements for available fonts', function (done) {
const spy = sinon.spy();
render.checkedFonts.addEventListener('propertychange', spy);
const interval = setInterval(function() {
const interval = setInterval(function () {
if (render.checkedFonts.get('normal\nnormal\nsans-serif') == retries) {
clearInterval(interval);
render.checkedFonts.removeEventListener('propertychange', spy);
@@ -48,10 +49,10 @@ describe('ol.render.canvas', function() {
render.registerFont('12px sans-serif');
});
it('does not trigger redraw and clear measurements for the \'monospace\' font', function(done) {
it("does not trigger redraw and clear measurements for the 'monospace' font", function (done) {
const spy = sinon.spy();
render.checkedFonts.addEventListener('propertychange', spy);
const interval = setInterval(function() {
const interval = setInterval(function () {
if (render.checkedFonts.get('normal\nnormal\nmonospace') == retries) {
clearInterval(interval);
render.checkedFonts.removeEventListener('propertychange', spy);
@@ -63,33 +64,41 @@ describe('ol.render.canvas', function() {
render.registerFont('12px monospace');
});
it('triggers redraw and clear measurements for fonts that become available', function(done) {
it('triggers redraw and clear measurements for fonts that become available', function (done) {
head.appendChild(font);
render.checkedFonts.addEventListener('propertychange', function onPropertyChange(e) {
render.checkedFonts.removeEventListener('propertychange', onPropertyChange);
expect(e.key).to.be('normal\nnormal\nAbel');
expect(render.textHeights).to.eql({});
done();
});
render.checkedFonts.addEventListener(
'propertychange',
function onPropertyChange(e) {
render.checkedFonts.removeEventListener(
'propertychange',
onPropertyChange
);
expect(e.key).to.be('normal\nnormal\nAbel');
expect(render.textHeights).to.eql({});
done();
}
);
render.registerFont('12px Abel');
});
});
describe('measureTextHeight', function() {
it('respects line-height', function() {
describe('measureTextHeight', function () {
it('respects line-height', function () {
const height = render.measureTextHeight('12px/1.2 sans-serif');
expect(render.measureTextHeight('12px/2.4 sans-serif')).to.be.greaterThan(height);
expect(render.measureTextHeight('12px/0.1 sans-serif')).to.be.lessThan(height);
expect(render.measureTextHeight('12px/2.4 sans-serif')).to.be.greaterThan(
height
);
expect(render.measureTextHeight('12px/0.1 sans-serif')).to.be.lessThan(
height
);
});
});
describe('rotateAtOffset', function() {
it('rotates a canvas at an offset point', function() {
describe('rotateAtOffset', function () {
it('rotates a canvas at an offset point', function () {
const context = {
translate: sinon.spy(),
rotate: sinon.spy()
rotate: sinon.spy(),
};
render.rotateAtOffset(context, Math.PI, 10, 10);
expect(context.translate.callCount).to.be(2);
@@ -100,14 +109,14 @@ describe('ol.render.canvas', function() {
});
});
describe('drawImageOrLabel', function() {
it('draws the image with correct parameters', function() {
describe('drawImageOrLabel', function () {
it('draws the image with correct parameters', function () {
const layerContext = {
save: sinon.spy(),
setTransform: sinon.spy(),
drawImage: sinon.spy(),
restore: sinon.spy(),
globalAlpha: 1
globalAlpha: 1,
};
const transform = [1, 0, 0, 1, 0, 0];
const opacity = 0.5;
@@ -118,16 +127,26 @@ describe('ol.render.canvas', function() {
const h = 1;
const scale = 1;
render.drawImageOrLabel(layerContext, transform.slice(), opacity, image,
x, y, w, h, x, y, scale);
render.drawImageOrLabel(
layerContext,
transform.slice(),
opacity,
image,
x,
y,
w,
h,
x,
y,
scale
);
expect(layerContext.save.callCount).to.be(1);
expect(layerContext.setTransform.callCount).to.be(1);
expect(layerContext.setTransform.firstCall.args).to.eql(transform);
expect(layerContext.drawImage.callCount).to.be(1);
expect(layerContext.globalAlpha).to.be(.5);
expect(layerContext.globalAlpha).to.be(0.5);
expect(layerContext.restore.callCount).to.be(1);
});
});
});
test/spec/ol/render/canvas/textbuilder.test.js
+70 -35
View File
@@ -1,9 +1,9 @@
import Executor from '../../../../../src/ol/render/canvas/Executor.js';
import Feature from '../../../../../src/ol/Feature.js';
import MultiPolygon from '../../../../../src/ol/geom/MultiPolygon.js';
import Polygon from '../../../../../src/ol/geom/Polygon.js';
import TextBuilder from '../../../../../src/ol/render/canvas/TextBuilder.js';
import Executor from '../../../../../src/ol/render/canvas/Executor.js';
import Text from '../../../../../src/ol/style/Text.js';
import TextBuilder from '../../../../../src/ol/render/canvas/TextBuilder.js';
import {create as createTransform} from '../../../../../src/ol/transform.js';
function createBuilder() {
@@ -12,76 +12,111 @@ function createBuilder() {
function createContext() {
return {
fill: function() {},
stroke: function() {},
beginPath: function() {},
clip: function() {},
moveTo: function() {},
lineTo: function() {},
closePath: function() {},
setLineDash: function() {},
save: function() {},
restore: function() {}
fill: function () {},
stroke: function () {},
beginPath: function () {},
clip: function () {},
moveTo: function () {},
lineTo: function () {},
closePath: function () {},
setLineDash: function () {},
save: function () {},
restore: function () {},
};
}
function executeInstructions(builder, expectedDrawTextImageCalls, expectedBuilderImageCalls) {
function executeInstructions(
builder,
expectedDrawTextImageCalls,
expectedBuilderImageCalls
) {
const transform = createTransform();
const context = createContext();
const executor = new Executor(0.02, 1, false, builder.finish());
sinon.spy(executor, 'drawLabelWithPointPlacement_');
const replayImageOrLabelStub = sinon.stub(executor, 'replayImageOrLabel_');
executor.execute(context, transform);
expect(executor.drawLabelWithPointPlacement_.callCount).to.be(expectedDrawTextImageCalls);
expect(executor.drawLabelWithPointPlacement_.callCount).to.be(
expectedDrawTextImageCalls
);
expect(replayImageOrLabelStub.callCount).to.be(expectedBuilderImageCalls);
}
describe('ol.render.canvas.TextBuilder', function() {
it('renders polygon labels only when they fit', function() {
describe('ol.render.canvas.TextBuilder', function () {
it('renders polygon labels only when they fit', function () {
let builder = createBuilder();
const geometry = new Polygon([[[0, 0], [0, 1], [1, 1], [1, 0], [0, 0]]]);
const geometry = new Polygon([
[
[0, 0],
[0, 1],
[1, 1],
[1, 0],
[0, 0],
],
]);
const feature = new Feature(geometry);
builder.setTextStyle(new Text({
text: 'This is a long text'
}));
builder.setTextStyle(
new Text({
text: 'This is a long text',
})
);
builder.drawText(geometry, feature);
expect(builder.instructions.length).to.be(3);
executeInstructions(builder, 1, 0);
builder = createBuilder();
builder.setTextStyle(new Text({
text: 'short'
}));
builder.setTextStyle(
new Text({
text: 'short',
})
);
builder.drawText(geometry, feature);
expect(builder.instructions.length).to.be(3);
executeInstructions(builder, 1, 1);
});
it('renders multipolygon labels only when they fit', function() {
it('renders multipolygon labels only when they fit', function () {
const geometry = new MultiPolygon([
[[[0, 0], [0, 1], [1, 1], [1, 0], [0, 0]]],
[[[1, 1], [1, 2], [2, 2], [2, 1], [1, 1]]]
[
[
[0, 0],
[0, 1],
[1, 1],
[1, 0],
[0, 0],
],
],
[
[
[1, 1],
[1, 2],
[2, 2],
[2, 1],
[1, 1],
],
],
]);
const feature = new Feature(geometry);
let builder = createBuilder();
builder.setTextStyle(new Text({
text: 'This is a long text'
}));
builder.setTextStyle(
new Text({
text: 'This is a long text',
})
);
builder.drawText(geometry, feature);
expect(builder.instructions.length).to.be(3);
executeInstructions(builder, 1, 0);
builder = createBuilder();
builder.setTextStyle(new Text({
text: 'short'
}));
builder.setTextStyle(
new Text({
text: 'short',
})
);
builder.drawText(geometry, feature);
expect(builder.instructions.length).to.be(3);
executeInstructions(builder, 1, 2);
});
});
test/spec/ol/render/feature.test.js
+196 -64
View File
@@ -4,150 +4,282 @@ import MultiPolygon from '../../../../src/ol/geom/MultiPolygon.js';
import Polygon from '../../../../src/ol/geom/Polygon.js';
import RenderFeature from '../../../../src/ol/render/Feature.js';
describe('ol.render.Feature', function() {
describe('ol.render.Feature', function () {
const type = 'Point';
const flatCoordinates = [0, 0];
const ends = null;
const properties = {foo: 'bar'};
describe('Constructor', function() {
it('creates an instance', function() {
const feature = new RenderFeature(type, flatCoordinates, ends, properties, 'foo');
describe('Constructor', function () {
it('creates an instance', function () {
const feature = new RenderFeature(
type,
flatCoordinates,
ends,
properties,
'foo'
);
expect(feature).to.be.a(RenderFeature);
});
});
describe('#get()', function() {
it('returns a single property', function() {
const feature = new RenderFeature(type, flatCoordinates, ends, properties, 'foo');
describe('#get()', function () {
it('returns a single property', function () {
const feature = new RenderFeature(
type,
flatCoordinates,
ends,
properties,
'foo'
);
expect(feature.get('foo')).to.be('bar');
});
});
describe('#getEnds()', function() {
it('returns the ends it was created with', function() {
const feature = new RenderFeature(type, flatCoordinates, ends, properties, 'foo');
describe('#getEnds()', function () {
it('returns the ends it was created with', function () {
const feature = new RenderFeature(
type,
flatCoordinates,
ends,
properties,
'foo'
);
expect(feature.getEnds()).to.equal(ends);
});
});
describe('#getExtent()', function() {
it('returns the correct extent for a point', function() {
const feature = new RenderFeature(type, flatCoordinates, ends, properties, 'foo');
describe('#getExtent()', function () {
it('returns the correct extent for a point', function () {
const feature = new RenderFeature(
type,
flatCoordinates,
ends,
properties,
'foo'
);
expect(feature.getExtent()).to.eql([0, 0, 0, 0]);
});
it('caches the extent', function() {
const feature = new RenderFeature(type, flatCoordinates, ends, properties, 'foo');
it('caches the extent', function () {
const feature = new RenderFeature(
type,
flatCoordinates,
ends,
properties,
'foo'
);
expect(feature.getExtent()).to.equal(feature.extent_);
});
it('returns the correct extent for a linestring', function() {
it('returns the correct extent for a linestring', function () {
const feature = new RenderFeature('LineString', [-1, -2, 2, 1], null, {});
expect(feature.getExtent()).to.eql([-1, -2, 2, 1]);
});
});
describe('#getFlatCoordinates()', function() {
it('returns the flat coordinates it was created with', function() {
const feature = new RenderFeature(type, flatCoordinates, ends, properties, 'foo');
describe('#getFlatCoordinates()', function () {
it('returns the flat coordinates it was created with', function () {
const feature = new RenderFeature(
type,
flatCoordinates,
ends,
properties,
'foo'
);
expect(feature.getFlatCoordinates()).to.equal(flatCoordinates);
});
});
describe('#getFlatInteriorPoint()', function() {
it('returns correct point and caches it', function() {
const polygon = new Polygon([[[0, 0], [0, 10], [10, 10], [10, 0], [0, 0]]]);
const feature = new RenderFeature('Polygon', polygon.getOrientedFlatCoordinates(),
polygon.getEnds());
describe('#getFlatInteriorPoint()', function () {
it('returns correct point and caches it', function () {
const polygon = new Polygon([
[
[0, 0],
[0, 10],
[10, 10],
[10, 0],
[0, 0],
],
]);
const feature = new RenderFeature(
'Polygon',
polygon.getOrientedFlatCoordinates(),
polygon.getEnds()
);
expect(feature.getFlatInteriorPoint()).to.eql([5, 5, 10]);
expect(feature.getFlatInteriorPoint()).to.be(feature.flatInteriorPoints_);
});
});
describe('#getFlatInteriorPoints()', function() {
it('returns correct points and caches them', function() {
describe('#getFlatInteriorPoints()', function () {
it('returns correct points and caches them', function () {
const polygon = new MultiPolygon([
[[[0, 0], [0, 10], [10, 10], [10, 0], [0, 0]]],
[[[10, 0], [10, 10], [20, 10], [20, 0], [10, 0]]]
[
[
[0, 0],
[0, 10],
[10, 10],
[10, 0],
[0, 0],
],
],
[
[
[10, 0],
[10, 10],
[20, 10],
[20, 0],
[10, 0],
],
],
]);
const feature = new RenderFeature('MultiPolygon', polygon.getOrientedFlatCoordinates(),
polygon.getEndss());
const feature = new RenderFeature(
'MultiPolygon',
polygon.getOrientedFlatCoordinates(),
polygon.getEndss()
);
expect(feature.getFlatInteriorPoints()).to.eql([5, 5, 10, 15, 5, 10]);
expect(feature.getFlatInteriorPoints()).to.be(feature.flatInteriorPoints_);
expect(feature.getFlatInteriorPoints()).to.be(
feature.flatInteriorPoints_
);
});
});
describe('#getFlatMidpoint()', function() {
it('returns correct point', function() {
const line = new LineString([[0, 0], [0, 10], [10, 10], [10, 0], [0, 0]]);
const feature = new RenderFeature('LineString', line.getFlatCoordinates());
describe('#getFlatMidpoint()', function () {
it('returns correct point', function () {
const line = new LineString([
[0, 0],
[0, 10],
[10, 10],
[10, 0],
[0, 0],
]);
const feature = new RenderFeature(
'LineString',
line.getFlatCoordinates()
);
expect(feature.getFlatMidpoint()).to.eql([10, 10]);
expect(feature.getFlatMidpoint()).to.eql(feature.flatMidpoints_);
});
});
describe('#getFlatMidpoints()', function() {
it('returns correct points and caches them', function() {
describe('#getFlatMidpoints()', function () {
it('returns correct points and caches them', function () {
const line = new MultiLineString([
[[0, 0], [0, 10], [10, 10], [10, 0], [0, 0]],
[[10, 0], [10, 10], [20, 10], [20, 0], [10, 0]]
[
[0, 0],
[0, 10],
[10, 10],
[10, 0],
[0, 0],
],
[
[10, 0],
[10, 10],
[20, 10],
[20, 0],
[10, 0],
],
]);
const feature = new RenderFeature('MultiLineString', line.getFlatCoordinates(),
line.getEnds());
const feature = new RenderFeature(
'MultiLineString',
line.getFlatCoordinates(),
line.getEnds()
);
expect(feature.getFlatMidpoints()).to.eql([10, 10, 20, 10]);
expect(feature.getFlatMidpoints()).to.be(feature.flatMidpoints_);
});
});
describe('#getGeometry()', function() {
it('returns itself as geometry', function() {
const feature = new RenderFeature(type, flatCoordinates, ends, properties, 'foo');
describe('#getGeometry()', function () {
it('returns itself as geometry', function () {
const feature = new RenderFeature(
type,
flatCoordinates,
ends,
properties,
'foo'
);
expect(feature.getGeometry()).to.equal(feature);
});
});
describe('#getId()', function() {
it('returns the feature id', function() {
const feature = new RenderFeature(type, flatCoordinates, ends, properties, 'foo');
describe('#getId()', function () {
it('returns the feature id', function () {
const feature = new RenderFeature(
type,
flatCoordinates,
ends,
properties,
'foo'
);
expect(feature.getId()).to.be('foo');
});
});
describe('#getProperties()', function() {
it('returns the properties it was created with', function() {
const feature = new RenderFeature(type, flatCoordinates, ends, properties, 'foo');
describe('#getProperties()', function () {
it('returns the properties it was created with', function () {
const feature = new RenderFeature(
type,
flatCoordinates,
ends,
properties,
'foo'
);
expect(feature.getProperties()).to.equal(properties);
});
});
describe('#getSimplifiedGeometry()', function() {
it('returns itself as simplified geometry', function() {
const feature = new RenderFeature(type, flatCoordinates, ends, properties, 'foo');
describe('#getSimplifiedGeometry()', function () {
it('returns itself as simplified geometry', function () {
const feature = new RenderFeature(
type,
flatCoordinates,
ends,
properties,
'foo'
);
expect(feature.getSimplifiedGeometry()).to.equal(feature);
});
});
describe('#getStride()', function() {
it('returns 2', function() {
const feature = new RenderFeature(type, flatCoordinates, ends, properties, 'foo');
describe('#getStride()', function () {
it('returns 2', function () {
const feature = new RenderFeature(
type,
flatCoordinates,
ends,
properties,
'foo'
);
expect(feature.getStride()).to.be(2);
});
});
describe('#getStyleFunction()', function() {
it('returns undefined', function() {
const feature = new RenderFeature(type, flatCoordinates, ends, properties, 'foo');
describe('#getStyleFunction()', function () {
it('returns undefined', function () {
const feature = new RenderFeature(
type,
flatCoordinates,
ends,
properties,
'foo'
);
expect(feature.getStyleFunction()).to.be(undefined);
});
});
describe('#getType()', function() {
it('returns the type it was created with', function() {
const feature = new RenderFeature(type, flatCoordinates, ends, properties, 'foo');
describe('#getType()', function () {
it('returns the type it was created with', function () {
const feature = new RenderFeature(
type,
flatCoordinates,
ends,
properties,
'foo'
);
expect(feature.getType()).to.equal(type);
});
});
});