Octa javascript is not detecting dynamically loaded username value – Octa Widget

I am trying to load the username dynamically after octa Signin is ready for user input like this

check this screenshot of js configuration

Though value is being populated to the input field, on submission Octa js returns an invalid username error

check this screenshot how error message coming

though the value is present in the input field, it seems like it’s not considered.

How to populate Octa Username automatically on widget ready? Any workaround could be helpful!

I tried all possible ways to fill input field, and it is loading there, but octa submission code not detecting

                //document.getElementById("okta-signin-username").value = Username;
                //document.getElementById("okta-signin-username").setAttribute('value', Username);  
                //document.getElementById("okta-signin-username").focus();
                document.querySelector('input[name="username"]').value = Username;