diff --git a/test/browser/spec/ol/MapBrowserEventHandler.test.js b/test/browser/spec/ol/MapBrowserEventHandler.test.js index c4c04b980e..2abedc04ad 100644 --- a/test/browser/spec/ol/MapBrowserEventHandler.test.js +++ b/test/browser/spec/ol/MapBrowserEventHandler.test.js @@ -281,4 +281,48 @@ describe('ol/MapBrowserEventHandler', function () { expect(dblclickSpy.called).to.not.be.ok(); }); }); + + describe('Event target change', function () { + let target, handler, element, down1, down2, up1, up2; + beforeEach(function () { + target = document.createElement('div'); + handler = new MapBrowserEventHandler( + new Map({ + target: target, + }) + ); + + element = handler.element_; + down1 = new Event('pointerdown', {target: element}); + down1.clientX = 0; + down1.clientY = 0; + down1.button = 0; + down1.pointerId = 1; + down2 = new Event('pointerdown', {target: element}); + down2.clientX = 0; + down2.clientY = 0; + down2.button = 0; + down2.pointerId = 2; + up1 = new Event('pointerup', {target: element.firstChild}); + up1.clientX = 0; + up1.clientY = 0; + up1.button = 0; + up1.pointerId = 3; + up2 = new Event('pointerup', {target: element.firstChild}); + up2.clientX = 0; + up2.clientY = 0; + up2.button = 0; + up2.pointerId = 4; + }); + + it('keeps activePointers up to date when event target changes', function () { + element.dispatchEvent(down1); + element.dispatchEvent(down2); + expect(handler.activePointers_[0].pointerId).to.be(1); + expect(handler.activePointers_[1].pointerId).to.be(2); + document.dispatchEvent(up1); + document.dispatchEvent(up2); + expect(handler.activePointers_).to.have.length(0); + }); + }); }); diff --git a/test/browser/spec/ol/interaction/pointer.test.js b/test/browser/spec/ol/interaction/pointer.test.js index ee426592cd..72cc22e05c 100644 --- a/test/browser/spec/ol/interaction/pointer.test.js +++ b/test/browser/spec/ol/interaction/pointer.test.js @@ -1,7 +1,10 @@ -import Event from '../../../../../src/ol/events/Event.js'; +import Layer from '../../../../../src/ol/layer/Layer.js'; import Map from '../../../../../src/ol/Map.js'; import MapBrowserEvent from '../../../../../src/ol/MapBrowserEvent.js'; +import MapBrowserEventHandler from '../../../../../src/ol/MapBrowserEventHandler.js'; +import OlEvent from '../../../../../src/ol/events/Event.js'; import PointerInteraction from '../../../../../src/ol/interaction/Pointer.js'; +import View from '../../../../../src/ol/View.js'; describe('ol.interaction.Pointer', function () { describe('#handleEvent', function () { @@ -10,7 +13,7 @@ describe('ol.interaction.Pointer', function () { beforeEach(function () { const type = 'pointerdown'; - const pointerEvent = new Event(); + const pointerEvent = new OlEvent(); pointerEvent.type = type; pointerEvent.pointerId = 0; pointerEvent.preventDefault = function () { @@ -130,4 +133,66 @@ describe('ol.interaction.Pointer', function () { expect(handleUpCalled).to.be(true); }); }); + + describe("With a map's MapBrowserEventHandler", function () { + let target, interaction, element, down1, down2, up1, up2; + beforeEach(function () { + target = document.createElement('div'); + target.style.width = '100px'; + target.style.height = '100px'; + document.body.appendChild(target); + interaction = new PointerInteraction({}); + const handler = new MapBrowserEventHandler( + new Map({ + target: target, + layers: [ + new Layer({ + render: () => {}, + }), + ], + interactions: [interaction], + view: new View({ + center: [0, 0], + zoom: 0, + }), + }) + ); + handler.map_.renderSync(); + element = handler.element_; + down1 = new Event('pointerdown', {target: element}); + down1.clientX = 0; + down1.clientY = 0; + down1.button = 0; + down1.pointerId = 1; + down2 = new Event('pointerdown', {target: element}); + down2.clientX = 0; + down2.clientY = 0; + down2.button = 0; + down2.pointerId = 2; + up1 = new Event('pointerup', {target: element.firstChild}); + up1.clientX = 0; + up1.clientY = 0; + up1.button = 0; + up1.pointerId = 1; + up2 = new Event('pointerup', {target: element.firstChild}); + up2.clientX = 0; + up2.clientY = 0; + up2.button = 0; + up2.pointerId = 2; + }); + + afterEach(function () { + document.body.removeChild(target); + }); + + it('tracks pointers correctly', function () { + element.dispatchEvent(down1); + element.dispatchEvent(down2); + expect(interaction.targetPointers[0].pointerId).to.be(1); + expect(interaction.targetPointers[1].pointerId).to.be(2); + document.dispatchEvent(up1); + document.dispatchEvent(up2); + expect(interaction.targetPointers).to.have.length(0); + }); + }); });