RyanMullins / angular-hammer

Hammer.js v2 support for AngularJS
http://ryanmullins.github.io/angular-hammer/
MIT License
188 stars 55 forks source link

[Accessibility] Cannot trigger "hm-tap" in button using keyboard #56

Open adgoncal opened 8 years ago

adgoncal commented 8 years ago

When you use the keyboard "tab" key to focus the button and then press "enter" key, hm-tap does not get triggered, but ng-click does. http://plnkr.co/edit/ooecDAoIrGRLmcbvOsDA?p=preview

Additionally, if I use anchor elements instead, neither one of the events gets focus unless they have an href attribute and if that is the case, then it behaves the same way as the buttons, hm-tap does not trigger, but ng-click does. http://plnkr.co/edit/aE99UzMiTJk4khzSjEBK?p=preview

It may be related to: https://github.com/hammerjs/hammer.js/issues/312

adgoncal commented 8 years ago

I am currently adding ng-keydown and checking for "enter" or "space" keyCode as a solution.

http://plnkr.co/edit/MABVJKLLXIQH1xmCpdg3?p=preview

HTML:

<button hm-tap="doSomething($event)" ng-keydown="doSomething($event)"></button>
<a hm-tap="doSomething($event)" ng-keydown="doSomething($event)" tabindex="0"></a>

JavaScript:

function doSomething(event) {
  if(event.type === 'keydown') {
    // quit early if keyCode is not "enter" or "space" key.
    if(!(event.keyCode === 13 || event.keyCode === 32)) {
      return;
    }
  }

  // do something ...
}