JavaScript can't read Chrome's auto-fill password field until the page is interacted with by the user

Question

See the issue happening here:

https://gfycat.com/BelatedLawfulBighorn

The issue is that until the user interacts with the page (I just click inside the password field in this example), JavaScript can't read the password field if it is auto-filled by Chrome. Is this on my end? Is this some security feature built into Chrome?

To rule some things out, here's what I've tried and none have worked:

• Using vanilla JS
• Programmatically triggering a click somewhere on the page
• Giving any of the input fields focus on page load
• Giving any of the input fields focus on page load after a timeout of a few hundred milliseconds

Answer 1

It is not possible to read the values until the user interacts with the page.

The reason is, that events have the isTrusted property. "The isTrusted read-only property of the Event interface is a Boolean that is true when the event was generated by a user action, and false when the event was created or modified by a script or dispatched via EventTarget.dispatchEvent()." (from https://developer.mozilla.org/en-US/docs/Web/API/Event/isTrusted).

Chrome autofill values only become readable with a isTrusted=true event.

Note: window.scroll() always has isTrusted=true. But it doesnt make the autofill values readable!

Answer 2

Solved my own problem!

If I put everything inside a form, and instead of listening for the "enter" keydown event, I just listened for the "submit" event on the form, then JavaScript could read the value of my password field.