diff --git a/test/spec/ol/render/canvas/hitdetect.test.js b/test/spec/ol/render/canvas/hitdetect.test.js index 4a1efeb976..04395ba3b7 100644 --- a/test/spec/ol/render/canvas/hitdetect.test.js +++ b/test/spec/ol/render/canvas/hitdetect.test.js @@ -3,7 +3,11 @@ import Feature from '../../../../../src/ol/Feature.js'; import Point from '../../../../../src/ol/geom/Point.js'; import {Style} from '../../../../../src/ol/style.js'; import {create} from '../../../../../src/ol/transform.js'; -import {createHitDetectionImageData} from '../../../../../src/ol/render/canvas/hitdetect.js'; +import {createCanvasContext2D} from '../../../../../src/ol/dom.js'; +import { + createHitDetectionImageData, + hitDetect, +} from '../../../../../src/ol/render/canvas/hitdetect.js'; describe('hitdetect', function () { let features, styleFunction; @@ -40,4 +44,53 @@ describe('hitdetect', function () { 252, ]); }); + it('detects hit at the correct position', function () { + const context = createCanvasContext2D(3, 3); + context.fillStyle = '#ffffff'; + context.fillRect(1, 1, 1, 1); + const features = [new Feature()]; + const imageData = context.getImageData(0, 0, 3, 3); + expect(hitDetect([2, 2], features, imageData)).to.have.length(1); + expect(hitDetect([2, 3], features, imageData)).to.have.length(1); + expect(hitDetect([3, 2], features, imageData)).to.have.length(1); + expect(hitDetect([3, 3], features, imageData)).to.have.length(1); + + expect(hitDetect([1.5, 1.5], features, imageData)).to.have.length(1); + expect(hitDetect([3.4, 3.4], features, imageData)).to.have.length(1); + + expect(hitDetect([1.4, 1], features, imageData)).to.have.length(0); + expect(hitDetect([1, 2.4], features, imageData)).to.have.length(0); + expect(hitDetect([2.4, 1], features, imageData)).to.have.length(0); + + expect(hitDetect([3.5, 4.5], features, imageData)).to.have.length(0); + expect(hitDetect([5, 4], features, imageData)).to.have.length(0); + expect(hitDetect([4.5, 5], features, imageData)).to.have.length(0); + + expect(hitDetect([1.4, 3.5], features, imageData)).to.have.length(0); + expect(hitDetect([1, 4.5], features, imageData)).to.have.length(0); + expect(hitDetect([1.5, 5], features, imageData)).to.have.length(0); + }); + it('correctly detects hit for pixel exceeding canvas dimension', function () { + const features = [new Feature()]; + const context = createCanvasContext2D(2, 2); + context.fillStyle = '#ffffff'; + + context.fillRect(1, 1, 1, 1); + let imageData = context.getImageData(0, 0, 2, 2); + expect(hitDetect([4, 2], features, imageData)).to.have.length(1); + expect(hitDetect([2, 4], features, imageData)).to.have.length(1); + + expect(hitDetect([-2, 4], features, imageData)).to.have.length(0); + expect(hitDetect([4, -2], features, imageData)).to.have.length(0); + + context.clearRect(0, 0, context.canvas.width, context.canvas.height); + + context.fillRect(0, 0, 1, 1); + imageData = context.getImageData(0, 0, 2, 2); + expect(hitDetect([-2, 0], features, imageData)).to.have.length(1); + expect(hitDetect([0, -2], features, imageData)).to.have.length(1); + + expect(hitDetect([-2, 4], features, imageData)).to.have.length(0); + expect(hitDetect([4, -2], features, imageData)).to.have.length(0); + }); });