on-tap in <a> tag doesnt work
johnlim opened this issue · comments
Description
on-tap in tag inside PSK doesn't work.
Expected outcome
on-tap to be triggered
Actual outcome
on-tap isnt triggered
Live Demo
https://github.com/johnlim/polymer-starter-kit/tree/onTapFails
Steps to reproduce
Clicking the tag View 4 in the drawer menu doesn't trigger on-tap.
Browsers Affected
- Chrome
- Edge
- Firefox
- IE 11
- Safari 8
- Safari 9
You should change on-tap to on-click unless you have a specific reason to use on-tap.
If you do decide to use on-tap you will need to import the mixin:
<link rel="import" href="../bower_components/polymer/lib/mixins/gesture-event-listeners.html">and also apply/extend from the mixin in your MyApp class declaration, eg.:
class MyApp extends Polymer.Element {to:
class MyApp extends Polymer.GestureEventListeners(Polymer.Element) {For more info, see https://www.polymer-project.org/2.0/docs/devguide/gesture-events
Hi Jason,
Thanks. I wasn't aware of the differences between 1.0 ( https://www.polymer-project.org/1.0/docs/devguide/gesture-events) and 2.0 (https://www.polymer-project.org/2.0/docs/devguide/gesture-events). But having said that, doesn't the recommendation to use polymer's gesture events still hold true to ensure interoperability with both touch and mouse devices? Therefore, should we by default, use on-tap?
Thanks,
John
You can use on-click. Some references about this:
Hi @abdonrd , awesome! Thanks for the info. So if I understand correctly, we should now go with on-click by default? Under what circumstances do we use on-tap then?
@johnlim I'm not sure. 😕
Friendly ping to @keanulee @arthurevans!
Under what circumstances do we use on-tap then?
I had always seen to use on-tap for items that won't give you a pointer when hovered (i.e. <a> links) So if you want them to tap just a plain <div> and not have an <a> link around it. Perhaps that is old 0.x or 1.x logic I'm seeing though.
Should definitely use click going forward PolymerElements/app-layout#465 (comment)