Description

When trying to simulate a click event on input (input.click()) from other event listener, Polymer Gestures stops that click event.

Live Demo

https://jsfiddle.net/myfrom/rypqaxck/18/

Steps to Reproduce

1. Open a page on phone or simulate mobile device with DevTools
2. Create a button and an input (best with <input type="file"> as it opens a dialog when clicked)
3. Add click event listener to that button and call click() function on the input

Expected Results

Input file is clicked; in case of file input, dialog opens

Actual Results

Nothing happends

Browsers Affected

• Chrome
• Firefox
• Edge
• Safari 11
• Safari 10
• IE 11

I could check only on Chrome but I think it should happen on other mobile browsers too.

Versions

• Polymer: v2.6.0
• webcomponents: v1.2.2

Additional information

I did a bit of digging while trying to debug it and found out that it's caused by mouseCanceller() function (here).

However, I found a workaround:
Instead of calling input.click(), sending non-bubbling event will work:

input.dispatchEvent(new MouseEvent('click', { bubbles: false }))

I'm not sure if it can be fixed without breaking something else but I wanted to post it at least to share the workaround if someone encounters the same problem 😉