Safari does not populate OTP in keyboard when received from Stytch

I’m guessing this has to be an issue with Stytch somehow since all users of our app face the same problem. All users using Safari mobile do not see the OTP in the keyboard for autofilling. In Chrome mobile, meanwhile, the autofill works fine.

We’re using this component:

import { StytchLogin } from "@stytch/react";`

I’m assuming that’s not relevant as it seems to be an issue at the native / iOS level. Perhaps there’s something with the number Stytch is sending from which prevents iOS from recognizing the OTP?

This is a pretty significant conversion issue for us, so any help would be greatly appreciated!

Hey Michael – thanks so much for posting!

I believe this is related to the metadata currently included in our SMS messages. The metadata we include allows autofill to work in mobile Chrome, but not mobile Safari.

We have an open feature request internally to add support for mobile Safari SMS autofill, and I’ve added a +1 on your behalf! I apologize for the trouble in the meantime – autofill support is something that we’d definitely like add in the future, though I don’t have a specific ETA available at the moment.

Please let us know if you have any other questions that we can help out with!

Thanks for the explanation! When this is eventually added, will I need a package upgrade or will that metadata change be handled server side?

Hey Michael,

I believe that part of this work will require exposing a new parameter in our API in which you’ll pass the domain of your application (where users enter the OTP code) to use as part of the autofill configuration process.

Given that, I believe that you’ll likely need to upgrade your Stytch package once we do roll out this feature. We’re still speccing out the work required for this, so this could change, but at this point it seems likely that you’ll just need to bump your package version and add an additional parameter to the Send OTP API call.

We’ll definitely keep you posted and will share further details once they’re available!

Cheers,
Matt
Stytch Support

Understood. In that case I would really appreciate a fast fix here. I’m sure you can imagine the stress we’re under to optimize conversion at the first touch point, and my understanding is that we can’t get around this by building our own UI and interacting directly with Stytch’s OTP API. It hurts the case for us to be integrating with Stytch in the first place if there are issues like that that are beyond our control.

Appreciate the quick response :raised_hands:

Hey Michael,

That makes sense - thank you for providing the additional context! I’ve passed this along to our team for context during prioritization.

We’ll keep you posted in this thread - let us know if there is anything else we can help with in the meantime!

Best,
Matt
Stytch Support

Hey again Michael! We’ve made some changes on our end, and we believe that we’ve resolved this in our latest JavaScript SDK versions (@stytch/vanilla-js v1.0.3 and @stytch/react v5.0.0). Could you please try upgrading and let us know how that goes?