diff --git a/src/interaction/InteractionManager.js b/src/interaction/InteractionManager.js index 8baf13a..8d51082 100644 --- a/src/interaction/InteractionManager.js +++ b/src/interaction/InteractionManager.js @@ -914,7 +914,7 @@ { const event = events[i]; - const interactionData = this.getInteractionDataForPointerId(event.pointerId); + const interactionData = this.getInteractionDataForPointerId(event); const interactionEvent = this.configureInteractionEventForDOMEvent(this.eventData, event, interactionData); @@ -998,7 +998,7 @@ { const event = events[i]; - const interactionData = this.getInteractionDataForPointerId(event.pointerId); + const interactionData = this.getInteractionDataForPointerId(event); const interactionEvent = this.configureInteractionEventForDOMEvent(this.eventData, event, interactionData); @@ -1180,7 +1180,7 @@ { const event = events[i]; - const interactionData = this.getInteractionDataForPointerId(event.pointerId); + const interactionData = this.getInteractionDataForPointerId(event); const interactionEvent = this.configureInteractionEventForDOMEvent(this.eventData, event, interactionData); @@ -1255,7 +1255,7 @@ this.setCursorMode(null); } - const interactionData = this.getInteractionDataForPointerId(event.pointerId); + const interactionData = this.getInteractionDataForPointerId(event); const interactionEvent = this.configureInteractionEventForDOMEvent(this.eventData, event, interactionData); @@ -1344,7 +1344,7 @@ // Only mouse and pointer can call onPointerOver, so events will always be length 1 const event = events[0]; - const interactionData = this.getInteractionDataForPointerId(event.pointerId); + const interactionData = this.getInteractionDataForPointerId(event); const interactionEvent = this.configureInteractionEventForDOMEvent(this.eventData, event, interactionData); @@ -1366,12 +1366,14 @@ * Get InteractionData for a given pointerId. Store that data as well * * @private - * @param {number} pointerId - Identifier from a pointer event + * @param {PointerEvent} event - Normalized pointer event, output from normalizeToPointerData * @return {InteractionData} - Interaction data for the given pointer identifier */ - getInteractionDataForPointerId(pointerId) + getInteractionDataForPointerId(event) { - if (pointerId === MOUSE_POINTER_ID) + const pointerId = event.pointerId; + + if (pointerId === MOUSE_POINTER_ID || event.pointerType === 'mouse') { return this.mouse; } diff --git a/src/interaction/InteractionManager.js b/src/interaction/InteractionManager.js index 8baf13a..8d51082 100644 --- a/src/interaction/InteractionManager.js +++ b/src/interaction/InteractionManager.js @@ -914,7 +914,7 @@ { const event = events[i]; - const interactionData = this.getInteractionDataForPointerId(event.pointerId); + const interactionData = this.getInteractionDataForPointerId(event); const interactionEvent = this.configureInteractionEventForDOMEvent(this.eventData, event, interactionData); @@ -998,7 +998,7 @@ { const event = events[i]; - const interactionData = this.getInteractionDataForPointerId(event.pointerId); + const interactionData = this.getInteractionDataForPointerId(event); const interactionEvent = this.configureInteractionEventForDOMEvent(this.eventData, event, interactionData); @@ -1180,7 +1180,7 @@ { const event = events[i]; - const interactionData = this.getInteractionDataForPointerId(event.pointerId); + const interactionData = this.getInteractionDataForPointerId(event); const interactionEvent = this.configureInteractionEventForDOMEvent(this.eventData, event, interactionData); @@ -1255,7 +1255,7 @@ this.setCursorMode(null); } - const interactionData = this.getInteractionDataForPointerId(event.pointerId); + const interactionData = this.getInteractionDataForPointerId(event); const interactionEvent = this.configureInteractionEventForDOMEvent(this.eventData, event, interactionData); @@ -1344,7 +1344,7 @@ // Only mouse and pointer can call onPointerOver, so events will always be length 1 const event = events[0]; - const interactionData = this.getInteractionDataForPointerId(event.pointerId); + const interactionData = this.getInteractionDataForPointerId(event); const interactionEvent = this.configureInteractionEventForDOMEvent(this.eventData, event, interactionData); @@ -1366,12 +1366,14 @@ * Get InteractionData for a given pointerId. Store that data as well * * @private - * @param {number} pointerId - Identifier from a pointer event + * @param {PointerEvent} event - Normalized pointer event, output from normalizeToPointerData * @return {InteractionData} - Interaction data for the given pointer identifier */ - getInteractionDataForPointerId(pointerId) + getInteractionDataForPointerId(event) { - if (pointerId === MOUSE_POINTER_ID) + const pointerId = event.pointerId; + + if (pointerId === MOUSE_POINTER_ID || event.pointerType === 'mouse') { return this.mouse; } diff --git a/test/.eslintrc.json b/test/.eslintrc.json index e03220d..ac12110 100644 --- a/test/.eslintrc.json +++ b/test/.eslintrc.json @@ -12,7 +12,8 @@ "sinon": false, "expect": false, "assert": false, - "PIXI": false + "PIXI": false, + "PointerEvent": true }, "rules": { "func-names": 0, diff --git a/src/interaction/InteractionManager.js b/src/interaction/InteractionManager.js index 8baf13a..8d51082 100644 --- a/src/interaction/InteractionManager.js +++ b/src/interaction/InteractionManager.js @@ -914,7 +914,7 @@ { const event = events[i]; - const interactionData = this.getInteractionDataForPointerId(event.pointerId); + const interactionData = this.getInteractionDataForPointerId(event); const interactionEvent = this.configureInteractionEventForDOMEvent(this.eventData, event, interactionData); @@ -998,7 +998,7 @@ { const event = events[i]; - const interactionData = this.getInteractionDataForPointerId(event.pointerId); + const interactionData = this.getInteractionDataForPointerId(event); const interactionEvent = this.configureInteractionEventForDOMEvent(this.eventData, event, interactionData); @@ -1180,7 +1180,7 @@ { const event = events[i]; - const interactionData = this.getInteractionDataForPointerId(event.pointerId); + const interactionData = this.getInteractionDataForPointerId(event); const interactionEvent = this.configureInteractionEventForDOMEvent(this.eventData, event, interactionData); @@ -1255,7 +1255,7 @@ this.setCursorMode(null); } - const interactionData = this.getInteractionDataForPointerId(event.pointerId); + const interactionData = this.getInteractionDataForPointerId(event); const interactionEvent = this.configureInteractionEventForDOMEvent(this.eventData, event, interactionData); @@ -1344,7 +1344,7 @@ // Only mouse and pointer can call onPointerOver, so events will always be length 1 const event = events[0]; - const interactionData = this.getInteractionDataForPointerId(event.pointerId); + const interactionData = this.getInteractionDataForPointerId(event); const interactionEvent = this.configureInteractionEventForDOMEvent(this.eventData, event, interactionData); @@ -1366,12 +1366,14 @@ * Get InteractionData for a given pointerId. Store that data as well * * @private - * @param {number} pointerId - Identifier from a pointer event + * @param {PointerEvent} event - Normalized pointer event, output from normalizeToPointerData * @return {InteractionData} - Interaction data for the given pointer identifier */ - getInteractionDataForPointerId(pointerId) + getInteractionDataForPointerId(event) { - if (pointerId === MOUSE_POINTER_ID) + const pointerId = event.pointerId; + + if (pointerId === MOUSE_POINTER_ID || event.pointerType === 'mouse') { return this.mouse; } diff --git a/test/.eslintrc.json b/test/.eslintrc.json index e03220d..ac12110 100644 --- a/test/.eslintrc.json +++ b/test/.eslintrc.json @@ -12,7 +12,8 @@ "sinon": false, "expect": false, "assert": false, - "PIXI": false + "PIXI": false, + "PointerEvent": true }, "rules": { "func-names": 0, diff --git a/test/interaction/InteractionManager.js b/test/interaction/InteractionManager.js index 0e7e707..d35c398 100644 --- a/test/interaction/InteractionManager.js +++ b/test/interaction/InteractionManager.js @@ -4,6 +4,16 @@ describe('PIXI.interaction.InteractionManager', function () { + afterEach(function () + { + // if we made a MockPointer for the test, clean it up + if (this.pointer) + { + this.pointer.cleanUp(); + this.pointer = null; + } + }); + describe('event basics', function () { it('should call mousedown handler', function () @@ -11,7 +21,7 @@ const stage = new PIXI.Container(); const graphics = new PIXI.Graphics(); const eventSpy = sinon.spy(); - const pointer = new MockPointer(stage); + const pointer = this.pointer = new MockPointer(stage); stage.addChild(graphics); graphics.beginFill(0xFFFFFF); @@ -29,7 +39,7 @@ const stage = new PIXI.Container(); const graphics = new PIXI.Graphics(); const eventSpy = sinon.spy(); - const pointer = new MockPointer(stage); + const pointer = this.pointer = new MockPointer(stage); stage.addChild(graphics); graphics.beginFill(0xFFFFFF); @@ -47,7 +57,7 @@ const stage = new PIXI.Container(); const graphics = new PIXI.Graphics(); const eventSpy = sinon.spy(); - const pointer = new MockPointer(stage); + const pointer = this.pointer = new MockPointer(stage); stage.addChild(graphics); graphics.beginFill(0xFFFFFF); @@ -66,7 +76,7 @@ const stage = new PIXI.Container(); const graphics = new PIXI.Graphics(); const eventSpy = sinon.spy(); - const pointer = new MockPointer(stage); + const pointer = this.pointer = new MockPointer(stage); stage.addChild(graphics); graphics.beginFill(0xFFFFFF); @@ -84,7 +94,7 @@ const stage = new PIXI.Container(); const graphics = new PIXI.Graphics(); const eventSpy = sinon.spy(); - const pointer = new MockPointer(stage); + const pointer = this.pointer = new MockPointer(stage); stage.addChild(graphics); graphics.beginFill(0xFFFFFF); @@ -286,7 +296,7 @@ const stage = new PIXI.Container(); const graphics = new PIXI.Graphics(); const clickSpy = sinon.spy(); - const pointer = new MockPointer(stage); + const pointer = this.pointer = new MockPointer(stage); stage.addChild(graphics); graphics.beginFill(0xFFFFFF); @@ -304,7 +314,7 @@ const stage = new PIXI.Container(); const graphics = new PIXI.Graphics(); const clickSpy = sinon.spy(); - const pointer = new MockPointer(stage); + const pointer = this.pointer = new MockPointer(stage); stage.addChild(graphics); graphics.beginFill(0xFFFFFF); @@ -325,7 +335,7 @@ const stage = new PIXI.Container(); const graphics = new PIXI.Graphics(); const clickSpy = sinon.spy(); - const pointer = new MockPointer(stage); + const pointer = this.pointer = new MockPointer(stage); stage.addChild(graphics); graphics.beginFill(0xFFFFFF); @@ -343,7 +353,7 @@ const stage = new PIXI.Container(); const graphics = new PIXI.Graphics(); const clickSpy = sinon.spy(); - const pointer = new MockPointer(stage); + const pointer = this.pointer = new MockPointer(stage); stage.addChild(graphics); graphics.beginFill(0xFFFFFF); @@ -396,7 +406,7 @@ it('should callback front child when clicking front child', function () { const stage = new PIXI.Container(); - const pointer = new MockPointer(stage); + const pointer = this.pointer = new MockPointer(stage); const scene = getScene('click'); scene.behindChild.interactive = true; @@ -414,7 +424,7 @@ it('should callback front child when clicking overlap', function () { const stage = new PIXI.Container(); - const pointer = new MockPointer(stage); + const pointer = this.pointer = new MockPointer(stage); const scene = getScene('click'); scene.behindChild.interactive = true; @@ -432,7 +442,7 @@ it('should callback behind child when clicking behind child', function () { const stage = new PIXI.Container(); - const pointer = new MockPointer(stage); + const pointer = this.pointer = new MockPointer(stage); const scene = getScene('click'); scene.behindChild.interactive = true; @@ -453,7 +463,7 @@ it('should not callback when clicking front child', function () { const stage = new PIXI.Container(); - const pointer = new MockPointer(stage); + const pointer = this.pointer = new MockPointer(stage); const scene = getScene('click'); scene.behindChild.interactive = true; @@ -470,7 +480,7 @@ it('should callback behind child when clicking overlap', function () { const stage = new PIXI.Container(); - const pointer = new MockPointer(stage); + const pointer = this.pointer = new MockPointer(stage); const scene = getScene('click'); scene.behindChild.interactive = true; @@ -487,7 +497,7 @@ it('should callback behind child when clicking behind child', function () { const stage = new PIXI.Container(); - const pointer = new MockPointer(stage); + const pointer = this.pointer = new MockPointer(stage); const scene = getScene('click'); scene.behindChild.interactive = true; @@ -507,7 +517,7 @@ it('should callback front child when clicking front child', function () { const stage = new PIXI.Container(); - const pointer = new MockPointer(stage); + const pointer = this.pointer = new MockPointer(stage); const scene = getScene('click'); scene.behindChild.x = 25; @@ -524,7 +534,7 @@ it('should callback front child when clicking overlap', function () { const stage = new PIXI.Container(); - const pointer = new MockPointer(stage); + const pointer = this.pointer = new MockPointer(stage); const scene = getScene('click'); scene.behindChild.x = 25; @@ -541,7 +551,7 @@ it('should not callback when clicking behind child', function () { const stage = new PIXI.Container(); - const pointer = new MockPointer(stage); + const pointer = this.pointer = new MockPointer(stage); const scene = getScene('click'); scene.behindChild.x = 25; @@ -564,7 +574,7 @@ it('should callback parent and front child when clicking front child', function () { const stage = new PIXI.Container(); - const pointer = new MockPointer(stage); + const pointer = this.pointer = new MockPointer(stage); const scene = getScene('click'); scene.behindChild.interactive = true; @@ -583,7 +593,7 @@ it('should callback parent and front child when clicking overlap', function () { const stage = new PIXI.Container(); - const pointer = new MockPointer(stage); + const pointer = this.pointer = new MockPointer(stage); const scene = getScene('click'); scene.behindChild.interactive = true; @@ -602,7 +612,7 @@ it('should callback parent and behind child when clicking behind child', function () { const stage = new PIXI.Container(); - const pointer = new MockPointer(stage); + const pointer = this.pointer = new MockPointer(stage); const scene = getScene('click'); scene.behindChild.interactive = true; @@ -624,7 +634,7 @@ it('should callback parent when clicking front child', function () { const stage = new PIXI.Container(); - const pointer = new MockPointer(stage); + const pointer = this.pointer = new MockPointer(stage); const scene = getScene('click'); scene.behindChild.interactive = true; @@ -642,7 +652,7 @@ it('should callback parent and behind child when clicking overlap', function () { const stage = new PIXI.Container(); - const pointer = new MockPointer(stage); + const pointer = this.pointer = new MockPointer(stage); const scene = getScene('click'); scene.behindChild.interactive = true; @@ -660,7 +670,7 @@ it('should callback parent and behind child when clicking behind child', function () { const stage = new PIXI.Container(); - const pointer = new MockPointer(stage); + const pointer = this.pointer = new MockPointer(stage); const scene = getScene('click'); scene.behindChild.interactive = true; @@ -681,7 +691,7 @@ it('should callback parent and front child when clicking front child', function () { const stage = new PIXI.Container(); - const pointer = new MockPointer(stage); + const pointer = this.pointer = new MockPointer(stage); const scene = getScene('click'); scene.behindChild.x = 25; @@ -699,7 +709,7 @@ it('should callback parent and front child when clicking overlap', function () { const stage = new PIXI.Container(); - const pointer = new MockPointer(stage); + const pointer = this.pointer = new MockPointer(stage); const scene = getScene('click'); scene.behindChild.x = 25; @@ -717,7 +727,7 @@ it('should callback parent when clicking behind child', function () { const stage = new PIXI.Container(); - const pointer = new MockPointer(stage); + const pointer = this.pointer = new MockPointer(stage); const scene = getScene('click'); scene.behindChild.x = 25; @@ -741,7 +751,7 @@ { const stage = new PIXI.Container(); const graphics = new PIXI.Graphics(); - const pointer = new MockPointer(stage); + const pointer = this.pointer = new MockPointer(stage); stage.addChild(graphics); graphics.beginFill(0xFFFFFF); @@ -759,7 +769,7 @@ { const stage = new PIXI.Container(); const graphics = new PIXI.Graphics(); - const pointer = new MockPointer(stage); + const pointer = this.pointer = new MockPointer(stage); stage.addChild(graphics); graphics.beginFill(0xFFFFFF); @@ -778,7 +788,7 @@ { const stage = new PIXI.Container(); const graphics = new PIXI.Graphics(); - const pointer = new MockPointer(stage); + const pointer = this.pointer = new MockPointer(stage); stage.addChild(graphics); graphics.beginFill(0xFFFFFF); @@ -797,7 +807,7 @@ { const stage = new PIXI.Container(); const graphics = new PIXI.Graphics(); - const pointer = new MockPointer(stage); + const pointer = this.pointer = new MockPointer(stage); stage.addChild(graphics); graphics.beginFill(0xFFFFFF); @@ -818,7 +828,7 @@ const graphics = new PIXI.Graphics(); const overSpy = sinon.spy(); const defaultSpy = sinon.spy(); - const pointer = new MockPointer(stage); + const pointer = this.pointer = new MockPointer(stage); stage.addChild(graphics); graphics.beginFill(0xFFFFFF); @@ -840,7 +850,7 @@ const stage = new PIXI.Container(); const graphics = new PIXI.Graphics(); const defaultSpy = sinon.spy(); - const pointer = new MockPointer(stage); + const pointer = this.pointer = new MockPointer(stage); stage.addChild(graphics); graphics.beginFill(0xFFFFFF); @@ -859,7 +869,7 @@ { const stage = new PIXI.Container(); const graphics = new PIXI.Graphics(); - const pointer = new MockPointer(stage); + const pointer = this.pointer = new MockPointer(stage); stage.addChild(graphics); graphics.beginFill(0xFFFFFF); @@ -881,7 +891,7 @@ { const stage = new PIXI.Container(); const graphics = new PIXI.Graphics(); - const pointer = new MockPointer(stage); + const pointer = this.pointer = new MockPointer(stage); stage.addChild(graphics); graphics.beginFill(0xFFFFFF); @@ -932,7 +942,7 @@ it('should stop hitTesting after first hit', function () { const scene = getScene(); - const pointer = new MockPointer(scene.stage); + const pointer = this.pointer = new MockPointer(scene.stage); const frontHitTest = sinon.spy(scene.frontChild, 'containsPoint'); const middleHitTest = sinon.spy(scene.middleChild, 'containsPoint'); const behindHitTest = sinon.spy(scene.behindChild, 'containsPoint'); @@ -954,7 +964,7 @@ it('should stop hitTesting after first hit', function () { const scene = getScene(); - const pointer = new MockPointer(scene.stage); + const pointer = this.pointer = new MockPointer(scene.stage); const frontHitTest = sinon.spy(scene.frontChild, 'containsPoint'); const middleHitTest = sinon.spy(scene.middleChild, 'containsPoint'); const behindHitTest = sinon.spy(scene.behindChild, 'containsPoint'); @@ -971,4 +981,24 @@ }); }); }); + + describe('pointer handling', function () + { + it('pointer event from mouse should use single mouse data', function () + { + const stage = new PIXI.Container(); + const graphics = new PIXI.Graphics(); + const pointer = this.pointer = new MockPointer(stage, 100, 100, true); + + stage.addChild(graphics); + graphics.beginFill(0xFFFFFF); + graphics.drawRect(0, 0, 50, 50); + graphics.interactive = true; + + pointer.mousemove(20, 10, true); + + expect(pointer.interaction.mouse.global.x).to.equal(20); + expect(pointer.interaction.mouse.global.y).to.equal(10); + }); + }); }); diff --git a/src/interaction/InteractionManager.js b/src/interaction/InteractionManager.js index 8baf13a..8d51082 100644 --- a/src/interaction/InteractionManager.js +++ b/src/interaction/InteractionManager.js @@ -914,7 +914,7 @@ { const event = events[i]; - const interactionData = this.getInteractionDataForPointerId(event.pointerId); + const interactionData = this.getInteractionDataForPointerId(event); const interactionEvent = this.configureInteractionEventForDOMEvent(this.eventData, event, interactionData); @@ -998,7 +998,7 @@ { const event = events[i]; - const interactionData = this.getInteractionDataForPointerId(event.pointerId); + const interactionData = this.getInteractionDataForPointerId(event); const interactionEvent = this.configureInteractionEventForDOMEvent(this.eventData, event, interactionData); @@ -1180,7 +1180,7 @@ { const event = events[i]; - const interactionData = this.getInteractionDataForPointerId(event.pointerId); + const interactionData = this.getInteractionDataForPointerId(event); const interactionEvent = this.configureInteractionEventForDOMEvent(this.eventData, event, interactionData); @@ -1255,7 +1255,7 @@ this.setCursorMode(null); } - const interactionData = this.getInteractionDataForPointerId(event.pointerId); + const interactionData = this.getInteractionDataForPointerId(event); const interactionEvent = this.configureInteractionEventForDOMEvent(this.eventData, event, interactionData); @@ -1344,7 +1344,7 @@ // Only mouse and pointer can call onPointerOver, so events will always be length 1 const event = events[0]; - const interactionData = this.getInteractionDataForPointerId(event.pointerId); + const interactionData = this.getInteractionDataForPointerId(event); const interactionEvent = this.configureInteractionEventForDOMEvent(this.eventData, event, interactionData); @@ -1366,12 +1366,14 @@ * Get InteractionData for a given pointerId. Store that data as well * * @private - * @param {number} pointerId - Identifier from a pointer event + * @param {PointerEvent} event - Normalized pointer event, output from normalizeToPointerData * @return {InteractionData} - Interaction data for the given pointer identifier */ - getInteractionDataForPointerId(pointerId) + getInteractionDataForPointerId(event) { - if (pointerId === MOUSE_POINTER_ID) + const pointerId = event.pointerId; + + if (pointerId === MOUSE_POINTER_ID || event.pointerType === 'mouse') { return this.mouse; } diff --git a/test/.eslintrc.json b/test/.eslintrc.json index e03220d..ac12110 100644 --- a/test/.eslintrc.json +++ b/test/.eslintrc.json @@ -12,7 +12,8 @@ "sinon": false, "expect": false, "assert": false, - "PIXI": false + "PIXI": false, + "PointerEvent": true }, "rules": { "func-names": 0, diff --git a/test/interaction/InteractionManager.js b/test/interaction/InteractionManager.js index 0e7e707..d35c398 100644 --- a/test/interaction/InteractionManager.js +++ b/test/interaction/InteractionManager.js @@ -4,6 +4,16 @@ describe('PIXI.interaction.InteractionManager', function () { + afterEach(function () + { + // if we made a MockPointer for the test, clean it up + if (this.pointer) + { + this.pointer.cleanUp(); + this.pointer = null; + } + }); + describe('event basics', function () { it('should call mousedown handler', function () @@ -11,7 +21,7 @@ const stage = new PIXI.Container(); const graphics = new PIXI.Graphics(); const eventSpy = sinon.spy(); - const pointer = new MockPointer(stage); + const pointer = this.pointer = new MockPointer(stage); stage.addChild(graphics); graphics.beginFill(0xFFFFFF); @@ -29,7 +39,7 @@ const stage = new PIXI.Container(); const graphics = new PIXI.Graphics(); const eventSpy = sinon.spy(); - const pointer = new MockPointer(stage); + const pointer = this.pointer = new MockPointer(stage); stage.addChild(graphics); graphics.beginFill(0xFFFFFF); @@ -47,7 +57,7 @@ const stage = new PIXI.Container(); const graphics = new PIXI.Graphics(); const eventSpy = sinon.spy(); - const pointer = new MockPointer(stage); + const pointer = this.pointer = new MockPointer(stage); stage.addChild(graphics); graphics.beginFill(0xFFFFFF); @@ -66,7 +76,7 @@ const stage = new PIXI.Container(); const graphics = new PIXI.Graphics(); const eventSpy = sinon.spy(); - const pointer = new MockPointer(stage); + const pointer = this.pointer = new MockPointer(stage); stage.addChild(graphics); graphics.beginFill(0xFFFFFF); @@ -84,7 +94,7 @@ const stage = new PIXI.Container(); const graphics = new PIXI.Graphics(); const eventSpy = sinon.spy(); - const pointer = new MockPointer(stage); + const pointer = this.pointer = new MockPointer(stage); stage.addChild(graphics); graphics.beginFill(0xFFFFFF); @@ -286,7 +296,7 @@ const stage = new PIXI.Container(); const graphics = new PIXI.Graphics(); const clickSpy = sinon.spy(); - const pointer = new MockPointer(stage); + const pointer = this.pointer = new MockPointer(stage); stage.addChild(graphics); graphics.beginFill(0xFFFFFF); @@ -304,7 +314,7 @@ const stage = new PIXI.Container(); const graphics = new PIXI.Graphics(); const clickSpy = sinon.spy(); - const pointer = new MockPointer(stage); + const pointer = this.pointer = new MockPointer(stage); stage.addChild(graphics); graphics.beginFill(0xFFFFFF); @@ -325,7 +335,7 @@ const stage = new PIXI.Container(); const graphics = new PIXI.Graphics(); const clickSpy = sinon.spy(); - const pointer = new MockPointer(stage); + const pointer = this.pointer = new MockPointer(stage); stage.addChild(graphics); graphics.beginFill(0xFFFFFF); @@ -343,7 +353,7 @@ const stage = new PIXI.Container(); const graphics = new PIXI.Graphics(); const clickSpy = sinon.spy(); - const pointer = new MockPointer(stage); + const pointer = this.pointer = new MockPointer(stage); stage.addChild(graphics); graphics.beginFill(0xFFFFFF); @@ -396,7 +406,7 @@ it('should callback front child when clicking front child', function () { const stage = new PIXI.Container(); - const pointer = new MockPointer(stage); + const pointer = this.pointer = new MockPointer(stage); const scene = getScene('click'); scene.behindChild.interactive = true; @@ -414,7 +424,7 @@ it('should callback front child when clicking overlap', function () { const stage = new PIXI.Container(); - const pointer = new MockPointer(stage); + const pointer = this.pointer = new MockPointer(stage); const scene = getScene('click'); scene.behindChild.interactive = true; @@ -432,7 +442,7 @@ it('should callback behind child when clicking behind child', function () { const stage = new PIXI.Container(); - const pointer = new MockPointer(stage); + const pointer = this.pointer = new MockPointer(stage); const scene = getScene('click'); scene.behindChild.interactive = true; @@ -453,7 +463,7 @@ it('should not callback when clicking front child', function () { const stage = new PIXI.Container(); - const pointer = new MockPointer(stage); + const pointer = this.pointer = new MockPointer(stage); const scene = getScene('click'); scene.behindChild.interactive = true; @@ -470,7 +480,7 @@ it('should callback behind child when clicking overlap', function () { const stage = new PIXI.Container(); - const pointer = new MockPointer(stage); + const pointer = this.pointer = new MockPointer(stage); const scene = getScene('click'); scene.behindChild.interactive = true; @@ -487,7 +497,7 @@ it('should callback behind child when clicking behind child', function () { const stage = new PIXI.Container(); - const pointer = new MockPointer(stage); + const pointer = this.pointer = new MockPointer(stage); const scene = getScene('click'); scene.behindChild.interactive = true; @@ -507,7 +517,7 @@ it('should callback front child when clicking front child', function () { const stage = new PIXI.Container(); - const pointer = new MockPointer(stage); + const pointer = this.pointer = new MockPointer(stage); const scene = getScene('click'); scene.behindChild.x = 25; @@ -524,7 +534,7 @@ it('should callback front child when clicking overlap', function () { const stage = new PIXI.Container(); - const pointer = new MockPointer(stage); + const pointer = this.pointer = new MockPointer(stage); const scene = getScene('click'); scene.behindChild.x = 25; @@ -541,7 +551,7 @@ it('should not callback when clicking behind child', function () { const stage = new PIXI.Container(); - const pointer = new MockPointer(stage); + const pointer = this.pointer = new MockPointer(stage); const scene = getScene('click'); scene.behindChild.x = 25; @@ -564,7 +574,7 @@ it('should callback parent and front child when clicking front child', function () { const stage = new PIXI.Container(); - const pointer = new MockPointer(stage); + const pointer = this.pointer = new MockPointer(stage); const scene = getScene('click'); scene.behindChild.interactive = true; @@ -583,7 +593,7 @@ it('should callback parent and front child when clicking overlap', function () { const stage = new PIXI.Container(); - const pointer = new MockPointer(stage); + const pointer = this.pointer = new MockPointer(stage); const scene = getScene('click'); scene.behindChild.interactive = true; @@ -602,7 +612,7 @@ it('should callback parent and behind child when clicking behind child', function () { const stage = new PIXI.Container(); - const pointer = new MockPointer(stage); + const pointer = this.pointer = new MockPointer(stage); const scene = getScene('click'); scene.behindChild.interactive = true; @@ -624,7 +634,7 @@ it('should callback parent when clicking front child', function () { const stage = new PIXI.Container(); - const pointer = new MockPointer(stage); + const pointer = this.pointer = new MockPointer(stage); const scene = getScene('click'); scene.behindChild.interactive = true; @@ -642,7 +652,7 @@ it('should callback parent and behind child when clicking overlap', function () { const stage = new PIXI.Container(); - const pointer = new MockPointer(stage); + const pointer = this.pointer = new MockPointer(stage); const scene = getScene('click'); scene.behindChild.interactive = true; @@ -660,7 +670,7 @@ it('should callback parent and behind child when clicking behind child', function () { const stage = new PIXI.Container(); - const pointer = new MockPointer(stage); + const pointer = this.pointer = new MockPointer(stage); const scene = getScene('click'); scene.behindChild.interactive = true; @@ -681,7 +691,7 @@ it('should callback parent and front child when clicking front child', function () { const stage = new PIXI.Container(); - const pointer = new MockPointer(stage); + const pointer = this.pointer = new MockPointer(stage); const scene = getScene('click'); scene.behindChild.x = 25; @@ -699,7 +709,7 @@ it('should callback parent and front child when clicking overlap', function () { const stage = new PIXI.Container(); - const pointer = new MockPointer(stage); + const pointer = this.pointer = new MockPointer(stage); const scene = getScene('click'); scene.behindChild.x = 25; @@ -717,7 +727,7 @@ it('should callback parent when clicking behind child', function () { const stage = new PIXI.Container(); - const pointer = new MockPointer(stage); + const pointer = this.pointer = new MockPointer(stage); const scene = getScene('click'); scene.behindChild.x = 25; @@ -741,7 +751,7 @@ { const stage = new PIXI.Container(); const graphics = new PIXI.Graphics(); - const pointer = new MockPointer(stage); + const pointer = this.pointer = new MockPointer(stage); stage.addChild(graphics); graphics.beginFill(0xFFFFFF); @@ -759,7 +769,7 @@ { const stage = new PIXI.Container(); const graphics = new PIXI.Graphics(); - const pointer = new MockPointer(stage); + const pointer = this.pointer = new MockPointer(stage); stage.addChild(graphics); graphics.beginFill(0xFFFFFF); @@ -778,7 +788,7 @@ { const stage = new PIXI.Container(); const graphics = new PIXI.Graphics(); - const pointer = new MockPointer(stage); + const pointer = this.pointer = new MockPointer(stage); stage.addChild(graphics); graphics.beginFill(0xFFFFFF); @@ -797,7 +807,7 @@ { const stage = new PIXI.Container(); const graphics = new PIXI.Graphics(); - const pointer = new MockPointer(stage); + const pointer = this.pointer = new MockPointer(stage); stage.addChild(graphics); graphics.beginFill(0xFFFFFF); @@ -818,7 +828,7 @@ const graphics = new PIXI.Graphics(); const overSpy = sinon.spy(); const defaultSpy = sinon.spy(); - const pointer = new MockPointer(stage); + const pointer = this.pointer = new MockPointer(stage); stage.addChild(graphics); graphics.beginFill(0xFFFFFF); @@ -840,7 +850,7 @@ const stage = new PIXI.Container(); const graphics = new PIXI.Graphics(); const defaultSpy = sinon.spy(); - const pointer = new MockPointer(stage); + const pointer = this.pointer = new MockPointer(stage); stage.addChild(graphics); graphics.beginFill(0xFFFFFF); @@ -859,7 +869,7 @@ { const stage = new PIXI.Container(); const graphics = new PIXI.Graphics(); - const pointer = new MockPointer(stage); + const pointer = this.pointer = new MockPointer(stage); stage.addChild(graphics); graphics.beginFill(0xFFFFFF); @@ -881,7 +891,7 @@ { const stage = new PIXI.Container(); const graphics = new PIXI.Graphics(); - const pointer = new MockPointer(stage); + const pointer = this.pointer = new MockPointer(stage); stage.addChild(graphics); graphics.beginFill(0xFFFFFF); @@ -932,7 +942,7 @@ it('should stop hitTesting after first hit', function () { const scene = getScene(); - const pointer = new MockPointer(scene.stage); + const pointer = this.pointer = new MockPointer(scene.stage); const frontHitTest = sinon.spy(scene.frontChild, 'containsPoint'); const middleHitTest = sinon.spy(scene.middleChild, 'containsPoint'); const behindHitTest = sinon.spy(scene.behindChild, 'containsPoint'); @@ -954,7 +964,7 @@ it('should stop hitTesting after first hit', function () { const scene = getScene(); - const pointer = new MockPointer(scene.stage); + const pointer = this.pointer = new MockPointer(scene.stage); const frontHitTest = sinon.spy(scene.frontChild, 'containsPoint'); const middleHitTest = sinon.spy(scene.middleChild, 'containsPoint'); const behindHitTest = sinon.spy(scene.behindChild, 'containsPoint'); @@ -971,4 +981,24 @@ }); }); }); + + describe('pointer handling', function () + { + it('pointer event from mouse should use single mouse data', function () + { + const stage = new PIXI.Container(); + const graphics = new PIXI.Graphics(); + const pointer = this.pointer = new MockPointer(stage, 100, 100, true); + + stage.addChild(graphics); + graphics.beginFill(0xFFFFFF); + graphics.drawRect(0, 0, 50, 50); + graphics.interactive = true; + + pointer.mousemove(20, 10, true); + + expect(pointer.interaction.mouse.global.x).to.equal(20); + expect(pointer.interaction.mouse.global.y).to.equal(10); + }); + }); }); diff --git a/test/interaction/MockPointer.js b/test/interaction/MockPointer.js index bf22490..c843045 100644 --- a/test/interaction/MockPointer.js +++ b/test/interaction/MockPointer.js @@ -11,9 +11,25 @@ * @param {PIXI.Container} stage - The root of the scene tree * @param {number} [width=100] - Width of the renderer * @param {number} [height=100] - Height of the renderer + * @param {boolean} [ensurePointerEvents=false] - If we should make sure that PointerEvents are 'supported' */ - constructor(stage, width, height) + constructor(stage, width, height, ensurePointerEvents) { + // fake PointerEvent existing + if (ensurePointerEvents && !window.PointerEvent) + { + window.PointerEvent = class PointerEvent extends MouseEvent + { + //eslint-disable-next-line + constructor(type, opts) + { + super(type, opts); + this.pointerType = opts.pointerType; + } + }; + this.createdPointerEvent = true; + } + this.stage = stage; this.renderer = new PIXI.CanvasRenderer(width || 100, height || 100); this.renderer.sayHello = () => { /* empty */ }; @@ -21,6 +37,18 @@ } /** + * Cleans up after tests + */ + cleanup() + { + if (this.createdPointerEvent) + { + delete window.PointerEvent; + } + this.renderer.destroy(); + } + + /** * @private * @param {number} x - pointer x position * @param {number} y - pointer y position @@ -45,14 +73,29 @@ /** * @param {number} x - pointer x position * @param {number} y - pointer y position + * @param {boolean} [asPointer] - if it should be a PointerEvent from a mouse */ - mousemove(x, y) + mousemove(x, y, asPointer) { - const mouseEvent = new MouseEvent('mousemove', { - clientX: x, - clientY: y, - preventDefault: sinon.stub(), - }); + let mouseEvent; + + if (asPointer) + { + mouseEvent = new PointerEvent('pointermove', { + pointerType: 'mouse', + clientX: x, + clientY: y, + preventDefault: sinon.stub(), + }); + } + else + { + mouseEvent = new MouseEvent('mousemove', { + clientX: x, + clientY: y, + preventDefault: sinon.stub(), + }); + } this.setPosition(x, y); this.render();