Як дізнатися, які події JavaScript запускалися?

У мене є список вибору:

<select id="filter">
  <option value="Open" selected="selected">Open</option>
  <option value="Closed">Closed</option>
</select>

Коли я вибираю Closedперезавантаження сторінки. У цьому випадку він показує закриті квитки (замість відкритих). Це добре працює, коли я це роблю вручну.

Проблема полягає в тому, що сторінка не перезавантажується, коли я вибираю за Closedдопомогою Watir :

browser.select_list(:id => "filter").select "Closed"

Зазвичай це означає, що деякі події JavaScript не запускаються. Я можу розпочати події з Watir:

browser.select_list(:id => "filter").fire_event "onclick"

але мені потрібно знати, яку подію підпалити.

Чи є спосіб дізнатися, які події визначені для елемента?

Просто подумав, я додам, що ви можете це зробити і в Chrome:

Ctrl+ Shift+ I(Інструменти для розробників)> Джерела> Точки переривання слухача подій (праворуч).

Ви також можете переглянути всі події, які вже були вкладені, просто клацнувши правою кнопкою миші на елементі та переглянувши його властивості (панель праворуч).

Наприклад:

Не впевнений, чи він такий потужний, як варіант firebug, але цього було достатньо для більшості моїх речей.

Ще один варіант, який є дещо іншим, але дивно приголомшливим - це Visual Event: http://www.sprymedia.co.uk/article/Visual+Event+2

Він висвітлює всі елементи на переплетеній сторінці та має перехоплення, що показують функції, що викликаються. Досить вишукано для закладки! Також є плагін Chrome, якщо це більше - не впевнений у інших браузерах.

AnonymousAndrew також вказав тутmonitorEvents(window);

Схоже, Firebug ( додаток Firefox) має відповідь:

• відкрити Firebug
• клацніть правою кнопкою миші елемент на вкладці HTML
• клацніть Log Events
• включити вкладку Консоль
• натисніть вкладку "Зберегти на консолі" (інакше вкладка "Консоль" очиститься після завантаження сторінки)
• вибрати Closed(вручну)

• на вкладці Консолі буде щось подібне:

  ...
  mousemove clientX=1097, clientY=292
  popupshowing
  mousedown clientX=1097, clientY=292
  focus
  mouseup clientX=1097, clientY=292
  click clientX=1097, clientY=292
  mousemove clientX=1096, clientY=293
  ...

Джерело: Firebug Порада: журнал подій

Що стосується Chrome, огляньте monitorEvents () за допомогою API командного рядка.

• Відкрийте консоль через Меню> Інструменти> Консоль JavaScript.
• Введіть monitorEvents(window);

• Перегляньте консоль, залиту подіями

  ...
  mousemove MouseEvent {dataTransfer: ...}
  mouseout MouseEvent {dataTransfer: ...}
  mouseover MouseEvent {dataTransfer: ...}
  change Event {clipboardData: ...}
  ...

Є й інші приклади в документації . Я здогадуюсь, ця функція була додана після попередньої відповіді.

Ви можете використовувати getEventListeners в консолі розробника Google Chrome .

getEventListeners (об'єкт) повертає слухачам подій, зареєстрованим на вказаному об'єкті.

getEventListeners(document.querySelector('option[value=Closed]'));