DirectionalNavigation: Xbox Gamepad "A" button not triggering winJS ListView's oniteminvoked event handler

[jackhand]

When pressing the "A" button of the Xbox gamepad, the ListView tile that is in focus does not invoke the oniteminvoked event handler. However, when testing this on the computer (not Xbox) and I press the ENTER key on the keyboard, then the oniteminvoked event handler gets triggered.

The _handleKeyUpEvent() function of the DirectionalNavigation code does get called, but for some reason the following code that is called when testing on the Xbox does not invoke a call to the ListView's oniteminvoked event handler.

e.srcElement.click();

Why does it work on the PC, but not on the XboxOne?

[payzer]

This is probably because the key codes for gamepad are slightly different than the key codes for other keys like enter.

On Xbox, if you have a normal button, does the gamepadA key trigger a button click?

[jackhand]

The key code for the "A" button is 195 and this does cause the DirectionalNavigation code to successfully call "e.srcElement.click()" within the _handleKeyUpEvent() function.

It only seems to be the ListView tiles. The Hub headers trigger an invoke handler when I press the gamepadA key. Other buttons trigger their invoke handler when the gamepadA key is pressed.

[payzer]

I see. Unfortunately the ListView is "special". What's likely going on is the ListView is either preventing the default click action or suppressing the input in some other way. It's very unfortunate. I'm not sure if there's a workaround other than disabling that code in the WinJS source.

[jackhand]

that's weird that on a PC, no suppression is going on when I press the "ENTER" button.

[payzer]

Yes, that's probably because the ListView will explicitly check for the enter key, but not the gamepad keys (XboxJS checked the gamepad keys), but WinJS 1.0 - WinJS 4.0 did not.

I'd suggest adding the gamepad keys to the ListView where the Enter keys are handled. I'll probably be able to get an example together later today.

[payzer]

Here's where we modified the ListView code for XboxJS:

You can add additional lines like the existing ones for the arrow keys, except add the gamepad keycodes.

---

                function createArrowHandler(direction, clampToBounds) {
                    var handler = function (oldFocus) {
                        return modeSite._view.getAdjacent(oldFocus, direction);
                    };
                    handler.clampToBounds = clampToBounds;
                    return handler;
                }

                var Key = _ElementUtilities.Key;
                this._keyboardNavigationHandlers[Key.upArrow] = createArrowHandler(Key.upArrow);
                this._keyboardNavigationHandlers[Key.downArrow] = createArrowHandler(Key.downArrow);
                this._keyboardNavigationHandlers[Key.leftArrow] = createArrowHandler(Key.leftArrow);
                this._keyboardNavigationHandlers[Key.rightArrow] = createArrowHandler(Key.rightArrow);