fields of login page not updating as filled in

Question

I'm trying to login to a webpage using VBA & IE automation. I'm hitting what I've been able to solve on other websites, but not this one. When I "click" on the login button of the site it then tells me that the user name & password are empty, when they are not. I've tried pauses. setting focus, setting the field as active & dispatching events, but so far nothing has worked with the website.

Dim HTMLInputs As MSHTML.IHTMLElementCollection
Dim HTMLInput As MSHTML.IHTMLInputElement
Dim HTMLInput2 As MSHTML.IHTMLInputElement
Dim HTMLButtons As MSHTML.IHTMLElementCollection 
Dim HTMLButton As MSHTML.IHTMLButtonElement
Dim HTMLLinks As MSHTML.IHTMLElementCollection
Dim HTMLLink As MSHTML.IHTMLElement 

'make IE visible then open website
IE.Visible = True
'IE.top = 0
'IE.Left = 0
IE.width = 1200
IE.height = 800                                       '

IE.Navigate funcLookupURL(strMGA, strCO)                        'https://agency.hciharmony.com/login

'check if internet explorer is ready otherwise loop til it is
Do While IE.Busy Or IE.ReadyState <> READYSTATE_COMPLETE
'    Debug.Print "1"
'    Debug.Print IE.Busy
    DoEvents
Loop
'login
Dim evt As Object
Dim evt2 As Object
Dim evt3 As Object
Dim evt4 As Object
Set evt = IE.Document.createEvent("HTMLEvents")
Set evt2 = IE.Document.createEvent("HTMLEvents")
Set evt3 = IE.Document.createEvent("HTMLEvents")
Set evt4 = IE.Document.createEvent("HTMLEvents")

evt.initEvent "blur", False, True
evt2.initEvent "focus", False, True
evt3.initEvent "input", True, False
evt4.initEvent "change", True, False 

'<input name="username" class="auth0-lock-input" type="text" placeholder="username/email" value="TTC-201" autocomplete="off" autocapitalize="off">
Set HTMLInput = IE.Document.querySelector("input[placeholder='username/email']") 

HTMLInput.focus
Sleep 500
HTMLInput.setActive
Sleep 500
HTMLInput.Value = funcLookupUserName(strMGA, strCO)
HTMLInput.setAttribute "value", funcLookupUserName(strMGA, strCO)
HTMLInput.innerText = funcLookupUserName(strMGA, strCO)

Sleep 500

'HTMLInput.dispatchEvent evt
'HTMLInput.dispatchEvent evt2
'HTMLInput.dispatchEvent evt3
'HTMLInput.dispatchEvent evt4

IE.Document.dispatchEvent evt
IE.Document.dispatchEvent evt2

IE.Document.dispatchEvent evt3
IE.Document.dispatchEvent evt4
Sleep 500

'<input name="password" class="auth0-lock-input" type="password" placeholder="your password" value="xxxsomevalueherexxx" autocomplete="off" autocapitalize="off">

Set HTMLInput2 = IE.Document.querySelector("input[placeholder='your password']")
HTMLInput2.focus
Sleep 500
HTMLInput2.setActive
Sleep 500
HTMLInput2.Value = funcLookupPassword(strMGA, strCO)             'password
HTMLInput2.innerText = funcLookupPassword(strMGA, strCO)             'password
HTMLInput2.setAttribute "value", funcLookupPassword(strMGA, strCO)            'password
Sleep 500
'HTMLInput2.dispatchEvent evt
'HTMLInput2.dispatchEvent evt2
'HTMLInput2.dispatchEvent evt3
'HTMLInput2.dispatchEvent evt4

IE.Document.dispatchEvent evt
IE.Document.dispatchEvent evt2
IE.Document.dispatchEvent evt3
IE.Document.dispatchEvent evt4
Sleep 500

'IE.Document.querySelector("input[placeholder='your password']").dispatchEvent evt

 
'i've tried submitting the form too instead of clicking the button
'IE.Document.Forms(0).submit

 
'Click sign in
Set HTMLButton = IE.Document.querySelector("button[type='submit']")
HTMLButton.focus
Sleep 500
HTMLButton.setActive
Sleep 3000
HTMLButton.Click
Debug.Print "Clicked Sign-in

I've tried submitting the form instead of clicking the button. That does not work either. This code does not pause for the website to load yet, but I manually step thru it so that's not my problem. I see the value's appear on the fields in IE & in the deveoper tools the value attribute fills in with a value. I've dispatched events on the fields as well as IE.document. I've tried combinations of. My last version which i'm posting here, used blur, change, input & focus. It looks to me like event listeners are mostly on the main document. When I try to login, the values drop out of the text boxes & they get highlighted in red with "cannot be blank". I know very little on dispatch events so i'm mainly guessing here. any advice would be appreciated.

edit:

'topBlur
'  dispatchEvent: function (topLevelType, nativeEvent) {
'    if (!ReactEventListener._enabled) {
'      return;
'    }
'
'    var bookKeeping = TopLevelCallbackBookKeeping.getPooled(topLevelType, nativeEvent);
'    try {
'      // Event queue being processed in the same cycle allows
'      // `preventDefault`.
'      ReactUpdates.batchedUpdates(handleTopLevelImpl, bookKeeping);
'    } finally {
'      TopLevelCallbackBookKeeping.release(bookKeeping);
'    }
'  }
'};

this function fired on clicking the login button. everything seems to say "topblur". not sure what it means. Also, when i type in the user id, this div changes from

changes too . Then changes back when focus lost.

Answer 1

So after trying many methods, I am left with VBA sendkeys as the answer.

HTMLInput.focus
Sleep 500
HTMLInput.setActive
Sleep 500
SendKeys strUname, True

after focusing on the target field. Then doing the same to the password. But it does work.