Почему автоматическое определение otp не отображает код в React

Я использую автоматическое определение otp в своем приложении, используя документацию web-otp. Я использовал код bleow в своем приложении

        otprenderGetMobile() {
                const{ otpValue}=this.props;
                let signal = new AbortController();
        
                setTimeout(() => {
                    // abort after 10 minutes
                    signal.abort();
                }, 10 * 60 * 1000);
        
                let { code, type } = navigator.credentials.get({
                    abort: signal,
                    otp: {
                        transport: ["sms"]
                    }
                }).then(otp=>{
                alert('otp value is: ',JSON.stringify(otp));
                alert('code value is: ',JSON.stringify(code));
                alert('type value is: ',JSON.stringify(type));
                    otpValue = otp;
                });
            }

мой хтм

<input
  type = "text"
  id = "otp"
  name = "otp"
  autocomplete = "one-time-code"
/> 

мой формат сообщения OTP

3052 is your Myapp verification code

@dev.myapp.com #3052

он отлично работает на устройстве Android, но проблема в том, что когда я разрешаю разрешение устройства, otp не запрашивает в приложении. Я прикрепил изображения выходов андроида

вот результаты после того, как я разрешил доступ к браузеру