Not working on Android devices because of e.key being Unidentified

[sebastiendub]

The whole update mechanism for the pincode component is based on the event key, which, on android, is returning Unidentified.
Maybe a quick, Android-specific solution could be implemented on the side ?
I made an implementation example in this repl => https://svelte.dev/repl/b21abf74c10b40e89fa84b33bc69a812?version=3.54.0
Of course we'll lose all modifier handling, but there doesn't seem to be a solution for keyup / keydown working on Android.

I made a PR related to this issue => #20

[igorlanko]

Hey @sebastiendub, not super related, but this fix does not work with SvelteKit.

ReferenceError: navigator is not defined

The error makes sense, since the code is trying let userAgent = navigator.userAgent, but navigator is not accessible on server side.

How could I fix this?

Thanks

UPD: one thing comes to my mind is to just expose a variable in the component and then pass the user agent value from the load function of the page. But again, that's SSR-specific.

UPD 2: as spy16 kindly pointed it out in Svelte's Discord, in SvelteKit the browser API can be accessed from the @app/environment module https://kit.svelte.dev/docs/modules#$app-environment. Not sure if there's any way to account for it on in the Svelte component though?