paper-slider icon indicating copy to clipboard operation
paper-slider copied to clipboard

After dragging knob with mouse, keyboard tap events will stop working on rest of page.

Open shc023 opened this issue 7 years ago • 3 comments

Description

After dragging knob with mouse, keyboard tap events will stop working on rest of page.

Expected outcome

Dragging knob with mouse does not interfere with subsequent keyboard taps on the rest of the page.

Actual outcome

After dragging the knob with the mouse, the rest of the page will stop responding to keyboard taps.

Live Demo

https://jsfiddle.net/2q3fqehz/167/

Steps to reproduce

  1. Go to live demo above, click / tab focus to the button and press enter a few times, observer console says "tapped".
  2. Drag the knob with mouse (do not click anything else on the page after letting go)
  3. Tab one time to focus the button.
  4. Press enter a few times, notice that the console does not say "tapped" anymore.

Doing the following seems to un-break the page. 5. Mouse click on the button, observe that console says "tapped" again. 6. Press Enter while focus is on the button, observe that issue goes away and console says "tapped" again.

Browsers Affected

Chrome is affected, haven't tested on other browsers yet.

shc023 avatar Apr 21 '17 20:04 shc023

@keanulee @frankiefu

danbeam avatar Apr 21 '17 22:04 danbeam

@azakus This seems to be related to gestures - it doesn't happen if I change the button's tap listener to click.

keanulee avatar Apr 24 '17 20:04 keanulee

So, the track gesture will disable tap to prevent accidental taps. This is usually ok because tap resets the "prevent" flag on any mousedown or touchstart. However, the Enter key will only send a click event, which does not cause the state machine to reset. Probably just need to add a keydown listener to tap gesture to reset.

dfreedm avatar May 04 '17 18:05 dfreedm