Как в Crome DevTools можно просматривать все события страницы?

Question

[Ken Jee]

Можно ли как-то просматривать все события, которые происходят на странице? OnLoad, OnClick и т.п. Речь идет не о брейкпоинтах на вкладке Сорс, а именно происходящих событиях в виде лога.

Answer 1

[xtress]

Выполните в консоли monitorEvents(document.body); Увидите все события по мере их появления. Если надо фильтровать - второй аргумент для этой функции: monitorEvents(document.body, 'click'); - покажет все клики.

Comments

[Алексей Уколов]

При stopPropagation они всё равно будут до body доплывать?

[xtress]

Алексей Уколов, А вот это хороший вопрос :). К сожалению, точно ответить я на него не смогу. Но, подозреваю, что вряд ли, соответственно, нужно брать менее "широкий" селектор до которого они доплывут.

[tyzberd]

можно так сделать, тогда и stopPropagation будут. Но те, которые всплывают, будут несколько раз показываться.

var all = document.querySelectorAll('*')
for (each in all) {
    monitorEvents(all[each], ['click']);
};