diff --git a/test/interaction/InteractionManager.js b/test/interaction/InteractionManager.js index ba3ecef..47d6819 100644 --- a/test/interaction/InteractionManager.js +++ b/test/interaction/InteractionManager.js @@ -1,31 +1,17 @@ 'use strict'; +const MockPointer = require('./MockPointer'); + describe('PIXI.interaction.InteractionManager', function () { describe('onClick', function () { - function click(stage, x, y) - { - const renderer = new PIXI.CanvasRenderer(100, 100); - - renderer.sayHello = () => { /* empty */ }; - renderer.render(stage); - - renderer.plugins.interaction.mapPositionToPoint = (point) => - { - point.x = x; - point.y = y; - }; - - renderer.plugins.interaction.onMouseDown({ clientX: x, clientY: y, preventDefault: sinon.stub() }); - renderer.plugins.interaction.onMouseUp({ clientX: x, clientY: y, preventDefault: sinon.stub() }); - } - it('should call handler when inside', function () { const stage = new PIXI.Container(); const graphics = new PIXI.Graphics(); const clickSpy = sinon.spy(); + const pointer = new MockPointer(stage); stage.addChild(graphics); graphics.beginFill(0xFFFFFF); @@ -33,7 +19,7 @@ graphics.interactive = true; graphics.on('click', clickSpy); - click(stage, 10, 10); + pointer.click(10, 10); expect(clickSpy).to.have.been.calledOnce; }); @@ -43,6 +29,7 @@ const stage = new PIXI.Container(); const graphics = new PIXI.Graphics(); const clickSpy = sinon.spy(); + const pointer = new MockPointer(stage); stage.addChild(graphics); graphics.beginFill(0xFFFFFF); @@ -50,7 +37,46 @@ graphics.interactive = true; graphics.on('click', clickSpy); - click(stage, 60, 60); + pointer.click(60, 60); + + expect(clickSpy).to.not.have.been.called; + }); + }); + + describe('onTap', function () + { + it('should call handler when inside', function () + { + const stage = new PIXI.Container(); + const graphics = new PIXI.Graphics(); + const clickSpy = sinon.spy(); + const pointer = new MockPointer(stage); + + stage.addChild(graphics); + graphics.beginFill(0xFFFFFF); + graphics.drawRect(0, 0, 50, 50); + graphics.interactive = true; + graphics.on('tap', clickSpy); + + pointer.tap(10, 10); + + expect(clickSpy).to.have.been.calledOnce; + }); + + it('should not call handler when outside', function () + { + const stage = new PIXI.Container(); + const graphics = new PIXI.Graphics(); + const clickSpy = sinon.spy(); + const pointer = new MockPointer(stage); + + stage.addChild(graphics); + graphics.beginFill(0xFFFFFF); + graphics.drawRect(0, 0, 50, 50); + graphics.interactive = true; + graphics.on('tap', clickSpy); + + pointer.tap(60, 60); expect(clickSpy).to.not.have.been.called; }); diff --git a/test/interaction/InteractionManager.js b/test/interaction/InteractionManager.js index ba3ecef..47d6819 100644 --- a/test/interaction/InteractionManager.js +++ b/test/interaction/InteractionManager.js @@ -1,31 +1,17 @@ 'use strict'; +const MockPointer = require('./MockPointer'); + describe('PIXI.interaction.InteractionManager', function () { describe('onClick', function () { - function click(stage, x, y) - { - const renderer = new PIXI.CanvasRenderer(100, 100); - - renderer.sayHello = () => { /* empty */ }; - renderer.render(stage); - - renderer.plugins.interaction.mapPositionToPoint = (point) => - { - point.x = x; - point.y = y; - }; - - renderer.plugins.interaction.onMouseDown({ clientX: x, clientY: y, preventDefault: sinon.stub() }); - renderer.plugins.interaction.onMouseUp({ clientX: x, clientY: y, preventDefault: sinon.stub() }); - } - it('should call handler when inside', function () { const stage = new PIXI.Container(); const graphics = new PIXI.Graphics(); const clickSpy = sinon.spy(); + const pointer = new MockPointer(stage); stage.addChild(graphics); graphics.beginFill(0xFFFFFF); @@ -33,7 +19,7 @@ graphics.interactive = true; graphics.on('click', clickSpy); - click(stage, 10, 10); + pointer.click(10, 10); expect(clickSpy).to.have.been.calledOnce; }); @@ -43,6 +29,7 @@ const stage = new PIXI.Container(); const graphics = new PIXI.Graphics(); const clickSpy = sinon.spy(); + const pointer = new MockPointer(stage); stage.addChild(graphics); graphics.beginFill(0xFFFFFF); @@ -50,7 +37,46 @@ graphics.interactive = true; graphics.on('click', clickSpy); - click(stage, 60, 60); + pointer.click(60, 60); + + expect(clickSpy).to.not.have.been.called; + }); + }); + + describe('onTap', function () + { + it('should call handler when inside', function () + { + const stage = new PIXI.Container(); + const graphics = new PIXI.Graphics(); + const clickSpy = sinon.spy(); + const pointer = new MockPointer(stage); + + stage.addChild(graphics); + graphics.beginFill(0xFFFFFF); + graphics.drawRect(0, 0, 50, 50); + graphics.interactive = true; + graphics.on('tap', clickSpy); + + pointer.tap(10, 10); + + expect(clickSpy).to.have.been.calledOnce; + }); + + it('should not call handler when outside', function () + { + const stage = new PIXI.Container(); + const graphics = new PIXI.Graphics(); + const clickSpy = sinon.spy(); + const pointer = new MockPointer(stage); + + stage.addChild(graphics); + graphics.beginFill(0xFFFFFF); + graphics.drawRect(0, 0, 50, 50); + graphics.interactive = true; + graphics.on('tap', clickSpy); + + pointer.tap(60, 60); expect(clickSpy).to.not.have.been.called; }); diff --git a/test/interaction/MockPointer.js b/test/interaction/MockPointer.js new file mode 100644 index 0000000..5bac0d3 --- /dev/null +++ b/test/interaction/MockPointer.js @@ -0,0 +1,115 @@ +'use strict'; + +/** + * Use this to mock mouse/touch/pointer events + * + * @class + */ +class MockPointer { + /** + * @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 + */ + constructor(stage, width, height) + { + this.stage = stage; + this.renderer = new PIXI.CanvasRenderer(width || 100, height || 100); + this.renderer.sayHello = () => { /* empty */ }; + this.interaction = this.renderer.plugins.interaction; + } + + /** + * @private + * @param {number} x - pointer x position + * @param {number} y - pointer y position + */ + setPosition(x, y) + { + this.renderer.plugins.interaction.mapPositionToPoint = (point) => + { + point.x = x; + point.y = y; + }; + } + + /** + * @private + */ + render() + { + this.renderer.render(this.stage); + } + + /** + * @param {number} x - pointer x position + * @param {number} y - pointer y position + */ + click(x, y) + { + this.mousedown(x, y); + this.mouseup(x, y); + } + + /** + * @param {number} x - pointer x position + * @param {number} y - pointer y position + */ + mousedown(x, y) + { + this.setPosition(x, y); + this.render(); + this.interaction.onMouseDown({ clientX: 0, clientY: 0, preventDefault: sinon.stub() }); + } + + /** + * @param {number} x - pointer x position + * @param {number} y - pointer y position + */ + mouseup(x, y) + { + this.setPosition(x, y); + this.render(); + this.interaction.onMouseUp({ clientX: 0, clientY: 0, preventDefault: sinon.stub() }); + } + + /** + * @param {number} x - pointer x position + * @param {number} y - pointer y position + */ + tap(x, y) + { + this.touchstart(x, y); + this.touchend(x, y); + } + + /** + * @param {number} x - pointer x position + * @param {number} y - pointer y position + */ + touchstart(x, y) + { + this.setPosition(x, y); + this.render(); + this.interaction.onTouchStart({ + preventDefault: sinon.stub(), + changedTouches: [new Touch({ identifier: 0, target: this.renderer.view })], + }); + } + + /** + * @param {number} x - pointer x position + * @param {number} y - pointer y position + */ + touchend(x, y) + { + this.setPosition(x, y); + this.render(); + this.interaction.onTouchEnd({ + preventDefault: sinon.stub(), + changedTouches: [new Touch({ identifier: 0, target: this.renderer.view })], + }); + } +} + +module.exports = MockPointer;