ngAria bindKeypress: IE9/IE11 doesn't fire some 'keypress' events on DIV, LI

[kkoskelin]

Dear ngAria/a11y Angular devs,

I'm working on developing a highly accessible application in which Internet Explorer 9 (and eventually IE11) will be the primary browser target. In our application we've included the ngAria module, but have found that even though we can use keyboard navigation, not all keyboard events fire as expected in IE9/IE11.

Because of ngAria's bindKeypress configuration, ngClick items also can get identical bindings for the 'keypress' event. This works great in Chrome where I've tested it. But if the elements are one of DIV, LI the keypress event does not fire for the ENTER key in IE9/IE11.

Fiddle demonstrating this behavior: http://jsfiddle.net/kkoskelin/ag8hcknz/

Angular Versions tested: 1.3.14, 1.4.0-beta.5
Browser/OS: Internet Explorer 9 + Windows 7, Internet Explorer 11 + Windows 8.1

Suggested fix: Internet Explorer 9 will fire the keydown event. This is also shown in the fiddle above. I've also tested by altering my local copy of angular-aria.js and changing the 'keypress' binding to 'keydown' at line 336 of
https://github.com/angular/angular.js/blob/master/src/ngAria/aria.js#L336
such that it reads
elem.on('keydown', function(event) { ...

I've attempted to use $provide.decorator to alter the directive's behavior but haven't had any success.

[ericsorenson]

👍

[andrewaustin]

I tested this in IE10 (10.0.9200.17183) and can confirm the reported behavior.

Another thing I noticed is that the keypress event does fire if you select the li/div with SPACE instead of ENTER.

[kkoskelin]

@andrewaustin you are correct. The ngAria bindkeypress feature is listening for both SPACE and ENTER, but only SPACE ever triggers the event.

[Narretz]

Have you guys tested with Firefox? Seems to be the exact other way round compared to IE: space does not work, enter works.

[kkoskelin]

@Narretz confirmed your described behavior on Firefox 36.0.1 on OSX. Presumably we want both of these keys triggering the key(press|down) events. Thanks!

[andrewaustin]

@Narretz @kkoskelin The firefox issue is entirely different.

In firefox, a keypress event triggered from a printable character does not populate event.keyCode, but instead populates event.which. I have a fix (and unit test) for this in #11340.

The IE issue is more tricky. A keypress event handler is getting added to the <li> and <div>, but for some reason it is not getting fired. You can see from http://jsfiddle.net/937krogo/ that IE9-11 does fire the keypress event on both SPACE and ENTER, so more investigation is needed.

(edited: provided link to jsfiddle rather than jquery docs)