Google Chrome Event Listeners Breakpoints

Google Chrome nabízí webovým vývojářům výborný nástroj na debugování událostí. Představme si jednoduchou stránku, na které máme checkbox. Při změně checkboxu se nám odkryje nebo schová div. Pojďme si ukázat, jak najít řádek v JavaScriptu, jenž má schování divu na svědomí.

ukázka na jsFiddle

Zachytíme si na stránce všechny události, které nastanou při "change" v Developer Tools (jde vyvolat Zobrazit > Vývojář > Nástroje pro vývojáře). viz obrázek níže.

Teď už stačí kliknout na checkbox, čímž se vyvolá událost change. viz obrázek níže.

Událost, která zareagovala, se podbarví žlutě ve sloupci Event Listener Breakpoints. V prostředním sloupci se nám zastaví debugger na funkci pro zpracování události. Seznam událostí, které můžeme sledovat, je dlouhý a nemá cenu je tady vypisovat, když jdou jednoduše proklikat.