autofill WebOTP javascript api is not working

I've tried many sample codes but nothing works.

console.log("Otp.js>13 mounted");
if ('OTPCredential' in window) {
    try {
        console.log("Otp.js>16 in otpcredential");
        if (navigator.credentials) {
            try {
                console.log("Otp.js>19 credential");
                let {type,code} = await navigator.credentials.get({ otp:{ transport: ['sms']}})
                console.log("EsignSteps.js>78 aaaayo",type,code);
            }
            catch (e) {
                console.log("EsignSteps.js>81",e);
            }
        }
    }
    catch (err) {
        console.log("40",err);
    }
}

above code gives DOMException after few minutes even after I received OTP

I've also tried

const abort = new AbortController();

setTimeout(() => {
  abort.abort();
}, 2 * 60 * 1000);

let {type,code} = await navigator.credentials.get({ signal: abort.signal,otp:{ transport: ['sms']}})

Also tried

navigator.credentials.get({ signal: abort.signal,otp:{ transport: ['sms']}})
.then((otp)=>{
console.log(otp);
})
.catch(err=>{
console.log(err);
})

I've tried many sms formats like:

format 1:

Your OTP is : 123456
@https://example.com #123456

format 2:

Your OTP is : 123456
@example.com #123456

format 3:

Your OTP is : 123456
@www.example.com #123456