Image for post
Image for post
A função que tudo vê, ou escuta?

Monitorando todos os eventos de um elemento

Recentemente eu comecei a pesquisar sobre a opção de preenchimento automático (ou autofill) e as opções que os navegadores disponibilizam aos desenvolvedores para preencherem os campos automaticamente para os usuários. Os navegadores que utilizam Blink e WebKit tem uma pseudo classe em CSS na qual você pode utilizar (mais sobre isso em outro post), mas o Firefox não tem.

Fora isso, nada muito claro, afinal, deve haver algum outro tipo de evento para isso, certo?

Chrome DevTools tem uma função muito útil chamada monitorEvents, você chama ela utilizando um elemento do DOM como argumento e ela vai retornar (através de logs no console) todos os eventos que acontecem naquele elemento.

Image for post
Image for post
Esse é o ID do input do Google

Megan Kearny e Flavio Cotes escrevem recentemente sobre o monitorEvents e várias outras funções muito úteis no nosso site WebFundamentals, vale a pena dar uma olhada!

No Firefox, nós não temos esse função utilitária, então, eu escrevi a minha própria (:

Não há garantia nenhuma de precisão, mas, funciona para mim!

¯\_(ツ)_/¯

Créditos

Written by

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store