I have been wondering (and checked the Bitwarden chrome extension source code but couldn't figure out): how do password managers fill in your passwords?
What I'm trying to say is: some websites require certain events to be fired, such as blur, before they see a field as "filled in".
I tried filling in an e-mail address at this website for example: https://www.scoodle.be/login
When bitwarden fills in my e-mail address and I click on "Log in", it works fine (as expected). However, when I issue the following commands on the console:
document.querySelector('input[type="email"]').value="my@email.com";
document.querySelector('button[type="submit"]').click()
It says "Vul een e-mail adres in" (In english: Fill in an e-mail address)
What is the "magic" that password managers are using so the website does detect the value being put in? I thought it would have to do something with events, but I've fired all of them on the input that I could find... (don't worry about elem, it refers to the document.querySelector(...) above, this was added afterwards)
elem.dispatchEvent(new Event('compositionend'));
elem.dispatchEvent(new Event('compositionstart'));
elem.dispatchEvent(new Event('compositionupdat'));
elem.dispatchEvent(new Event('focus'));
elem.dispatchEvent(new Event('focusin'));
elem.dispatchEvent(new Event('blur'));
elem.dispatchEvent(new Event('focusout'));
elem.dispatchEvent(new Event('keydown'));
elem.dispatchEvent(new Event('keypress'));
elem.dispatchEvent(new Event('keyup'));
elem.dispatchEvent(new Event('mouseenter'));
elem.dispatchEvent(new Event('mousedown'));
elem.dispatchEvent(new Event('mouseup'));
elem.dispatchEvent(new Event('mouseleave'));
elem.dispatchEvent(new Event('mouseout'));
I figured I'd add some mouse events as well cause why not, but none of them is the lucky one Source: https://developer.mozilla.org/en-US/docs/Web/API/Element#events
Am I overlooking something stupid, or..
Posts I have checked and that did not answer my question
- VueJs - Password managers detection They're trying to make their website compatible with a password manager, but that doesn't answer my question.
- How do password managers know when I've logged in successfully? This post is asking how password managers detect when you've logged in succesfully. Not about filling the fields in.
- How do password managers autofill email and password inputs on all sites? A comment claims that password managers have been specifically "trained" for "weird" sites. Although this seems very unlikely as some websites I've tested are not well-known at all. I have checked the source code from Bitwarden and ended up in the AutoFillService implementation. I have been looking for events that are being fired, but can't really figure it out. What am I missing?
- How to do the password managers auto fill username, password in form? This post once again refers to Bitwarden's source code and it's about knowing where to fill in the values. Since I only work with a specific amount of sites, these are hard coded and that's not the issue I'm facing.
Thanks in advance! :-)
Kr Jonas
