Fails to fetch OTP in some devices

[shailesh-galgal]

i.e Auto-fill not working for the first time but working on the second try, able to re-produce this issue every time on the first attempt. Device: Samsung M12 Device - Nord Some times its not even fetching OTP in 2nd attempt as well. @faizalshap need help

[faizalshap]

Hi @shailesh-galgal Please share code snippet and library version that you are using

[shailesh-galgal]

created a hook-

export function useOtpAutofetchHandler() {
  const [autoFetchedOTP, setAutofetchedOTP] = useState('')

  const getHash = () => {
    if (Platform.OS === 'android') {
      RNOtpVerify.getHash().then(undefined).catch(undefined)
    }
  }

  const startListeningForOtp = () => {
    if (Platform.OS === 'android') {
      RNOtpVerify.getOtp()
        .then(() => {
          RNOtpVerify.addListener(otpHandler)
        })
        .catch(() => undefined)
    }
  }

  const otpHandler = (message: any) => {
    if (message !== templates.messageCheckOnTimeOut) {
      if (message != null) {
        // eslint-disable-next-line  @typescript-eslint/no-non-null-assertion
        const otp = /(\d{6})/g.exec(message)![1]
        setAutofetchedOTP(otp)
        return otp
      }
    }
    return undefined
  }

  const removeListener = () => {
    if (Platform.OS === 'android') {
      RNOtpVerify.removeListener()
    }
  }

  return {
    getHash,
    startListeningForOtp,
    otpHandler,
    autoFetchedOTP,
    removeListener,
    setAutofetchedOTP,
  }
}

//calling it inside template

 useEffect(() => {
    getHash()
    startListeningForOtp()
    if (Platform.OS === 'android') {
      if (autoFetchedOTP !== '' && isOTPfetched === false) {
        handleAutoFill()
      }
    }
    return () => {
      removeListener()
    }
  }, [
    getHash,
    startListeningForOtp,
    removeListener,
    autoFetchedOTP,
    handleAutoFill,
    isOTPfetched,
  ])

[shailesh-galgal]

version - "react-native-otp-verify": "^1.0.5",

[sudeshvs]

@shailesh-galgal update to the new version 1.1.4

[shailesh-galgal]

Okay @sudeshvs will try & let you know

[shailesh-galgal]

@sudeshvs tried didn’t worked

[faizalshap]

That's strange issue @shailesh-galgal check android logs if you find any issues there

[shailesh-galgal]

@faizalshap its working fine inside some of the devices & failing in some of them, the issue explained above is from user's device,will try to find identical phone & share the logs here.

[SanjanaTailor]

@faizalshap : Same here, Resend OTP is not working to autofill the OTP in boxes it is happening in every device.

[sudeshvs]

@SanjanaTailor which is your package version ?

[pushpender-singh-ap]

@SanjanaTailor Would you mind sharing a sample project link with us so we can figure out what went wrong.

[m00gl3]

I wanted to add that on Samsung S21 Android 12, it works great in DEBUG build but in RELEASE it doesn't auto-fill the OTP This happened both in prev version 1.1.3 and in the new version 1.1.4

I didn't see anything happening in Android Studio logcat while the SMS was received (remember I'm looking in Release)

Also, I put an alert inside the otp handling function: (here, inside otpHandler function) and it didn't fire when the SMS was received. RNOtpVerify.addListener(otpHandler))

After a while (maybe a minute) - the alert fired with "Timeout Error"

Re-iterating that in DEBUG mode it worked flawlessly.

[Akilramki]

Auto-fill not working for the first time but working on the second time, I able to re-produce this issue every time on the first attempt. Device: Samsung Model - SM-J600G

package.json

"react-native-otp-autocomplete": "^1.0.7",