From 5ca1d8f260bfb64111a6ba39f76a0a935829c0f2 Mon Sep 17 00:00:00 2001 From: Tim Yung Date: Wed, 11 Mar 2020 23:07:35 -0700 Subject: [PATCH] Pressability: Fix Missing `onLongPress` Gestures Summary: The current implementation of `Pressability` has a bug related to `onLongPress`. When a user starts a press gesture, we keep track of the activation position (occurs after waiting `delayPressIn` milliseconds). If the touch moves away from that position by more than 10dp, we rule out the long press gesture. This means no matter how long you hold down the press, even if you move it back to within 10dp, we will not fire `onLongPress`. However, there is currently a bug where we never reset the cached activation position. This means that after the first press gesture, all subsequent long press gestures must start within 10dp of that first press gesture. This leads to seemingly intermittent missing long press gestures. This fixes the bug by ensuring that whenever a press gestures is terminated (either via a cancel or release), we reset the activation position. Changelog: [General][Fixed] - Fixed Pressability to properly fire `onLongPress`. Reviewed By: TheSavior Differential Revision: D20410075 fbshipit-source-id: e4727b7a9585ce3ea39481fc13e56b6b91740c8c --- Libraries/Pressability/Pressability.js | 1 + .../__tests__/Pressability-test.js | 92 ++++++++++++++++++- 2 files changed, 91 insertions(+), 2 deletions(-) diff --git a/Libraries/Pressability/Pressability.js b/Libraries/Pressability/Pressability.js index 067a852b4bf5f8..f75dad76d8c4cd 100644 --- a/Libraries/Pressability/Pressability.js +++ b/Libraries/Pressability/Pressability.js @@ -640,6 +640,7 @@ export default class Pressability { event: PressEvent, ): void { if (isTerminalSignal(signal)) { + this._touchActivatePosition = null; this._cancelLongPressDelayTimeout(); } diff --git a/Libraries/Pressability/__tests__/Pressability-test.js b/Libraries/Pressability/__tests__/Pressability-test.js index ef7dcdb4aabb4a..6cebd0a477e4c2 100644 --- a/Libraries/Pressability/__tests__/Pressability-test.js +++ b/Libraries/Pressability/__tests__/Pressability-test.js @@ -397,9 +397,97 @@ describe('Pressability', () => { jest.advanceTimersByTime(1); expect(config.onLongPress).toBeCalled(); }); - }); - // TODO: onLongPressShouldCancelPress tests + it('is called if touch moves within 10dp', () => { + mockUIManagerMeasure(); + const {config, handlers} = createMockPressability(); + + handlers.onStartShouldSetResponder(); + handlers.onResponderGrant(createMockPressEvent('onResponderGrant')); + handlers.onResponderMove( + createMockPressEvent({ + registrationName: 'onResponderMove', + pageX: 0, + pageY: 0, + }), + ); + + jest.advanceTimersByTime(130); + handlers.onResponderMove( + // NOTE: Delta from (0, 0) is ~9.9 < 10. + createMockPressEvent({ + registrationName: 'onResponderMove', + pageX: 7, + pageY: 7, + }), + ); + + jest.advanceTimersByTime(370); + expect(config.onLongPress).toBeCalled(); + }); + + it('is not called if touch moves beyond 10dp', () => { + mockUIManagerMeasure(); + const {config, handlers} = createMockPressability(); + + handlers.onStartShouldSetResponder(); + handlers.onResponderGrant(createMockPressEvent('onResponderGrant')); + handlers.onResponderMove( + createMockPressEvent({ + registrationName: 'onResponderMove', + pageX: 0, + pageY: 0, + }), + ); + + jest.advanceTimersByTime(130); + handlers.onResponderMove( + createMockPressEvent({ + registrationName: 'onResponderMove', + // NOTE: Delta from (0, 0) is ~10.6 > 10. + pageX: 7, + pageY: 8, + }), + ); + + jest.advanceTimersByTime(370); + expect(config.onLongPress).not.toBeCalled(); + }); + + it('is called independent of preceding long touch gesture', () => { + mockUIManagerMeasure(); + const {config, handlers} = createMockPressability(); + + handlers.onStartShouldSetResponder(); + handlers.onResponderGrant(createMockPressEvent('onResponderGrant')); + handlers.onResponderMove( + createMockPressEvent({ + registrationName: 'onResponderMove', + pageX: 0, + pageY: 0, + }), + ); + + jest.advanceTimersByTime(500); + expect(config.onLongPress).toHaveBeenCalledTimes(1); + handlers.onResponderRelease(createMockPressEvent('onResponderRelease')); + + // Subsequent long touch gesture should not carry over previous state. + handlers.onStartShouldSetResponder(); + handlers.onResponderGrant(createMockPressEvent('onResponderGrant')); + handlers.onResponderMove( + // NOTE: Delta from (0, 0) is ~10.6 > 10, but should not matter. + createMockPressEvent({ + registrationName: 'onResponderMove', + pageX: 7, + pageY: 8, + }), + ); + + jest.advanceTimersByTime(500); + expect(config.onLongPress).toHaveBeenCalledTimes(2); + }); + }); describe('onPress', () => { it('is called even when `measure` does not finish', () => {