metonym / svelte-pincode

Declarative pincode component for Svelte
https://metonym.github.io/svelte-pincode/
MIT License
28 stars 10 forks source link

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

Open sebastiendub opened 1 year ago

sebastiendub commented 1 year ago

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 => https://github.com/metonym/svelte-pincode/pull/20

igorlanko commented 1 year ago

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?