Not working on Chrome iOS or Mac Safari

[RobertDaleSmith]

For some reason the button and axes states do not update on Chrome on iOS or Safari on Mac.

The controller is detect on first button press but then button elements do not update upon button presses.

Works with my vanilla js implementation at https://test.controlleradapter.com and your live example here shows the same behavior I’m seeing in my react implementation I’m working on: https://nogiszd.github.io/react-gamepad-tester/

[nogiszd]

Hi, at the time when I was porting this library to TypeScript, I didn’t have access to any Mac device, so I couldn’t test functionality on Apple devices.

Chrome on iOS still uses WebKit under the hood, so the issues from Safari will also occur on mobile browsers using WebKit.

I will look into this issue, whenever I will have free time. If you’re willing to help or you have any clue how to solve it, I will appreciate the help!

[RobertDaleSmith]

After some investigation I found that the haveGamepadEvents is always true in Safari and prevents updates from occurring.

As a quick fix I just removed the conditional but I'm curious of what haveGamepadEvents purpose is for and how we may apply it to both Chrome and Safari(webkit) usages?

  // Update gamepad state on each "tick"
  const update = () => {
    // if (!haveGamepadEvents) {
      scanGamepads();
    // }
    request.current = requestAnimationFrame(update);
  };

https://github.com/nogiszd/react-ts-gamepads/compare/main...RobertDaleSmith:react-ts-gamepads:fix-safari?expand=1#diff-050639028f137a72d289d118f376375f7edbcd9efa8dd7a13480b9e6e70fd625R60

[RobertDaleSmith]

hmm my fix above works on my local dev server but I get same behavior as before when deployed to my production server on Vercel. I'll have to circle back to this again this evening. 😢

[nogiszd]

I've exported this variable to keep the code clean, but as we can see, imported variables are not updating properly between the render cycles. In that case it will be necessary to embed it back within the hook body. Then whole update method can be wrapped with useCallback with this local variable as dependency.

This check variable is for determining whether 'ongamepadconnected' event is already have been used by other library/function.

I have pushed changes onto separate branch. Let me know if this resolved the issue. If not, this change, in my opinion, would be good start point anyways.

[RobertDaleSmith]

Unfortunately the changes in the new separate branch you created did not resolve the issue in Safari for me. Seems that check variable always holds true on Safari. I'll keep poking around.