diff --git a/packages/mdc-ripple/constants.js b/packages/mdc-ripple/constants.js index fde37387af2..ef1b27f3e10 100644 --- a/packages/mdc-ripple/constants.js +++ b/packages/mdc-ripple/constants.js @@ -40,6 +40,7 @@ const numbers = { INITIAL_ORIGIN_SCALE: 0.6, DEACTIVATION_TIMEOUT_MS: 225, // Corresponds to $mdc-ripple-translate-duration (i.e. activation animation duration) FG_DEACTIVATION_MS: 150, // Corresponds to $mdc-ripple-fade-out-duration (i.e. deactivation animation duration) + TAP_DELAY_MS: 300, // Delay between touch and simulated mouse events on touch devices }; export {cssClasses, strings, numbers}; diff --git a/packages/mdc-ripple/foundation.js b/packages/mdc-ripple/foundation.js index 520e52816e2..f5b37ccd2b3 100644 --- a/packages/mdc-ripple/foundation.js +++ b/packages/mdc-ripple/foundation.js @@ -295,8 +295,7 @@ class MDCRippleFoundation extends MDCFoundation { // Avoid reacting to follow-on events fired by touch device after an already-processed user interaction const previousActivationEvent = this.previousActivationEvent_; - const isSameInteraction = previousActivationEvent && e && previousActivationEvent.type !== e.type && - previousActivationEvent.clientX === e.clientX && previousActivationEvent.clientY === e.clientY; + const isSameInteraction = previousActivationEvent && e && previousActivationEvent.type !== e.type; if (isSameInteraction) { return; } @@ -428,7 +427,7 @@ class MDCRippleFoundation extends MDCFoundation { this.activationState_ = this.defaultActivationState_(); // Touch devices may fire additional events for the same interaction within a short time. // Store the previous event until it's safe to assume that subsequent events are for new interactions. - setTimeout(() => this.previousActivationEvent_ = null, 100); + setTimeout(() => this.previousActivationEvent_ = null, MDCRippleFoundation.numbers.TAP_DELAY_MS); } /** diff --git a/test/unit/mdc-ripple/foundation-deactivation.test.js b/test/unit/mdc-ripple/foundation-deactivation.test.js index 5a5dbc5baaa..2e8d6f734a5 100644 --- a/test/unit/mdc-ripple/foundation-deactivation.test.js +++ b/test/unit/mdc-ripple/foundation-deactivation.test.js @@ -333,7 +333,7 @@ testFoundation('only re-activates when there are no additional pointer events to documentHandlers.mouseup(); mockRaf.flush(); - clock.tick(DEACTIVATION_TIMEOUT_MS); + clock.tick(numbers.TAP_DELAY_MS); // Finally, verify that since mouseup happened, we can re-activate the ripple. handlers.mousedown({pageX: 0, pageY: 0});