From dc51c22f385175ac35ea6311033fa3588d9e6054 Mon Sep 17 00:00:00 2001 From: JuFeng Zhang Date: Mon, 29 Jun 2020 19:53:01 +0800 Subject: [PATCH 1/3] fix a eslint error --- package.json | 2 +- scripts/test/matchers/sensor.js | 4 +++- 2 files changed, 4 insertions(+), 2 deletions(-) diff --git a/package.json b/package.json index e46fa0c..a9bf3fd 100644 --- a/package.json +++ b/package.json @@ -34,7 +34,7 @@ "watch": "node scripts/watch.js", "prepare": "yarn build:development", "prepublishOnly": "yarn build:production", - "lint": "eslint ./src --max-warnings 0", + "lint": "eslint ./src ./scripts --max-warnings 0", "esdoc": "esdoc -c esdoc.json", "test": "jest --config config.json", "test-ci": "jest --config config.json --coverage && codecov", diff --git a/scripts/test/matchers/sensor.js b/scripts/test/matchers/sensor.js index 1e9cfa5..8548af3 100644 --- a/scripts/test/matchers/sensor.js +++ b/scripts/test/matchers/sensor.js @@ -2,7 +2,9 @@ function toHaveTriggeredSensorEvent(received, expectedEventName, count) { let triggered = false; let callCount = 0; function callback() { - count !== undefined && (callCount = callCount + 1); + if (count !== undefined) { + callCount++; + } triggered = true; } From c21ddf8a4f26d63edbca762685225c984f93ff67 Mon Sep 17 00:00:00 2001 From: JuFeng Zhang Date: Mon, 29 Jun 2020 19:53:01 +0800 Subject: [PATCH 2/3] update waitForDragDelay param --- src/Draggable/tests/Draggable.test.js | 50 +++++++++++++-------------- 1 file changed, 25 insertions(+), 25 deletions(-) diff --git a/src/Draggable/tests/Draggable.test.js b/src/Draggable/tests/Draggable.test.js index 7f34a45..2229f2b 100644 --- a/src/Draggable/tests/Draggable.test.js +++ b/src/Draggable/tests/Draggable.test.js @@ -326,7 +326,7 @@ describe('Draggable', () => { triggerEvent(draggableElement, 'mousedown', {button: 0}); // Wait for delay - waitForDragDelay(100); + waitForDragDelay(); const containerChildren = newInstance.getDraggableElementsForContainer(draggableElement.parentNode); @@ -349,7 +349,7 @@ describe('Draggable', () => { const dynamicContainer = document.querySelector('.DynamicContainer'); clickMouse(draggableElement); - waitForDragDelay(100); + waitForDragDelay(); moveMouse(dynamicContainer); expect(dragOverContainerHandler).not.toHaveBeenCalled(); @@ -361,7 +361,7 @@ describe('Draggable', () => { expect(newInstance.containers).toEqual([...containers, dynamicContainer]); clickMouse(draggableElement); - waitForDragDelay(100); + waitForDragDelay(); moveMouse(dynamicContainer); expect(dragOverContainerHandler).toHaveBeenCalled(); @@ -383,7 +383,7 @@ describe('Draggable', () => { const dynamicContainer = document.querySelector('.DynamicContainer'); clickMouse(draggableElement); - waitForDragDelay(100); + waitForDragDelay(); moveMouse(dynamicContainer); expect(dragOverContainerHandler).toHaveBeenCalled(); @@ -398,7 +398,7 @@ describe('Draggable', () => { newInstance.on('drag:over:container', dragOverContainerHandler); clickMouse(draggableElement); - waitForDragDelay(100); + waitForDragDelay(); moveMouse(dynamicContainer); expect(dragOverContainerHandler).not.toHaveBeenCalled(); @@ -483,7 +483,7 @@ describe('Draggable', () => { triggerEvent(draggableElement, 'mousedown', {button: 0}); // Wait for delay - waitForDragDelay(100); + waitForDragDelay(); const call = callback.mock.calls[0][0]; @@ -507,7 +507,7 @@ describe('Draggable', () => { triggerEvent(draggableElement, 'mousedown', {button: 0}); // Wait for delay - waitForDragDelay(100); + waitForDragDelay(); triggerEvent(draggableElement, 'dragstart', {button: 0}); @@ -540,7 +540,7 @@ describe('Draggable', () => { triggerEvent(draggableElement, 'mousedown', {button: 0}); // Wait for delay - waitForDragDelay(100); + waitForDragDelay(); triggerEvent(draggableElement, 'dragstart', {button: 0}); @@ -559,7 +559,7 @@ describe('Draggable', () => { triggerEvent(draggableElement, 'mousedown', {button: 0}); // Wait for delay - waitForDragDelay(100); + waitForDragDelay(); const callback = jest.fn(); newInstance.on('drag:move', callback); @@ -593,7 +593,7 @@ describe('Draggable', () => { triggerEvent(draggableElement, 'mousedown', {button: 0}); // Wait for delay - waitForDragDelay(100); + waitForDragDelay(); const callback = jest.fn(); newInstance.on('drag:stop', callback); @@ -617,7 +617,7 @@ describe('Draggable', () => { triggerEvent(draggableElement, 'mousedown', {button: 0}); // Wait for delay - waitForDragDelay(100); + waitForDragDelay(); expect(newInstance.source.classList).toContain('draggable-source--is-dragging'); @@ -634,7 +634,7 @@ describe('Draggable', () => { triggerEvent(draggableElement, 'mousedown', {button: 0}); // Wait for delay - waitForDragDelay(100); + waitForDragDelay(); const source = newInstance.source; @@ -659,7 +659,7 @@ describe('Draggable', () => { triggerEvent(draggableElement, 'mousedown', {button: 0}); // Wait for delay - waitForDragDelay(100); + waitForDragDelay(); const source = newInstance.source; @@ -679,7 +679,7 @@ describe('Draggable', () => { triggerEvent(draggableElement, 'mousedown', {button: 0}); // Wait for delay - waitForDragDelay(100); + waitForDragDelay(); expect(document.body.classList).toContain('draggable--is-dragging'); @@ -697,7 +697,7 @@ describe('Draggable', () => { triggerEvent(draggableElement, 'mousedown', {button: 0}); // Wait for delay - waitForDragDelay(100); + waitForDragDelay(); expect(document.body.classList).toContain('draggable--is-dragging'); triggerEvent(document.body, 'mouseup', {button: 0}); @@ -719,7 +719,7 @@ describe('Draggable', () => { triggerEvent(draggableElement, 'mousedown', {button: 0}); // Wait for delay - waitForDragDelay(100); + waitForDragDelay(); expect(document.body.classList).not.toContain('draggable--is-dragging'); @@ -737,7 +737,7 @@ describe('Draggable', () => { triggerEvent(draggableElement, 'mousedown', {button: 0}); // Wait for delay - waitForDragDelay(100); + waitForDragDelay(); triggerEvent(draggableElement, 'mouseup', {button: 0}); @@ -755,7 +755,7 @@ describe('Draggable', () => { triggerEvent(draggableElement, 'mousedown', {button: 0}); // Wait for delay - waitForDragDelay(100); + waitForDragDelay(); triggerEvent(document.body, 'mouseup', {button: 0}); @@ -778,7 +778,7 @@ describe('Draggable', () => { triggerEvent(draggableElement, 'mousedown', {button: 0}); // Wait for delay - waitForDragDelay(100); + waitForDragDelay(); expect(containers[0].classList).toContain('draggable-container--is-dragging'); @@ -796,7 +796,7 @@ describe('Draggable', () => { triggerEvent(draggableElement, 'mousedown', {button: 0}); // Wait for delay - waitForDragDelay(100); + waitForDragDelay(); expect(containers[0].classList).toContain('draggable-container--is-dragging'); @@ -818,7 +818,7 @@ describe('Draggable', () => { triggerEvent(draggableElement, 'mousedown', {button: 0}); // Wait for delay - waitForDragDelay(100); + waitForDragDelay(); expect(containers[0].classList).not.toContain('draggable-container--is-dragging'); @@ -835,7 +835,7 @@ describe('Draggable', () => { triggerEvent(draggableElement, 'mousedown', {button: 0}); // Wait for delay - waitForDragDelay(100); + waitForDragDelay(); expect(draggableElement.classList.contains(newInstance.getClassNameFor('source:original'))).toBeTruthy(); @@ -863,7 +863,7 @@ describe('Draggable', () => { triggerEvent(draggableElement, 'mousedown', {button: 0}); // Wait for delay - waitForDragDelay(100); + waitForDragDelay(); expect(newInstance.isDragging()).toBe(true); @@ -871,13 +871,13 @@ describe('Draggable', () => { triggerEvent(draggableElement.nextElementSibling, 'mousemove', {button: 0}); // Wait for delay - waitForDragDelay(100); + waitForDragDelay(); document.elementFromPoint = () => document.body; triggerEvent(document.body, 'mousemove', {button: 0}); // Wait for delay - waitForDragDelay(100); + waitForDragDelay(); triggerEvent(document.body, 'mouseup', {button: 0}); }); From 0e15a2d1ddc0c33f61bf4edaecb55b1d79beea6d Mon Sep 17 00:00:00 2001 From: JuFeng Zhang Date: Mon, 29 Jun 2020 19:53:01 +0800 Subject: [PATCH 3/3] add some LFs and docblocks --- src/Draggable/Sensors/MouseSensor/MouseSensor.js | 14 ++++++++++++++ .../Sensors/MouseSensor/tests/MouseSensor.test.js | 1 + src/Draggable/Sensors/TouchSensor/TouchSensor.js | 14 ++++++++++++++ .../Sensors/TouchSensor/tests/TouchSensor.test.js | 8 ++++++++ 4 files changed, 37 insertions(+) diff --git a/src/Draggable/Sensors/MouseSensor/MouseSensor.js b/src/Draggable/Sensors/MouseSensor/MouseSensor.js index 26ffa51..2c28225 100644 --- a/src/Draggable/Sensors/MouseSensor/MouseSensor.js +++ b/src/Draggable/Sensors/MouseSensor/MouseSensor.js @@ -32,6 +32,20 @@ export default class MouseSensor extends Sensor { */ this.mouseDownTimeout = null; + /** + * Save pageX coordinates for delay drag + * @property {Numbre} pageX + * @private + */ + this.pageX = null; + + /** + * Save pageY coordinates for delay drag + * @property {Numbre} pageY + * @private + */ + this.pageY = null; + this[onContextMenuWhileDragging] = this[onContextMenuWhileDragging].bind(this); this[onMouseDown] = this[onMouseDown].bind(this); this[onMouseMove] = this[onMouseMove].bind(this); diff --git a/src/Draggable/Sensors/MouseSensor/tests/MouseSensor.test.js b/src/Draggable/Sensors/MouseSensor/tests/MouseSensor.test.js index 7e3a437..21c7004 100644 --- a/src/Draggable/Sensors/MouseSensor/tests/MouseSensor.test.js +++ b/src/Draggable/Sensors/MouseSensor/tests/MouseSensor.test.js @@ -275,6 +275,7 @@ describe('MouseSensor', () => { } expect(dragFlow).toHaveTriggeredSensorEvent('drag:start', 1); }); + it('only triggers `drag:start` sensor event once when distance is met after delay', () => { function dragFlow() { clickMouse(draggableElement); diff --git a/src/Draggable/Sensors/TouchSensor/TouchSensor.js b/src/Draggable/Sensors/TouchSensor/TouchSensor.js index 10f170e..6e4bc31 100644 --- a/src/Draggable/Sensors/TouchSensor/TouchSensor.js +++ b/src/Draggable/Sensors/TouchSensor/TouchSensor.js @@ -65,6 +65,20 @@ export default class TouchSensor extends Sensor { */ this.touchMoved = false; + /** + * Save pageX coordinates for delay drag + * @property {Numbre} pageX + * @private + */ + this.pageX = null; + + /** + * Save pageY coordinates for delay drag + * @property {Numbre} pageY + * @private + */ + this.pageY = null; + this[onTouchStart] = this[onTouchStart].bind(this); this[onTouchEnd] = this[onTouchEnd].bind(this); this[onTouchMove] = this[onTouchMove].bind(this); diff --git a/src/Draggable/Sensors/TouchSensor/tests/TouchSensor.test.js b/src/Draggable/Sensors/TouchSensor/tests/TouchSensor.test.js index 7c4d57d..a094d05 100644 --- a/src/Draggable/Sensors/TouchSensor/tests/TouchSensor.test.js +++ b/src/Draggable/Sensors/TouchSensor/tests/TouchSensor.test.js @@ -26,9 +26,12 @@ describe('TouchSensor', () => { touchSensor.detach(); sandbox.parentNode.removeChild(sandbox); } + describe('common', () => { beforeEach(setup); + afterEach(teardown); + it('cancels `drag:start` event when canceling sensor event', () => { sandbox.addEventListener('drag:start', (event) => { event.detail.cancel(); @@ -51,6 +54,7 @@ describe('TouchSensor', () => { expect(dragFlow).not.toHaveTriggeredSensorEvent('drag:start'); }); + it('prevents context menu while dragging', () => { touchStart(draggableElement); let contextMenuEvent = triggerEvent(draggableElement, 'contextmenu'); @@ -94,12 +98,14 @@ describe('TouchSensor', () => { expect(touchEndEvent.defaultPrevented).toBe(true); }); }); + describe('using distance', () => { beforeEach(() => { setup({delay: 0, distance: 1}); }); afterEach(teardown); + it('does not trigger `drag:start` before distance has been travelled', () => { function dragFlow() { touchStart(draggableElement); @@ -153,6 +159,7 @@ describe('TouchSensor', () => { beforeEach(() => { setup({delay: DRAG_DELAY, distance: 0}); }); + afterEach(teardown); it('does not trigger `drag:start` before delay ends', () => { @@ -210,6 +217,7 @@ describe('TouchSensor', () => { beforeEach(() => { setup({delay: DRAG_DELAY, distance: 1}); }); + afterEach(teardown); it('does not trigger `drag:start` before delay ends', () => {