133

選択リストがあります：

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

選択するとClosed、ページがリロードされます。この場合、(オープンではなく) クローズされたチケットが表示されます。手動で行うとうまくいきます。

問題は、 WatirClosedで選択したときにページがリロードされないことです:

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

これは通常、一部の JavaScript イベントが発生していないことを意味します。Watir でイベントを発生させることができます。

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

しかし、どのイベントを起動するかを知る必要があります。

要素に対して定義されているイベントを見つける方法はありますか?

4

5 に答える 5

159

Chromeでもこれを行うことができると付け加えたいと思いました：

Ctrl+ Shift+ I(開発者ツール) > ソース > イベント リスナー ブレークポイント (右側)。

要素を右クリックしてそのプロパティを参照するだけで、既に関連付けられているすべてのイベントを表示することもできます (右側のパネル)。

例えば：

  • 左側の賛成ボタンを右クリック
  • 検査要素を選択
  • スタイル セクションを折りたたむ (右端のセクション - ダブル シェブロン)
  • イベントリスナーオプションを展開します
  • これで、賛成票にバインドされたイベントを確認できます

    • それがfirebugオプションと同じくらい強力かどうかはわかりませんが、私のほとんどのものには十分です.

    少し異なるが驚くほど素晴らしいもう 1 つのオプションは、Visual Event です: http://www.sprymedia.co.uk/article/Visual+Event+2

    バインドされているページ上のすべての要素が強調表示され、呼び出された関数を示すポップオーバーがあります。ブックマークにかなり気の利いた！それがもっとあなたのものであれば、Chromeプラグインもあります-他のブラウザについてはわかりません.

    AnonymousAndrewもここで指摘していますmonitorEvents(window);

    于 2011-09-05T02:02:01.297 に答える
    115

    Firebug (Firefox アドオン) に答えがあるようです:

    • ファイアーバグを開く
    • HTMLタブの要素を右クリック
    • クリックLog Events
    • コンソールタブを有効にする
    • [Console] タブで [Persist] をクリックします (そうしないと、ページがリロードされた後に [Console] タブがクリアされます)。
    • 選択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 ヒント: ログ イベント

    于 2010-09-24T13:32:02.260 に答える
    82

    Chrome に関しては、コマンドライン API 経由で monitorEvents() をチェックアウトします。

    • [メニュー] > [ツール] > [JavaScript コンソール] からコンソールを開きます。

    • 入るmonitorEvents(window);

    • イベントがあふれたコンソールを表示する

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

    ドキュメントには他の例があります。この機能は、前の回答の後に追加されたと思います。

    于 2013-11-05T16:18:08.230 に答える