Chrome Autofill/Autocomplete no value for password

by

This seems to be a bug in Chrome. When Chrome auto-fills a password on an initial page load (but not a refresh), the value appears in the form field on-screen, but querying passwordField.value in Javascript returns an empty string. If you depend on seeing that value in Javascript, this prevents you from doing so. Once the user does any other action on the page, such as clicking anywhere on the page, the value suddenly becomes visible to Javascript.

I’m not actually 100% sure if this is a bug, or if there is a security reason for doing this such as preventing a hidden frame from stealing your password by tricking the browser into filling it in.

A workaround that we have used is to detect the background color change that Chrome makes to fields that it has auto-filled. Chrome colors the background of auto-filled fields yellow, and this change is always visible to Javascript even when the value is not. Detecting this in Javascript lets us know that the field was auto-filled with a value, even though we see the value as blank in Javascript. In our case, we have a login form where the submit button is not enabled until you fill in something in the password field, and detecting either a value or the auto-fill background-color is good enough to determine that something is in the field. We can then enable the submit button, and clicking the button (or pressing enter) instantly makes the password field value visible to Javascript because interacting with the page fixes the problem, so we can proceed normally from there.

More Related Contents:

  1. How do I load an HTML page in a div using JavaScript?
  2. How does the paste image from clipboard functionality work in Gmail and Google Chrome 12+?
  3. JSFiddle code not working in my own page
  4. Video auto play is not working in Safari and Chrome desktop browser
  5. Chrome counts characters wrong in textarea with maxlength attribute
  6. How to prevent “The play() request was interrupted by a call to pause()” error?
  7. \u200b (Zero width space) characters in my JS code. Where did they come from?
  8. Open IE browser in Firefox/Chrome page
  9. How can I remove the “No file chosen” tooltip from a file input in Chrome?
  10. Is innerHTML asynchronous?
  11. How to clear cache of service worker?
  12. Checkbox Check Event Listener
  13. Cannot access cssRules from local css file in Chrome 64
  14. How do I disable the save password bubble in chrome using Javascript?
  15. How can I retain the scroll position of a scrollable area when pressing back button?
  16. “Status Code:200 OK (from ServiceWorker)” in Chrome Network DevTools?
  17. Animated gif only loops once in Chrome and Firefox
  18. Chrome FileReader
  19. Completely lost on how to save extension popup window content
  20. How to get list of network requests done by HTML
  21. jQuery in Chrome returns “block” instead of “inline”
  22. Making a Chrome Extension download a file
  23. Resource interpreted as Script but transferred with MIME type text/plain – for local file
  24. Chrome Extension “Refused to load the script because it violates the following Content Security Policy directive”
  25. HTML5 drop event doesn’t work unless dragover is handled
  26. Print repeating Page headers in Chrome [closed]
  27. Is there a way to increase the size of localStorage in Google Chrome to avoid QUOTA_EXCEEDED_ERR: DOM Exception 22
  28. Not allowed to load local resource: file
  29. HTML5 Notification not working in Mobile Chrome
  30. Chrome Extension get selected text

Leave a Comment