발생한 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(개발자 도구)> 소스> 이벤트 리스너 중단 점 (오른쪽).

요소를 마우스 오른쪽 버튼으로 클릭 한 다음 해당 속성 (오른쪽 패널)을 검색하여 이미 첨부 된 모든 이벤트를 볼 수도 있습니다.

예를 들면 :

방화범 옵션만큼 강력한 지 확실하지 않지만 대부분의 경우 충분했습니다.

약간 다르지만 놀랍도록 멋진 또 다른 옵션은 Visual Event입니다. http://www.sprymedia.co.uk/article/Visual+Event+2

바인딩 된 페이지의 모든 요소를 ​​강조 표시하고 호출 된 함수를 보여주는 팝 오버가 있습니다. 북마크에 대한 꽤 멋진! 다른 브라우저에 대해서는 확실하지 않은 경우 Chrome 플러그인도 있습니다.

AnonymousAndrew 도 여기서 지적했습니다 .monitorEvents(window);

처럼 보이는 방화범은 (파이어 폭스 부가 기능) 답이있다 :

• 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과 관련하여 명령 줄 API를 통해 monitorEvents ()를 확인하십시오.

• 메뉴> 도구> JavaScript 콘솔을 통해 콘솔을 엽니 다.
• 시작하다 monitorEvents(window);

• 이벤트로 가득 찬 콘솔보기

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

설명서 에는 다른 예가 있습니다 . 이 기능은 이전 답변 이후에 추가 된 것 같습니다.

Google 크롬 개발자 콘솔 에서 getEventListeners 를 사용할 수 있습니다 .

getEventListeners (object)는 지정된 객체에 등록 된 이벤트 리스너를 반환합니다.

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