Is the HTML5 Gamepad API limited to only 4 Controllers?

Question

I'm correctly able to get input from 4 controllers through using the HTML5 Gamepad API within a browser.

https://www.w3.org/TR/gamepad/

What I'm having trouble with is getting input from 8 controllers. These being all Xbox 360 controllers, I know there's a legacy limit to the XInput API. But looking at the HTML5 API documentation above, I can't see anything mentioning a limit or how the API is implemented.

navigator.getGamepads(); seems to return an array of 4 undefined spots in Chrome and Edge, and an unspecified array in FireFox that still seems to go to a limit of 4.

You can see Windows 10 verifies I have 8 controllers connected in the Devices panel, and all work individually up to 4 gamepads within the browser. So I'm questioning why the Gamepad API is limiting me here - is it by design of the Gamepad API, or XInput?

Answer 1

Ok, I've done some extensive research and testing and feel some confidence in answering this.

The Gamepad API spec doesn't define a limit to controllers, as you can see in the linked documentation above.

In practice, navigator.getGamepads() returns:

• In Chrome, a GamepadList (this may be a normal Array now?) of 4 undefined values, filled with 4 Gamepad objects.
• In (Legacy) Edge, an Array of 4 undefined values, filled with 4 Gamepad objects.
• In Firefox, an Array with length zero, filled with any number of Gamepad objects.

XInput doesn't seem to be the culprit other than maybe influencing the implementation, because I was able to have a mix of inputs beyond four in Firefox that weren't all recognized in the other browsers.

I think this can be chalked up to bad implementation on the part of engines behind Chrome and Edge, and I can only hope they see the light and Firefox keeps their implementation flexible. Ideally the standard lays down the law unambiguously.

Answer 2

Thus far, every time I've used the GamePad API in Chrome, it's returned an array containing four entries initially. The "About:Help" for my version returns the following information:

Version 59.0.3071.115 (Official Build) (64-bit)

When running my code, with one input device attached to my computer, the array contains the following entries:

• array[0] : GamePad object for my connected device;
• array[1] : null;
• array[2] : null;
• array[3] : null;

At the moment I don't have enough spare USB ports to try plugging in more than 3 devices, so if anyone does have the requisite hardware largesse, it will be an interesting experiment to find out what happens if you attach 5 gamepads to your computer, and see if Chrome creates an array large enough for them all.

One other quirk I've discovered is this. You're supposed to press a button on one of your gamepads/joysticks before running any code that calls the navigator.getGamePads() method. This is a security feature to stop web pages listening for your gamepad details, and sending them off to a malicious entity - if you're lucky enough to have blown a couple of thousand pounds on a realistic F-16 HOTAS unit, you don't want this information being sent to scammers. However, in practice, I've found that this doesn't work on my computer. Even after pressing a button several times, my code pops up the dialogue box I coded to say "No gamepads detected". I then dismiss the dialogue, press a button on the joystick, try again, and hey presto, the detection code registers my devices. Whether this is a Chrome quirk, or is replicated in Firefox, I've yet to test.

A thought occurs to me: when testing your browser code, try pressing a button on EVERY attached device, and see if that results in the GamePad API registering all your devices. Though one issue I can foresee, that might complicate your test, is that you have multiple identical devices connected. If you can find a collection of 8 different gamepads, and try that, you might see different results.

There's a range of issues with the GamePad API at the moment, due to the fact that the W3C standard for this API has yet to be finalised - it's still in the draft stage. As a consequence, different browsers have different implementation details, until the developers thereof have a stable standard to work with.