search

PolymerElements / paper-button

A button à la Material Design
https://www.webcomponents.org/element/PolymerElements/paper-button
138 stars 64 forks source link

on-tap handlers sometimes can't .click() a related input #112

Open FLamparski opened 8 years ago

FLamparski commented 8 years ago

Description

When using the tap event and tapping the button on a touchscreen PC, a linked file input is not triggered. This happens both inside a custom component and outside of it.

Expected outcome

Normally, the event handler should be able to trigger a file input to show the file browser from both a click and touch event.

In the first demo, tapping the paper-button should trigger the file browser twice because both click and tap are bound.

Actual outcome

In a component, a tap does not trigger the file input even though the event handler runs. In the first demo, a tap does not trigger the file input even though the click does.

Oddly enough Android is not affected by this.

Live Demo

Demo 1: http://codepen.io/FLamparski/pen/reJqwm

Additional things I tried when trying to isolate the bug (all trigger the file input): http://codepen.io/FLamparski/pen/MyVKVN

Steps to reproduce

  1. Use a paper-button
  2. Set up its on-tap event or bind to its click and tap events
  3. Tap on the paper-button on a PC touchscreen

    Browsers Affected

keanulee commented 8 years ago

@FLamparski What "touchscreen PC" are you using (e.g. Surface Pro with Windows 10, or Chromebook Pixel), and is this Chrome only, or does it happen in IE/Edge/Firefox as well?

FLamparski commented 8 years ago

Hi, I'm using an older Dell XPS 15 with Ubuntu. Tested with Chrome beta and the Ubuntu browser which is WebKit based. Further, the problem occurs both under shadow and shady DOM.

On Fri, 15 Apr 2016 23:11 Keanu Lee, notifications@github.com wrote:

@FLamparski https://github.com/FLamparski What "touchscreen PC" are you using (e.g. Surface Pro with Windows 10, or Chromebook Pixel), and is this Chrome only, or does it happen in IE/Edge/Firefox as well?

— You are receiving this because you were mentioned. Reply to this email directly or view it on GitHub https://github.com/PolymerElements/paper-button/issues/112#issuecomment-210647722

keanulee commented 8 years ago

I wonder if there's some restriction that blocks fileInput.click() when it's not called from a user interaction. What happens when you do bind the listener to only one event ('tap' or 'click') to a regular <div> element? To a <button> element?

FLamparski commented 8 years ago

Please look at the second codepen linked, which tries to make such explorations

keanulee commented 8 years ago

Due to my lack of access to such hardware, I am unable to reproduce this. If someone else can look into this it would be greatly appreciated.